diff --git a/.changeset/angry-maps-serve.md b/.changeset/angry-maps-serve.md new file mode 100644 index 0000000000..2bfc7db03c --- /dev/null +++ b/.changeset/angry-maps-serve.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/theme": patch +--- + +move circular-progress tv to progress diff --git a/.changeset/cold-dolls-vanish.md b/.changeset/cold-dolls-vanish.md new file mode 100644 index 0000000000..eba5f406b5 --- /dev/null +++ b/.changeset/cold-dolls-vanish.md @@ -0,0 +1,6 @@ +--- +"@nextui-org/drawer": patch +"@nextui-org/modal": patch +--- + +Drawer styles and transition improved diff --git a/.changeset/curly-rules-warn.md b/.changeset/curly-rules-warn.md new file mode 100644 index 0000000000..b86fd4c1ea --- /dev/null +++ b/.changeset/curly-rules-warn.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/calendar": patch +--- + +add missing `framer-motion` in `peerDependencies` diff --git a/.changeset/empty-helper-wrapper-div.md b/.changeset/empty-helper-wrapper-div.md new file mode 100644 index 0000000000..ca62626cd4 --- /dev/null +++ b/.changeset/empty-helper-wrapper-div.md @@ -0,0 +1,6 @@ +--- +"@nextui-org/select": patch +"@nextui-org/input": patch +--- + +- Fixed a UI sliding issue caused by the helper wrapper being rendered when `isInvalid` was false but `errorMessage` was present diff --git a/.changeset/famous-experts-buy.md b/.changeset/famous-experts-buy.md new file mode 100644 index 0000000000..c1b36c4857 --- /dev/null +++ b/.changeset/famous-experts-buy.md @@ -0,0 +1,86 @@ +--- +"@nextui-org/accordion": patch +"@nextui-org/alert": patch +"@nextui-org/autocomplete": patch +"@nextui-org/avatar": patch +"@nextui-org/badge": patch +"@nextui-org/breadcrumbs": patch +"@nextui-org/button": patch +"@nextui-org/calendar": patch +"@nextui-org/card": patch +"@nextui-org/checkbox": patch +"@nextui-org/chip": patch +"@nextui-org/code": patch +"@nextui-org/date-input": patch +"@nextui-org/date-picker": patch +"@nextui-org/divider": patch +"@nextui-org/drawer": patch +"@nextui-org/dropdown": patch +"@nextui-org/image": patch +"@nextui-org/input": patch +"@nextui-org/kbd": patch +"@nextui-org/link": patch +"@nextui-org/listbox": patch +"@nextui-org/menu": patch +"@nextui-org/modal": patch +"@nextui-org/navbar": patch +"@nextui-org/pagination": patch +"@nextui-org/popover": patch +"@nextui-org/progress": patch +"@nextui-org/radio": patch +"@nextui-org/ripple": patch +"@nextui-org/scroll-shadow": patch +"@nextui-org/select": patch +"@nextui-org/skeleton": patch +"@nextui-org/slider": patch +"@nextui-org/snippet": patch +"@nextui-org/spacer": patch +"@nextui-org/spinner": patch +"@nextui-org/switch": patch +"@nextui-org/table": patch +"@nextui-org/tabs": patch +"@nextui-org/tooltip": patch +"@nextui-org/user": patch +"@nextui-org/react": patch +"@nextui-org/system": patch +"@nextui-org/system-rsc": patch +"@nextui-org/theme": patch +"@nextui-org/use-aria-accordion": patch +"@nextui-org/use-aria-accordion-item": patch +"@nextui-org/use-aria-button": patch +"@nextui-org/use-aria-link": patch +"@nextui-org/use-aria-menu": patch +"@nextui-org/use-aria-modal-overlay": patch +"@nextui-org/use-aria-multiselect": patch +"@nextui-org/use-aria-toggle-button": patch +"@nextui-org/use-callback-ref": patch +"@nextui-org/use-clipboard": patch +"@nextui-org/use-data-scroll-overflow": patch +"@nextui-org/use-disclosure": patch +"@nextui-org/use-draggable": patch +"@nextui-org/use-image": patch +"@nextui-org/use-infinite-scroll": patch +"@nextui-org/use-intersection-observer": patch +"@nextui-org/use-is-mobile": patch +"@nextui-org/use-is-mounted": patch +"@nextui-org/use-measure": patch +"@nextui-org/use-pagination": patch +"@nextui-org/use-real-shape": patch +"@nextui-org/use-ref-state": patch +"@nextui-org/use-resize": patch +"@nextui-org/use-safe-layout-effect": patch +"@nextui-org/use-scroll-position": patch +"@nextui-org/use-ssr": patch +"@nextui-org/use-theme": patch +"@nextui-org/use-update-effect": patch +"@nextui-org/aria-utils": patch +"@nextui-org/dom-animation": patch +"@nextui-org/framer-utils": patch +"@nextui-org/react-rsc-utils": patch +"@nextui-org/react-utils": patch +"@nextui-org/shared-icons": patch +"@nextui-org/shared-utils": patch +"@nextui-org/test-utils": patch +--- + +Test new runner diff --git a/.changeset/few-jars-flow.md b/.changeset/few-jars-flow.md index a3d2b6cfd3..96d7e301e3 100644 --- a/.changeset/few-jars-flow.md +++ b/.changeset/few-jars-flow.md @@ -1,8 +1,10 @@ --- "@nextui-org/table": minor "@nextui-org/accordion": minor +"@nextui-org/alert": minor "@nextui-org/autocomplete": minor "@nextui-org/avatar": minor +"@nextui-org/badge": minor "@nextui-org/breadcrumbs": minor "@nextui-org/button": minor "@nextui-org/calendar": minor @@ -11,9 +13,12 @@ "@nextui-org/chip": minor "@nextui-org/date-input": minor "@nextui-org/date-picker": minor -"@nextui-org/divider": minor "@nextui-org/dropdown": minor "@nextui-org/input": minor +"@nextui-org/code": minor +"@nextui-org/divider": minor +"@nextui-org/image": minor +"@nextui-org/drawer": minor "@nextui-org/kbd": minor "@nextui-org/link": minor "@nextui-org/listbox": minor @@ -24,8 +29,13 @@ "@nextui-org/popover": minor "@nextui-org/progress": minor "@nextui-org/radio": minor +"@nextui-org/scroll-shadow": minor +"@nextui-org/ripple": minor "@nextui-org/select": minor "@nextui-org/slider": minor +"@nextui-org/skeleton": minor +"@nextui-org/spacer": minor +"@nextui-org/spinner": minor "@nextui-org/snippet": minor "@nextui-org/switch": minor "@nextui-org/tabs": minor @@ -33,6 +43,7 @@ "@nextui-org/user": minor "@nextui-org/react": minor "@nextui-org/system": minor +"@nextui-org/theme": minor "@nextui-org/system-rsc": minor "@nextui-org/use-aria-accordion": minor "@nextui-org/use-aria-accordion-item": minor @@ -41,13 +52,14 @@ "@nextui-org/use-aria-menu": minor "@nextui-org/use-aria-modal-overlay": minor "@nextui-org/use-aria-multiselect": minor -"@nextui-org/use-aria-overlay": minor "@nextui-org/use-aria-toggle-button": minor "@nextui-org/use-disclosure": minor "@nextui-org/use-intersection-observer": minor "@nextui-org/use-is-mobile": minor "@nextui-org/use-pagination": minor "@nextui-org/aria-utils": minor +"@nextui-org/use-ssr": minor +"@nextui-org/use-theme": minor --- update react-aria version diff --git a/.changeset/fluffy-icons-refuse.md b/.changeset/fluffy-icons-refuse.md new file mode 100644 index 0000000000..bfde0510a8 --- /dev/null +++ b/.changeset/fluffy-icons-refuse.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/table": patch +--- + +Currently, whenever any arrow-key keypress is triggered it navigates the focus to other cell/row. This creates an issue when the table cell contains a component which requires this keys for specific purpose (eg. if a table cell contains input component, it might need arrow keys for editing. But it is not possible because whenever the keypress triggers navigation). The PR adds an `isKeyboardNavigationDisabled` prop to disable the navigation. diff --git a/.changeset/fuzzy-lies-brush.md b/.changeset/fuzzy-lies-brush.md new file mode 100644 index 0000000000..f06b5c2678 --- /dev/null +++ b/.changeset/fuzzy-lies-brush.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/table": patch +--- + +The `layoutNode` prop has been removed due to the update to react-aria. diff --git a/.changeset/gentle-needles-rescue.md b/.changeset/gentle-needles-rescue.md new file mode 100644 index 0000000000..7c51ef52b4 --- /dev/null +++ b/.changeset/gentle-needles-rescue.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/use-image": patch +--- + +use-image hook logic restore to the previous one to avoid nextjs hydration issues diff --git a/.changeset/happy-parrots-search.md b/.changeset/happy-parrots-search.md new file mode 100644 index 0000000000..61a3594010 --- /dev/null +++ b/.changeset/happy-parrots-search.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/theme": patch +--- + +apply tw nested group (#3544, #2324, #2959) diff --git a/.changeset/kind-insects-end.md b/.changeset/kind-insects-end.md new file mode 100644 index 0000000000..71e7bedb09 --- /dev/null +++ b/.changeset/kind-insects-end.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/use-image": patch +--- + +server validation added to the use-image hook diff --git a/.changeset/lazy-buttons-exercise.md b/.changeset/lazy-buttons-exercise.md new file mode 100644 index 0000000000..5cdc25373d --- /dev/null +++ b/.changeset/lazy-buttons-exercise.md @@ -0,0 +1,7 @@ +--- +"@nextui-org/listbox": patch +"@nextui-org/menu": patch +"@nextui-org/theme": patch +--- + +Add truncate class to the list item to avoid overflow the wrapper diff --git a/.changeset/light-needles-behave.md b/.changeset/light-needles-behave.md index 9ebdcb81f4..7fbe059519 100644 --- a/.changeset/light-needles-behave.md +++ b/.changeset/light-needles-behave.md @@ -1,5 +1,5 @@ --- -"@nextui-org/use-theme": minor +"@nextui-org/use-theme": patch --- introduce `use-theme` hook diff --git a/.changeset/moody-rabbits-shop.md b/.changeset/moody-rabbits-shop.md new file mode 100644 index 0000000000..8fec710f2e --- /dev/null +++ b/.changeset/moody-rabbits-shop.md @@ -0,0 +1,7 @@ +--- +"@nextui-org/calendar": patch +"@nextui-org/tabs": patch +"@nextui-org/shared-utils": patch +--- + +support inert value with boolean type for react 19 (#4038) diff --git a/.changeset/neat-donkeys-accept.md b/.changeset/neat-donkeys-accept.md index 42cad71a69..4b5ab5f29e 100644 --- a/.changeset/neat-donkeys-accept.md +++ b/.changeset/neat-donkeys-accept.md @@ -1,6 +1,6 @@ --- -"@nextui-org/date-picker": minor -"@nextui-org/theme": minor +"@nextui-org/date-picker": patch +"@nextui-org/theme": patch --- Add support for selectorButtonPlacement property (#3015) diff --git a/.changeset/new-cougars-collect.md b/.changeset/new-cougars-collect.md new file mode 100644 index 0000000000..292c420571 --- /dev/null +++ b/.changeset/new-cougars-collect.md @@ -0,0 +1,6 @@ +--- +"@nextui-org/alert": patch +"@nextui-org/theme": patch +--- + +Alert styles improved diff --git a/.changeset/plenty-scissors-love.md b/.changeset/plenty-scissors-love.md new file mode 100644 index 0000000000..6c1b85df76 --- /dev/null +++ b/.changeset/plenty-scissors-love.md @@ -0,0 +1,77 @@ +--- +"@nextui-org/accordion": patch +"@nextui-org/alert": patch +"@nextui-org/autocomplete": patch +"@nextui-org/avatar": patch +"@nextui-org/badge": patch +"@nextui-org/breadcrumbs": patch +"@nextui-org/button": patch +"@nextui-org/calendar": patch +"@nextui-org/card": patch +"@nextui-org/checkbox": patch +"@nextui-org/chip": patch +"@nextui-org/code": patch +"@nextui-org/date-input": patch +"@nextui-org/date-picker": patch +"@nextui-org/divider": patch +"@nextui-org/drawer": patch +"@nextui-org/dropdown": patch +"@nextui-org/image": patch +"@nextui-org/input": patch +"@nextui-org/kbd": patch +"@nextui-org/link": patch +"@nextui-org/listbox": patch +"@nextui-org/menu": patch +"@nextui-org/modal": patch +"@nextui-org/navbar": patch +"@nextui-org/pagination": patch +"@nextui-org/popover": patch +"@nextui-org/progress": patch +"@nextui-org/radio": patch +"@nextui-org/ripple": patch +"@nextui-org/scroll-shadow": patch +"@nextui-org/select": patch +"@nextui-org/skeleton": patch +"@nextui-org/slider": patch +"@nextui-org/snippet": patch +"@nextui-org/spacer": patch +"@nextui-org/spinner": patch +"@nextui-org/switch": patch +"@nextui-org/table": patch +"@nextui-org/tabs": patch +"@nextui-org/tooltip": patch +"@nextui-org/user": patch +"@nextui-org/react": patch +"@nextui-org/system": patch +"@nextui-org/system-rsc": patch +"@nextui-org/theme": patch +"@nextui-org/use-aria-accordion": patch +"@nextui-org/use-aria-accordion-item": patch +"@nextui-org/use-aria-button": patch +"@nextui-org/use-aria-link": patch +"@nextui-org/use-aria-menu": patch +"@nextui-org/use-aria-modal-overlay": patch +"@nextui-org/use-aria-multiselect": patch +"@nextui-org/use-aria-toggle-button": patch +"@nextui-org/use-clipboard": patch +"@nextui-org/use-data-scroll-overflow": patch +"@nextui-org/use-disclosure": patch +"@nextui-org/use-draggable": patch +"@nextui-org/use-image": patch +"@nextui-org/use-infinite-scroll": patch +"@nextui-org/use-intersection-observer": patch +"@nextui-org/use-is-mobile": patch +"@nextui-org/use-pagination": patch +"@nextui-org/use-real-shape": patch +"@nextui-org/use-ref-state": patch +"@nextui-org/use-theme": patch +"@nextui-org/aria-utils": patch +"@nextui-org/dom-animation": patch +"@nextui-org/framer-utils": patch +"@nextui-org/react-utils": patch +"@nextui-org/shared-icons": patch +"@nextui-org/shared-utils": patch +"@nextui-org/test-utils": patch +--- + +Beta 1 diff --git a/.changeset/polite-mails-kneel.md b/.changeset/polite-mails-kneel.md new file mode 100644 index 0000000000..d573540365 --- /dev/null +++ b/.changeset/polite-mails-kneel.md @@ -0,0 +1,47 @@ +--- +"@nextui-org/accordion": patch +"@nextui-org/avatar": patch +"@nextui-org/breadcrumbs": patch +"@nextui-org/button": patch +"@nextui-org/calendar": patch +"@nextui-org/card": patch +"@nextui-org/chip": patch +"@nextui-org/date-input": patch +"@nextui-org/divider": patch +"@nextui-org/dropdown": patch +"@nextui-org/kbd": patch +"@nextui-org/link": patch +"@nextui-org/listbox": patch +"@nextui-org/menu": patch +"@nextui-org/modal": patch +"@nextui-org/navbar": patch +"@nextui-org/pagination": patch +"@nextui-org/popover": patch +"@nextui-org/progress": patch +"@nextui-org/select": patch +"@nextui-org/slider": patch +"@nextui-org/snippet": patch +"@nextui-org/switch": patch +"@nextui-org/tabs": patch +"@nextui-org/tooltip": patch +"@nextui-org/user": patch +"@nextui-org/react": patch +"@nextui-org/system": patch +"@nextui-org/system-rsc": patch +"@nextui-org/use-aria-accordion": patch +"@nextui-org/use-aria-accordion-item": patch +"@nextui-org/use-aria-button": patch +"@nextui-org/use-aria-link": patch +"@nextui-org/use-aria-menu": patch +"@nextui-org/use-aria-modal-overlay": patch +"@nextui-org/use-aria-multiselect": patch +"@nextui-org/use-aria-overlay": patch +"@nextui-org/use-aria-toggle-button": patch +"@nextui-org/use-disclosure": patch +"@nextui-org/use-intersection-observer": patch +"@nextui-org/use-is-mobile": patch +"@nextui-org/use-pagination": patch +"@nextui-org/aria-utils": patch +--- + +update react-aria version diff --git a/.changeset/pre.json b/.changeset/pre.json new file mode 100644 index 0000000000..e478bd44d1 --- /dev/null +++ b/.changeset/pre.json @@ -0,0 +1,150 @@ +{ + "mode": "pre", + "tag": "beta", + "initialVersions": { + "@nextui-org/docs": "2.0.0", + "@nextui-org/accordion": "2.0.40", + "@nextui-org/alert": "2.0.0", + "@nextui-org/autocomplete": "2.1.7", + "@nextui-org/avatar": "2.0.33", + "@nextui-org/badge": "2.0.32", + "@nextui-org/breadcrumbs": "2.0.13", + "@nextui-org/button": "2.0.38", + "@nextui-org/calendar": "2.0.12", + "@nextui-org/card": "2.0.34", + "@nextui-org/checkbox": "2.1.5", + "@nextui-org/chip": "2.0.33", + "@nextui-org/code": "2.0.33", + "@nextui-org/date-input": "2.1.4", + "@nextui-org/date-picker": "2.1.8", + "@nextui-org/divider": "2.0.32", + "@nextui-org/drawer": "2.0.0", + "@nextui-org/dropdown": "2.1.31", + "@nextui-org/image": "2.0.32", + "@nextui-org/input": "2.2.5", + "@nextui-org/kbd": "2.0.34", + "@nextui-org/link": "2.0.35", + "@nextui-org/listbox": "2.1.27", + "@nextui-org/menu": "2.0.30", + "@nextui-org/modal": "2.0.41", + "@nextui-org/navbar": "2.0.37", + "@nextui-org/pagination": "2.0.36", + "@nextui-org/popover": "2.1.29", + "@nextui-org/progress": "2.0.34", + "@nextui-org/radio": "2.1.5", + "@nextui-org/ripple": "2.0.33", + "@nextui-org/scroll-shadow": "2.1.20", + "@nextui-org/select": "2.2.7", + "@nextui-org/skeleton": "2.0.32", + "@nextui-org/slider": "2.2.17", + "@nextui-org/snippet": "2.0.43", + "@nextui-org/spacer": "2.0.33", + "@nextui-org/spinner": "2.0.34", + "@nextui-org/switch": "2.0.34", + "@nextui-org/table": "2.0.40", + "@nextui-org/tabs": "2.0.37", + "@nextui-org/tooltip": "2.0.41", + "@nextui-org/user": "2.0.34", + "@nextui-org/react": "2.4.8", + "@nextui-org/system": "2.2.6", + "@nextui-org/system-rsc": "2.1.6", + "@nextui-org/theme": "2.2.11", + "@nextui-org/use-aria-accordion": "2.0.7", + "@nextui-org/use-aria-accordion-item": "2.0.10", + "@nextui-org/use-aria-button": "2.0.10", + "@nextui-org/use-aria-link": "2.0.19", + "@nextui-org/use-aria-menu": "2.0.7", + "@nextui-org/use-aria-modal-overlay": "2.0.13", + "@nextui-org/use-aria-multiselect": "2.2.5", + "@nextui-org/use-aria-toggle-button": "2.0.10", + "@nextui-org/use-callback-ref": "2.0.6", + "@nextui-org/use-clipboard": "2.0.7", + "@nextui-org/use-data-scroll-overflow": "2.1.7", + "@nextui-org/use-disclosure": "2.0.10", + "@nextui-org/use-draggable": "2.0.0", + "@nextui-org/use-image": "2.0.6", + "@nextui-org/use-infinite-scroll": "2.1.5", + "@nextui-org/use-intersection-observer": "2.0.5", + "@nextui-org/use-is-mobile": "2.0.9", + "@nextui-org/use-is-mounted": "2.0.6", + "@nextui-org/use-measure": "2.0.2", + "@nextui-org/use-pagination": "2.0.10", + "@nextui-org/use-real-shape": "2.0.17", + "@nextui-org/use-ref-state": "2.0.7", + "@nextui-org/use-resize": "2.0.6", + "@nextui-org/use-safe-layout-effect": "2.0.6", + "@nextui-org/use-scroll-position": "2.0.9", + "@nextui-org/use-ssr": "2.0.6", + "@nextui-org/use-theme": "2.0.0", + "@nextui-org/use-update-effect": "2.0.6", + "@nextui-org/storybook": "2.0.0", + "@nextui-org/aria-utils": "2.0.26", + "@nextui-org/dom-animation": "2.0.0", + "@nextui-org/framer-utils": "2.0.25", + "@nextui-org/react-rsc-utils": "2.0.14", + "@nextui-org/react-utils": "2.0.17", + "@nextui-org/shared-icons": "2.0.9", + "@nextui-org/shared-utils": "2.0.8", + "@nextui-org/stories-utils": "2.0.3", + "@nextui-org/test-utils": "2.0.6" + }, + "changesets": [ + "angry-maps-serve", + "calm-trees-serve", + "cold-dolls-vanish", + "curly-rules-warn", + "curly-zoos-thank", + "dirty-moles-refuse", + "dull-bags-divide", + "empty-helper-wrapper-div", + "famous-experts-buy", + "fast-horses-explode", + "few-jars-flow", + "flat-pants-accept", + "fluffy-icons-refuse", + "forty-doors-flash", + "gentle-needles-rescue", + "giant-worms-hammer", + "grumpy-mayflies-rhyme", + "happy-parrots-search", + "kind-cobras-travel", + "kind-insects-end", + "lazy-buttons-exercise", + "light-needles-behave", + "mean-mangos-occur", + "mighty-birds-deny", + "moody-rabbits-shop", + "neat-donkeys-accept", + "new-cougars-collect", + "pink-beans-sit", + "plenty-scissors-love", + "poor-moose-double", + "poor-sheep-repair", + "popular-pigs-begin", + "pretty-parrots-guess", + "proud-chicken-impress", + "quick-geckos-punch", + "red-camels-build", + "selfish-baboons-know", + "shy-mails-live", + "silly-candles-wonder", + "sixty-ties-knock", + "slimy-cats-brush", + "slow-paws-punch", + "smooth-mayflies-wonder", + "soft-apricots-sleep", + "sour-seas-buy", + "swift-news-complain", + "tame-planes-think", + "ten-paws-relate", + "tender-buses-sort", + "thirty-cheetahs-guess", + "tough-brooms-hunt", + "tricky-fans-draw", + "twelve-papayas-clean", + "twelve-trains-smile", + "two-waves-own", + "wild-jobs-explain", + "witty-socks-bathe" + ] +} diff --git a/.changeset/pretty-parrots-guess.md b/.changeset/pretty-parrots-guess.md new file mode 100644 index 0000000000..444998fd5b --- /dev/null +++ b/.changeset/pretty-parrots-guess.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/system": patch +--- + +Add reducedMotion setting to Provider (#3395) diff --git a/.changeset/proud-chicken-impress.md b/.changeset/proud-chicken-impress.md new file mode 100644 index 0000000000..123e5647ab --- /dev/null +++ b/.changeset/proud-chicken-impress.md @@ -0,0 +1,7 @@ +--- +"@nextui-org/autocomplete": patch +"@nextui-org/listbox": patch +"@nextui-org/theme": patch +--- + +Virtualization support added to Listbox & Autocomplete diff --git a/.changeset/purple-berries-play.md b/.changeset/purple-berries-play.md new file mode 100644 index 0000000000..cd3773e8b4 --- /dev/null +++ b/.changeset/purple-berries-play.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/form": patch +--- + +add form component diff --git a/.changeset/red-camels-build.md b/.changeset/red-camels-build.md new file mode 100644 index 0000000000..14c8457359 --- /dev/null +++ b/.changeset/red-camels-build.md @@ -0,0 +1,86 @@ +--- +"@nextui-org/accordion": patch +"@nextui-org/alert": patch +"@nextui-org/autocomplete": patch +"@nextui-org/avatar": patch +"@nextui-org/badge": patch +"@nextui-org/breadcrumbs": patch +"@nextui-org/button": patch +"@nextui-org/calendar": patch +"@nextui-org/card": patch +"@nextui-org/checkbox": patch +"@nextui-org/chip": patch +"@nextui-org/code": patch +"@nextui-org/date-input": patch +"@nextui-org/date-picker": patch +"@nextui-org/divider": patch +"@nextui-org/drawer": patch +"@nextui-org/dropdown": patch +"@nextui-org/image": patch +"@nextui-org/input": patch +"@nextui-org/kbd": patch +"@nextui-org/link": patch +"@nextui-org/listbox": patch +"@nextui-org/menu": patch +"@nextui-org/modal": patch +"@nextui-org/navbar": patch +"@nextui-org/pagination": patch +"@nextui-org/popover": patch +"@nextui-org/progress": patch +"@nextui-org/radio": patch +"@nextui-org/ripple": patch +"@nextui-org/scroll-shadow": patch +"@nextui-org/select": patch +"@nextui-org/skeleton": patch +"@nextui-org/slider": patch +"@nextui-org/snippet": patch +"@nextui-org/spacer": patch +"@nextui-org/spinner": patch +"@nextui-org/switch": patch +"@nextui-org/table": patch +"@nextui-org/tabs": patch +"@nextui-org/tooltip": patch +"@nextui-org/user": patch +"@nextui-org/react": patch +"@nextui-org/system": patch +"@nextui-org/system-rsc": patch +"@nextui-org/theme": patch +"@nextui-org/use-aria-accordion": patch +"@nextui-org/use-aria-accordion-item": patch +"@nextui-org/use-aria-button": patch +"@nextui-org/use-aria-link": patch +"@nextui-org/use-aria-menu": patch +"@nextui-org/use-aria-modal-overlay": patch +"@nextui-org/use-aria-multiselect": patch +"@nextui-org/use-aria-toggle-button": patch +"@nextui-org/use-callback-ref": patch +"@nextui-org/use-clipboard": patch +"@nextui-org/use-data-scroll-overflow": patch +"@nextui-org/use-disclosure": patch +"@nextui-org/use-draggable": patch +"@nextui-org/use-image": patch +"@nextui-org/use-infinite-scroll": patch +"@nextui-org/use-intersection-observer": patch +"@nextui-org/use-is-mobile": patch +"@nextui-org/use-is-mounted": patch +"@nextui-org/use-measure": patch +"@nextui-org/use-pagination": patch +"@nextui-org/use-real-shape": patch +"@nextui-org/use-ref-state": patch +"@nextui-org/use-resize": patch +"@nextui-org/use-safe-layout-effect": patch +"@nextui-org/use-scroll-position": patch +"@nextui-org/use-ssr": patch +"@nextui-org/use-theme": patch +"@nextui-org/use-update-effect": patch +"@nextui-org/aria-utils": patch +"@nextui-org/dom-animation": patch +"@nextui-org/framer-utils": patch +"@nextui-org/react-rsc-utils": patch +"@nextui-org/react-utils": patch +"@nextui-org/shared-icons": patch +"@nextui-org/shared-utils": patch +"@nextui-org/test-utils": patch +--- + +React 19 added to peerDeps diff --git a/.changeset/selfish-baboons-know.md b/.changeset/selfish-baboons-know.md new file mode 100644 index 0000000000..38ceb57b9c --- /dev/null +++ b/.changeset/selfish-baboons-know.md @@ -0,0 +1,7 @@ +--- +"@nextui-org/alert": patch +"@nextui-org/theme": patch +"@nextui-org/shared-icons": patch +--- + +Alert design improved diff --git a/.changeset/sharp-pianos-pump.md b/.changeset/sharp-pianos-pump.md new file mode 100644 index 0000000000..4a8c5c6d8c --- /dev/null +++ b/.changeset/sharp-pianos-pump.md @@ -0,0 +1,9 @@ +--- +"@nextui-org/autocomplete": patch +"@nextui-org/checkbox": patch +"@nextui-org/date-picker": patch +"@nextui-org/input": patch +"@nextui-org/radio": patch +--- + +support server validation with form diff --git a/.changeset/silly-candles-wonder.md b/.changeset/silly-candles-wonder.md new file mode 100644 index 0000000000..b7d07f6a42 --- /dev/null +++ b/.changeset/silly-candles-wonder.md @@ -0,0 +1,86 @@ +--- +"@nextui-org/accordion": patch +"@nextui-org/alert": patch +"@nextui-org/autocomplete": patch +"@nextui-org/avatar": patch +"@nextui-org/badge": patch +"@nextui-org/breadcrumbs": patch +"@nextui-org/button": patch +"@nextui-org/calendar": patch +"@nextui-org/card": patch +"@nextui-org/checkbox": patch +"@nextui-org/chip": patch +"@nextui-org/code": patch +"@nextui-org/date-input": patch +"@nextui-org/date-picker": patch +"@nextui-org/divider": patch +"@nextui-org/drawer": patch +"@nextui-org/dropdown": patch +"@nextui-org/image": patch +"@nextui-org/input": patch +"@nextui-org/kbd": patch +"@nextui-org/link": patch +"@nextui-org/listbox": patch +"@nextui-org/menu": patch +"@nextui-org/modal": patch +"@nextui-org/navbar": patch +"@nextui-org/pagination": patch +"@nextui-org/popover": patch +"@nextui-org/progress": patch +"@nextui-org/radio": patch +"@nextui-org/ripple": patch +"@nextui-org/scroll-shadow": patch +"@nextui-org/select": patch +"@nextui-org/skeleton": patch +"@nextui-org/slider": patch +"@nextui-org/snippet": patch +"@nextui-org/spacer": patch +"@nextui-org/spinner": patch +"@nextui-org/switch": patch +"@nextui-org/table": patch +"@nextui-org/tabs": patch +"@nextui-org/tooltip": patch +"@nextui-org/user": patch +"@nextui-org/react": patch +"@nextui-org/system": patch +"@nextui-org/system-rsc": patch +"@nextui-org/theme": patch +"@nextui-org/use-aria-accordion": patch +"@nextui-org/use-aria-accordion-item": patch +"@nextui-org/use-aria-button": patch +"@nextui-org/use-aria-link": patch +"@nextui-org/use-aria-menu": patch +"@nextui-org/use-aria-modal-overlay": patch +"@nextui-org/use-aria-multiselect": patch +"@nextui-org/use-aria-toggle-button": patch +"@nextui-org/use-callback-ref": patch +"@nextui-org/use-clipboard": patch +"@nextui-org/use-data-scroll-overflow": patch +"@nextui-org/use-disclosure": patch +"@nextui-org/use-draggable": patch +"@nextui-org/use-image": patch +"@nextui-org/use-infinite-scroll": patch +"@nextui-org/use-intersection-observer": patch +"@nextui-org/use-is-mobile": patch +"@nextui-org/use-is-mounted": patch +"@nextui-org/use-measure": patch +"@nextui-org/use-pagination": patch +"@nextui-org/use-real-shape": patch +"@nextui-org/use-ref-state": patch +"@nextui-org/use-resize": patch +"@nextui-org/use-safe-layout-effect": patch +"@nextui-org/use-scroll-position": patch +"@nextui-org/use-ssr": patch +"@nextui-org/use-theme": patch +"@nextui-org/use-update-effect": patch +"@nextui-org/aria-utils": patch +"@nextui-org/dom-animation": patch +"@nextui-org/framer-utils": patch +"@nextui-org/react-rsc-utils": patch +"@nextui-org/react-utils": patch +"@nextui-org/shared-icons": patch +"@nextui-org/shared-utils": patch +"@nextui-org/test-utils": patch +--- + +framer-motion alpha version added diff --git a/.changeset/sixty-ties-knock.md b/.changeset/sixty-ties-knock.md new file mode 100644 index 0000000000..e8046181a1 --- /dev/null +++ b/.changeset/sixty-ties-knock.md @@ -0,0 +1,6 @@ +--- +"@nextui-org/alert": patch +"@nextui-org/theme": patch +--- + +Alert compoentn styles improved diff --git a/.changeset/slow-paws-punch.md b/.changeset/slow-paws-punch.md index 8bffd71505..bbfe4c146c 100644 --- a/.changeset/slow-paws-punch.md +++ b/.changeset/slow-paws-punch.md @@ -1,5 +1,5 @@ --- -"@nextui-org/popover": minor +"@nextui-org/popover": patch --- added `shouldCloseOnScroll` to control the popover closing on scroll (#3594) diff --git a/.changeset/tame-planes-think.md b/.changeset/tame-planes-think.md new file mode 100644 index 0000000000..5a07e601c4 --- /dev/null +++ b/.changeset/tame-planes-think.md @@ -0,0 +1,86 @@ +--- +"@nextui-org/accordion": patch +"@nextui-org/alert": patch +"@nextui-org/autocomplete": patch +"@nextui-org/avatar": patch +"@nextui-org/badge": patch +"@nextui-org/breadcrumbs": patch +"@nextui-org/button": patch +"@nextui-org/calendar": patch +"@nextui-org/card": patch +"@nextui-org/checkbox": patch +"@nextui-org/chip": patch +"@nextui-org/code": patch +"@nextui-org/date-input": patch +"@nextui-org/date-picker": patch +"@nextui-org/divider": patch +"@nextui-org/drawer": patch +"@nextui-org/dropdown": patch +"@nextui-org/image": patch +"@nextui-org/input": patch +"@nextui-org/kbd": patch +"@nextui-org/link": patch +"@nextui-org/listbox": patch +"@nextui-org/menu": patch +"@nextui-org/modal": patch +"@nextui-org/navbar": patch +"@nextui-org/pagination": patch +"@nextui-org/popover": patch +"@nextui-org/progress": patch +"@nextui-org/radio": patch +"@nextui-org/ripple": patch +"@nextui-org/scroll-shadow": patch +"@nextui-org/select": patch +"@nextui-org/skeleton": patch +"@nextui-org/slider": patch +"@nextui-org/snippet": patch +"@nextui-org/spacer": patch +"@nextui-org/spinner": patch +"@nextui-org/switch": patch +"@nextui-org/table": patch +"@nextui-org/tabs": patch +"@nextui-org/tooltip": patch +"@nextui-org/user": patch +"@nextui-org/react": patch +"@nextui-org/system": patch +"@nextui-org/system-rsc": patch +"@nextui-org/theme": patch +"@nextui-org/use-aria-accordion": patch +"@nextui-org/use-aria-accordion-item": patch +"@nextui-org/use-aria-button": patch +"@nextui-org/use-aria-link": patch +"@nextui-org/use-aria-menu": patch +"@nextui-org/use-aria-modal-overlay": patch +"@nextui-org/use-aria-multiselect": patch +"@nextui-org/use-aria-toggle-button": patch +"@nextui-org/use-callback-ref": patch +"@nextui-org/use-clipboard": patch +"@nextui-org/use-data-scroll-overflow": patch +"@nextui-org/use-disclosure": patch +"@nextui-org/use-draggable": patch +"@nextui-org/use-image": patch +"@nextui-org/use-infinite-scroll": patch +"@nextui-org/use-intersection-observer": patch +"@nextui-org/use-is-mobile": patch +"@nextui-org/use-is-mounted": patch +"@nextui-org/use-measure": patch +"@nextui-org/use-pagination": patch +"@nextui-org/use-real-shape": patch +"@nextui-org/use-ref-state": patch +"@nextui-org/use-resize": patch +"@nextui-org/use-safe-layout-effect": patch +"@nextui-org/use-scroll-position": patch +"@nextui-org/use-ssr": patch +"@nextui-org/use-theme": patch +"@nextui-org/use-update-effect": patch +"@nextui-org/aria-utils": patch +"@nextui-org/dom-animation": patch +"@nextui-org/framer-utils": patch +"@nextui-org/react-rsc-utils": patch +"@nextui-org/react-utils": patch +"@nextui-org/shared-icons": patch +"@nextui-org/shared-utils": patch +"@nextui-org/test-utils": patch +--- + +Pnpm clean diff --git a/.changeset/ten-paws-relate.md b/.changeset/ten-paws-relate.md new file mode 100644 index 0000000000..45bc71353c --- /dev/null +++ b/.changeset/ten-paws-relate.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/popover": patch +--- + +Fix: element.ref was removed in React 19 diff --git a/.changeset/tender-buses-sort.md b/.changeset/tender-buses-sort.md new file mode 100644 index 0000000000..c9d0c282fe --- /dev/null +++ b/.changeset/tender-buses-sort.md @@ -0,0 +1,86 @@ +--- +"@nextui-org/accordion": patch +"@nextui-org/alert": patch +"@nextui-org/autocomplete": patch +"@nextui-org/avatar": patch +"@nextui-org/badge": patch +"@nextui-org/breadcrumbs": patch +"@nextui-org/button": patch +"@nextui-org/calendar": patch +"@nextui-org/card": patch +"@nextui-org/checkbox": patch +"@nextui-org/chip": patch +"@nextui-org/code": patch +"@nextui-org/date-input": patch +"@nextui-org/date-picker": patch +"@nextui-org/divider": patch +"@nextui-org/drawer": patch +"@nextui-org/dropdown": patch +"@nextui-org/image": patch +"@nextui-org/input": patch +"@nextui-org/kbd": patch +"@nextui-org/link": patch +"@nextui-org/listbox": patch +"@nextui-org/menu": patch +"@nextui-org/modal": patch +"@nextui-org/navbar": patch +"@nextui-org/pagination": patch +"@nextui-org/popover": patch +"@nextui-org/progress": patch +"@nextui-org/radio": patch +"@nextui-org/ripple": patch +"@nextui-org/scroll-shadow": patch +"@nextui-org/select": patch +"@nextui-org/skeleton": patch +"@nextui-org/slider": patch +"@nextui-org/snippet": patch +"@nextui-org/spacer": patch +"@nextui-org/spinner": patch +"@nextui-org/switch": patch +"@nextui-org/table": patch +"@nextui-org/tabs": patch +"@nextui-org/tooltip": patch +"@nextui-org/user": patch +"@nextui-org/react": patch +"@nextui-org/system": patch +"@nextui-org/system-rsc": patch +"@nextui-org/theme": patch +"@nextui-org/use-aria-accordion": patch +"@nextui-org/use-aria-accordion-item": patch +"@nextui-org/use-aria-button": patch +"@nextui-org/use-aria-link": patch +"@nextui-org/use-aria-menu": patch +"@nextui-org/use-aria-modal-overlay": patch +"@nextui-org/use-aria-multiselect": patch +"@nextui-org/use-aria-toggle-button": patch +"@nextui-org/use-callback-ref": patch +"@nextui-org/use-clipboard": patch +"@nextui-org/use-data-scroll-overflow": patch +"@nextui-org/use-disclosure": patch +"@nextui-org/use-draggable": patch +"@nextui-org/use-image": patch +"@nextui-org/use-infinite-scroll": patch +"@nextui-org/use-intersection-observer": patch +"@nextui-org/use-is-mobile": patch +"@nextui-org/use-is-mounted": patch +"@nextui-org/use-measure": patch +"@nextui-org/use-pagination": patch +"@nextui-org/use-real-shape": patch +"@nextui-org/use-ref-state": patch +"@nextui-org/use-resize": patch +"@nextui-org/use-safe-layout-effect": patch +"@nextui-org/use-scroll-position": patch +"@nextui-org/use-ssr": patch +"@nextui-org/use-theme": patch +"@nextui-org/use-update-effect": patch +"@nextui-org/aria-utils": patch +"@nextui-org/dom-animation": patch +"@nextui-org/framer-utils": patch +"@nextui-org/react-rsc-utils": patch +"@nextui-org/react-utils": patch +"@nextui-org/shared-icons": patch +"@nextui-org/shared-utils": patch +"@nextui-org/test-utils": patch +--- + +Fix build 2 diff --git a/.changeset/tough-brooms-hunt.md b/.changeset/tough-brooms-hunt.md new file mode 100644 index 0000000000..3fc6077312 --- /dev/null +++ b/.changeset/tough-brooms-hunt.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/select": patch +--- + +Fix the label placement when the `Select` has a `placeholder` or `description`. diff --git a/.changeset/twelve-trains-smile.md b/.changeset/twelve-trains-smile.md new file mode 100644 index 0000000000..68359994dc --- /dev/null +++ b/.changeset/twelve-trains-smile.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/theme": patch +--- + +making input and select styling consistent(#3876) diff --git a/.changeset/wild-jobs-explain.md b/.changeset/wild-jobs-explain.md index 4ae1929636..452efb9b26 100644 --- a/.changeset/wild-jobs-explain.md +++ b/.changeset/wild-jobs-explain.md @@ -2,4 +2,4 @@ "@nextui-org/use-image": patch --- -fix Image ReferenceError in SSR \ No newline at end of file +fix Image ReferenceError in SSR diff --git a/.github/workflows/pre-release.yaml b/.github/workflows/pre-release.yaml index f00f00972a..a228af8a3b 100644 --- a/.github/workflows/pre-release.yaml +++ b/.github/workflows/pre-release.yaml @@ -14,7 +14,7 @@ concurrency: ${{ github.workflow }}-${{ github.ref }} jobs: prerelease: name: changesets pre-release - runs-on: ubuntu-latest + runs-on: ubuntu-latest-m permissions: contents: write pull-requests: write @@ -52,9 +52,24 @@ jobs: env: GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} + - name: Debug condition values + run: | + echo "pre.json exists: ${{ steps.check_if_pre_json_exists.outputs.files_exists }}" + echo "Commit message: ${{ github.event.head_commit.message }}" + echo "Contains version packages: ${{ contains(github.event.head_commit.message, 'ci(changesets): version packages') }}" + echo "Full condition would be: ${{ steps.check_if_pre_json_exists.outputs.files_exists == 'true' && contains(github.event.head_commit.message, 'ci(changesets): version packages') }}" + + - name: Tests + if: "${{ steps.check_if_pre_json_exists.outputs.files_exists == 'true' && contains(github.event.head_commit.message, 'ci(changesets): version packages') }}" + run: pnpm test + + - name: Build + if: "${{ steps.check_if_pre_json_exists.outputs.files_exists == 'true' && contains(github.event.head_commit.message, 'ci(changesets): version packages') }}" + run: pnpm build + - name: Publish to NPM id: publish-to-npm - if: "${{ steps.check_if_pre_json_exists.outputs.files_exists == 'true' && contains(github.event.head_commit.message, 'ci(changesets): :package: version packages') }}" + if: "${{ steps.check_if_pre_json_exists.outputs.files_exists == 'true' && contains(github.event.head_commit.message, 'ci(changesets): version packages') }}" uses: changesets/action@v1 with: publish: pnpm run release diff --git a/.github/workflows/update-stats.yml b/.github/workflows/update-stats.yml new file mode 100644 index 0000000000..3ea0fd4819 --- /dev/null +++ b/.github/workflows/update-stats.yml @@ -0,0 +1,42 @@ +name: Update Stats + +on: + schedule: + # Runs every Monday at 00:00 UTC + - cron: '0 0 * * 1' + # Allow manual trigger + workflow_dispatch: + +jobs: + update-stats: + name: Update Stats + runs-on: ubuntu-latest + steps: + - name: Checkout branch + uses: actions/checkout@v4 + + - name: Install + uses: ./.github/common-actions/install + + - name: Update search metadata + run: pnpm update:search-meta + + - name: Update GitHub info + run: pnpm update:github-info + + - name: Create Pull Request + uses: peter-evans/create-pull-request@v5 + with: + commit-message: "chore(stats): update project statistics" + title: "chore(stats): 📊 Update project statistics" + body: | + This PR updates the project statistics including: + - Search metadata + - GitHub repository information + + This is an automated PR generated weekly. + branch: chore/update-stats + base: main + delete-branch: true + env: + GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} diff --git a/.vscode/settings.json b/.vscode/settings.json index c531e733d0..6b36bf07d3 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -10,5 +10,5 @@ }, "tailwindCSS.experimental.classRegex": [ ["([\"'`][^\"'`]*.*?[\"'`])", "[\"'`]([^\"'`]*).*?[\"'`]"] - ] + ], } diff --git a/apps/docs/components/docs/sidebar.tsx b/apps/docs/components/docs/sidebar.tsx index 94c107bf9d..f79e258d06 100644 --- a/apps/docs/components/docs/sidebar.tsx +++ b/apps/docs/components/docs/sidebar.tsx @@ -172,7 +172,7 @@ function TreeItem(props: TreeItemProps) { {isUpdated && ( (props: TreeItemProps) { aria-expanded={dataAttr(hasChildNodes ? isExpanded : undefined)} aria-selected={dataAttr(isSelected)} className={clsx( - "flex flex-col gap-3outline-none w-full tap-highlight-transparent", - + "flex flex-col outline-none w-full tap-highlight-transparent", hasChildNodes ? "mb-4" : "first:mt-4", // focus ring ...dataFocusVisibleClasses, @@ -261,7 +260,7 @@ function Tree(props: CollectionBase & Expandable & Multiple return ( diff --git a/apps/docs/components/docs/toc.tsx b/apps/docs/components/docs/toc.tsx index 00b4544f12..7f4962ad4f 100644 --- a/apps/docs/components/docs/toc.tsx +++ b/apps/docs/components/docs/toc.tsx @@ -19,7 +19,7 @@ const paddingLeftByLevel: Record = { 1: "pl-0", 2: "pl-0", 3: "pl-3", - 4: "pl-3", + 4: "pl-6", }; export const DocsToc: FC = ({headings}) => { diff --git a/apps/docs/components/footer.tsx b/apps/docs/components/footer.tsx index 35cdc519bd..6b5e9b6300 100644 --- a/apps/docs/components/footer.tsx +++ b/apps/docs/components/footer.tsx @@ -1,8 +1,11 @@ "use client"; import {usePathname} from "next/navigation"; +import {Link} from "@nextui-org/react"; import {getCurrentYear} from "@/utils/time"; +import {XIcon, GithubIcon, DiscordIcon} from "@/components/icons"; +import {siteConfig} from "@/config/site"; export const Footer = () => { const pathname = usePathname(); @@ -11,12 +14,45 @@ export const Footer = () => { return null; } + const isDocs = pathname.includes("/docs"); + return (

© {getCurrentYear()} NextUI Inc. All rights reserved.

+ {isDocs ? ( +
+ + + + + + + + + +
+ ) : null}
); diff --git a/apps/docs/components/icons/moon.tsx b/apps/docs/components/icons/moon.tsx index b2ea9d37de..5e0c7a80ca 100644 --- a/apps/docs/components/icons/moon.tsx +++ b/apps/docs/components/icons/moon.tsx @@ -11,7 +11,7 @@ export const MoonIcon = ({size = 24, width, height, ...props}: IconSvgProps) => {...props} > diff --git a/apps/docs/components/icons/sun.tsx b/apps/docs/components/icons/sun.tsx index 886aa13441..f1d7446c6b 100644 --- a/apps/docs/components/icons/sun.tsx +++ b/apps/docs/components/icons/sun.tsx @@ -16,3 +16,29 @@ export const SunFilledIcon = ({size = 24, width, height, ...props}: IconSvgProps ); + +export const SunLinearIcon = ({size = 24, width, height, ...props}: IconSvgProps) => ( + +); diff --git a/apps/docs/components/navbar.tsx b/apps/docs/components/navbar.tsx index e5543687bb..478c0f2d9d 100644 --- a/apps/docs/components/navbar.tsx +++ b/apps/docs/components/navbar.tsx @@ -34,11 +34,12 @@ import {currentVersion} from "@/utils/version"; import {siteConfig} from "@/config/site"; import {Route} from "@/libs/docs/page"; import {LargeLogo, SmallLogo, ThemeSwitch} from "@/components"; -import {XIcon, GithubIcon, DiscordIcon, SearchLinearIcon} from "@/components/icons"; +import {GithubIcon, SearchLinearIcon} from "@/components/icons"; import {useIsMounted} from "@/hooks/use-is-mounted"; import {DocsSidebar} from "@/components/docs/sidebar"; import {useCmdkStore} from "@/components/cmdk"; import {FbRoadmapLink} from "@/components/featurebase/fb-roadmap-link"; +import githubInfo from "@/config/github-info.json"; export interface NavbarProps { routes: Route[]; @@ -94,22 +95,26 @@ export const Navbar: FC = ({children, routes, mobileRoutes = [], sl const searchButton = ( ); @@ -238,35 +243,9 @@ export const Navbar: FC = ({children, routes, mobileRoutes = [], sl Figma - {/* hide feedback and changelog at this moment */} - {/* - - - - - - - - - */} - {/* - handlePressNavbarItem("Introducing v2.2.0", "/blog/v2.2.0")} - > - Introducing v2.2.0  - - 🚀 - - - */} @@ -276,14 +255,18 @@ export const Navbar: FC = ({children, routes, mobileRoutes = [], sl isExternal aria-label="Github" className="p-1" - href="https://github.com/nextui-org/nextui" - onClick={() => handlePressNavbarItem("Github", "https://github.com/nextui-org/nextui")} + href={siteConfig.links.github} + onPress={() => handlePressNavbarItem("Github", siteConfig.links.github)} > - + + + + + ))} + + ); +}`; + +const App = `import {Alert, Button} from "@nextui-org/react"; + +const CustomAlert = React.forwardRef( + ( + {title, children, variant = "faded", color = "secondary", className, classNames = {}, ...props}, + ref, + ) => { + const colorClass = React.useMemo(() => { + switch (color) { + case "default": + return "before:bg-default-300"; + case "primary": + return "before:bg-primary"; + case "secondary": + return "before:bg-secondary"; + case "success": + return "before:bg-success"; + case "warning": + return "before:bg-warning"; + case "danger": + return "before:bg-danger"; + default: + return "before:bg-default-200"; + } + }, []); + + return ( + color={color} + title={title} + variant={variant} + {...props} + > + {children} + + ); + }, +); + +CustomAlert.displayName = "CustomAlert"; + +export default function App() { + const colors = ["default", "primary", "secondary", "success", "warning", "danger"]; + + return ( +
+ {colors.map((color) => ( + +
+ + +
+ + ))}
); }`; const react = { "/App.jsx": App, + "/App.tsx": AppTs, }; export default { diff --git a/apps/docs/content/components/alert/index.ts b/apps/docs/content/components/alert/index.ts index 1be9439d70..22f51775f9 100644 --- a/apps/docs/content/components/alert/index.ts +++ b/apps/docs/content/components/alert/index.ts @@ -5,7 +5,9 @@ import customImpl from "./custom-impl"; import customStyles from "./custom-styles"; import variants from "./variants"; import withIcon from "./with-icon"; +import withAction from "./with-action"; import controlled from "./controlled"; +import withoutIcon from "./without-icon"; export const alertContent = { colors, @@ -15,5 +17,7 @@ export const alertContent = { customStyles, variants, withIcon, + withAction, controlled, + withoutIcon, }; diff --git a/apps/docs/content/components/alert/variants.ts b/apps/docs/content/components/alert/variants.ts index 637553b085..07238ee96f 100644 --- a/apps/docs/content/components/alert/variants.ts +++ b/apps/docs/content/components/alert/variants.ts @@ -3,15 +3,9 @@ const App = `import {Alert} from "@nextui-org/react"; export default function App() { return (
- - A solid variant alert - - - A bordered variant alert - - - A flat variant alert - + {["solid", "bordered", "flat", "faded"].map((variant) => ( + + ))}
); }`; diff --git a/apps/docs/content/components/alert/with-action.ts b/apps/docs/content/components/alert/with-action.ts new file mode 100644 index 0000000000..b4f9665f62 --- /dev/null +++ b/apps/docs/content/components/alert/with-action.ts @@ -0,0 +1,29 @@ +const App = `import {Alert, Button} from "@nextui-org/react"; + +export default function App() { + const [isVisible, setIsVisible] = React.useState(true); + + return ( +
+ + Upgrade + + } + title="You have no credits left" + variant="faded" + /> +
+ ); +}`; + +const react = { + "/App.jsx": App, +}; + +export default { + ...react, +}; diff --git a/apps/docs/content/components/alert/without-icon.ts b/apps/docs/content/components/alert/without-icon.ts new file mode 100644 index 0000000000..b3432e6802 --- /dev/null +++ b/apps/docs/content/components/alert/without-icon.ts @@ -0,0 +1,26 @@ +const App = `import {Alert} from "@nextui-org/react"; + +export default function App() { + const title = "This is an alert"; + const description = "Thanks for subscribing to our newsletter!"; + + return ( +
+ +
+ ); +}`; + +const react = { + "/App.jsx": App, +}; + +export default { + ...react, +}; diff --git a/apps/docs/content/components/autocomplete/index.ts b/apps/docs/content/components/autocomplete/index.ts index 76d57925a3..e57bde14dc 100644 --- a/apps/docs/content/components/autocomplete/index.ts +++ b/apps/docs/content/components/autocomplete/index.ts @@ -26,6 +26,10 @@ import customSectionsStyle from "./custom-sections-style"; import customStyles from "./custom-styles"; import customEmptyContentMessage from "./custom-empty-content-message"; import readOnly from "./read-only"; +import virtualization from "./virtualization"; +import virtualizationTenThousand from "./virtualization-ten-thousand"; +import virtualizationMaxListboxHeight from "./virtualization-max-listbox-height"; +import virtualizationCustomItemHeight from "./virtualization-custom-item-height"; export const autocompleteContent = { usage, @@ -56,4 +60,8 @@ export const autocompleteContent = { customStyles, customEmptyContentMessage, readOnly, + virtualization, + virtualizationTenThousand, + virtualizationMaxListboxHeight, + virtualizationCustomItemHeight, }; diff --git a/apps/docs/content/components/autocomplete/virtualization-custom-item-height.ts b/apps/docs/content/components/autocomplete/virtualization-custom-item-height.ts new file mode 100644 index 0000000000..c3211acadd --- /dev/null +++ b/apps/docs/content/components/autocomplete/virtualization-custom-item-height.ts @@ -0,0 +1,65 @@ +const App = `import {Autocomplete, AutocompleteItem} from "@nextui-org/react"; + +const generateItems = (n) => { + const items = [ + "Cat", + "Dog", + "Elephant", + "Lion", + "Tiger", + "Giraffe", + "Dolphin", + "Penguin", + "Zebra", + "Shark", + "Whale", + "Otter", + "Crocodile", + ]; + + const dataset = []; + + for (let i = 0; i < n; i++) { + const item = items[i % items.length]; + + dataset.push({ + label: \`\${item}\${i}\`, + value: \`\${item.toLowerCase()}\${i}\`, + description: "Sample description", + }); + } + + return dataset; +}; + +export default function App() { + const items = generateItems(1000); + + return ( +
+ + {(item) => ( + + {item.label} + + )} + +
+ ); +}`; + +const react = { + "/App.jsx": App, +}; + +export default { + ...react, +}; diff --git a/apps/docs/content/components/autocomplete/virtualization-max-listbox-height.ts b/apps/docs/content/components/autocomplete/virtualization-max-listbox-height.ts new file mode 100644 index 0000000000..eb630f7340 --- /dev/null +++ b/apps/docs/content/components/autocomplete/virtualization-max-listbox-height.ts @@ -0,0 +1,64 @@ +const App = `import {Autocomplete, AutocompleteItem} from "@nextui-org/react"; + +const generateItems = (n) => { + const items = [ + "Cat", + "Dog", + "Elephant", + "Lion", + "Tiger", + "Giraffe", + "Dolphin", + "Penguin", + "Zebra", + "Shark", + "Whale", + "Otter", + "Crocodile", + ]; + + const dataset = []; + + for (let i = 0; i < n; i++) { + const item = items[i % items.length]; + + dataset.push({ + label: \`\${item}\${i}\`, + value: \`\${item.toLowerCase()}\${i}\`, + description: "Sample description", + }); + } + + return dataset; +}; + +export default function App() { + const items = generateItems(1000); + + return ( +
+ + {(item) => ( + + {item.label} + + )} + +
+ ); +}`; + +const react = { + "/App.jsx": App, +}; + +export default { + ...react, +}; diff --git a/apps/docs/content/components/autocomplete/virtualization-ten-thousand.ts b/apps/docs/content/components/autocomplete/virtualization-ten-thousand.ts new file mode 100644 index 0000000000..1e45f238ab --- /dev/null +++ b/apps/docs/content/components/autocomplete/virtualization-ten-thousand.ts @@ -0,0 +1,63 @@ +const App = `import {Autocomplete, AutocompleteItem} from "@nextui-org/react"; + +const generateItems = (n) => { + const items = [ + "Cat", + "Dog", + "Elephant", + "Lion", + "Tiger", + "Giraffe", + "Dolphin", + "Penguin", + "Zebra", + "Shark", + "Whale", + "Otter", + "Crocodile", + ]; + + const dataset = []; + + for (let i = 0; i < n; i++) { + const item = items[i % items.length]; + + dataset.push({ + label: \`\${item}\${i}\`, + value: \`\${item.toLowerCase()}\${i}\`, + description: "Sample description", + }); + } + + return dataset; +}; + +export default function App() { + const items = generateItems(10000); + + return ( +
+ + {(item) => ( + + {item.label} + + )} + +
+ ); +}`; + +const react = { + "/App.jsx": App, +}; + +export default { + ...react, +}; diff --git a/apps/docs/content/components/autocomplete/virtualization.ts b/apps/docs/content/components/autocomplete/virtualization.ts new file mode 100644 index 0000000000..254a3072f2 --- /dev/null +++ b/apps/docs/content/components/autocomplete/virtualization.ts @@ -0,0 +1,63 @@ +const App = `import {Autocomplete, AutocompleteItem} from "@nextui-org/react"; + +const generateItems = (n) => { + const items = [ + "Cat", + "Dog", + "Elephant", + "Lion", + "Tiger", + "Giraffe", + "Dolphin", + "Penguin", + "Zebra", + "Shark", + "Whale", + "Otter", + "Crocodile", + ]; + + const dataset = []; + + for (let i = 0; i < n; i++) { + const item = items[i % items.length]; + + dataset.push({ + label: \`\${item}\${i}\`, + value: \`\${item.toLowerCase()}\${i}\`, + description: "Sample description", + }); + } + + return dataset; +}; + +export default function App() { + const items = generateItems(1000); + + return ( +
+ + {(item) => ( + + {item.label} + + )} + +
+ ); +}`; + +const react = { + "/App.jsx": App, +}; + +export default { + ...react, +}; diff --git a/apps/docs/content/components/drawer/custom-styles.ts b/apps/docs/content/components/drawer/custom-styles.ts new file mode 100644 index 0000000000..68f5939550 --- /dev/null +++ b/apps/docs/content/components/drawer/custom-styles.ts @@ -0,0 +1,337 @@ +const App = `import {Drawer, DrawerContent, DrawerHeader, DrawerBody, DrawerFooter, Button, useDisclosure, Image, Link, Tooltip, Avatar, AvatarGroup} from "@nextui-org/react"; + +export default function App() { + const {isOpen, onOpen, onOpenChange} = useDisclosure(); + + return ( + <> + + + + {(onClose) => ( + <> + + + + +
+ + +
+
+ + + + + + +
+ + +
+ Event image +
+
+

SF Bay Area Meetup in November

+

+ 555 California St, San Francisco, CA 94103 +

+
+
+
+
Nov
+
+ 19 +
+
+
+

+ Tuesday, November 19 +

+

5:00 PM - 9:00 PM PST

+
+
+
+
+ + + + + + +
+
+ + + + } + className="group gap-x-0.5 text-medium text-foreground font-medium" + href="https://www.google.com/maps/place/555+California+St,+San+Francisco,+CA+94103" + rel="noreferrer noopener" + > + 555 California St suite 500 + +

San Francisco, California

+
+
+
+ About the event +
+

+ Hey Bay Area! We are excited to announce our next meetup on Tuesday, + November 19th. +

+

+ Join us for an evening of insightful discussions and hands-on workshops + focused on the latest developments in web development and design. Our + featured speakers will share their experiences with modern frontend + frameworks, responsive design patterns, and emerging web technologies. + You'll have the opportunity to network with fellow developers and + designers while enjoying refreshments and snacks. +

+

+ During the main session, we'll dive deep into practical examples of + building scalable applications, exploring best practices for component + architecture, and understanding advanced state management techniques. Our + interactive workshop portion will let you apply these concepts directly, + with experienced mentors available to provide guidance and answer your + questions. Whether you're a seasoned developer or just starting your + journey, you'll find valuable takeaways from this session. +

+ +

+ Brought to you by the{" "} + + NextUI team + + . +

+
+
+
+ Hosted By +
+ + NextUI Team +
+
+
+ 105 Going +
+ + + + + + + + + + + + + + +
+
+
+
+ + + + Contact the host + + + Report event + + + + )} + + + + ); +}`; + +const react = { + "/App.jsx": App, +}; + +export default { + ...react, +}; diff --git a/apps/docs/content/components/drawer/index.ts b/apps/docs/content/components/drawer/index.ts index e9fa1947c1..d04c3bf31b 100644 --- a/apps/docs/content/components/drawer/index.ts +++ b/apps/docs/content/components/drawer/index.ts @@ -5,6 +5,7 @@ import placement from "./placement"; import form from "./form"; import backdrop from "./backdrop"; import customMotion from "./custom-motion"; +import customStyles from "./custom-styles"; export const drawerContent = { usage, @@ -14,4 +15,5 @@ export const drawerContent = { form, backdrop, customMotion, + customStyles, }; diff --git a/apps/docs/content/components/table/custom-styles.ts b/apps/docs/content/components/table/custom-styles.ts index 3e816ef9e5..e57b2904e9 100644 --- a/apps/docs/content/components/table/custom-styles.ts +++ b/apps/docs/content/components/table/custom-styles.ts @@ -611,13 +611,13 @@ export default function App() { td: [ // changing the rows border radius // first - "group-data-[first=true]:first:before:rounded-none", - "group-data-[first=true]:last:before:rounded-none", + "group-data-[first=true]/tr:first:before:rounded-none", + "group-data-[first=true]/tr:last:before:rounded-none", // middle - "group-data-[middle=true]:before:rounded-none", + "group-data-[middle=true]/tr:before:rounded-none", // last - "group-data-[last=true]:first:before:rounded-none", - "group-data-[last=true]:last:before:rounded-none", + "group-data-[last=true]/tr:first:before:rounded-none", + "group-data-[last=true]/tr:last:before:rounded-none", ], }), [], @@ -966,13 +966,13 @@ export default function App() { td: [ // changing the rows border radius // first - "group-data-[first=true]:first:before:rounded-none", - "group-data-[first=true]:last:before:rounded-none", + "group-data-[first=true]/tr:first:before:rounded-none", + "group-data-[first=true]/tr:last:before:rounded-none", // middle - "group-data-[middle=true]:before:rounded-none", + "group-data-[middle=true]/tr:before:rounded-none", // last - "group-data-[last=true]:first:before:rounded-none", - "group-data-[last=true]:last:before:rounded-none", + "group-data-[last=true]/tr:first:before:rounded-none", + "group-data-[last=true]/tr:last:before:rounded-none", ], }), [], diff --git a/apps/docs/content/docs/api-references/nextui-provider.mdx b/apps/docs/content/docs/api-references/nextui-provider.mdx index dcc6abb52f..530077ac4a 100644 --- a/apps/docs/content/docs/api-references/nextui-provider.mdx +++ b/apps/docs/content/docs/api-references/nextui-provider.mdx @@ -116,12 +116,12 @@ interface AppProviderProps { import {GregorianCalendar} from '@internationalized/date'; function createCalendar(identifier) { - switch (identifier) { - case 'gregory': - return new GregorianCalendar(); - default: - throw new Error(`Unsupported calendar ${identifier}`); - } + switch (identifier) { + case 'gregory': + return new GregorianCalendar(); + default: + throw new Error(`Unsupported calendar ${identifier}`); + } } ``` @@ -167,6 +167,15 @@ or mark the field as required or invalid via ARIA. - **Type**: `native | aria` - **Default**: `aria` +`reducedMotion` + +- **Description**: Controls the motion preferences for the entire application, allowing developers to respect user settings for reduced motion. +The available options are: + - `"user"`: Adapts to the user's device settings for reduced motion. + - `"always"`: Disables all animations. + - `"never"`: Keeps all animations active. +- **Type**: `"user" | "always" | "never"` +- **Default**: `"never"` --- ## Types diff --git a/apps/docs/content/docs/components/alert.mdx b/apps/docs/content/docs/components/alert.mdx index 15f49b31c9..4aa902518b 100644 --- a/apps/docs/content/docs/components/alert.mdx +++ b/apps/docs/content/docs/components/alert.mdx @@ -55,11 +55,23 @@ Alert comes with 6 color variants to convey different meanings. -### With Icon +### Custom Icon By default, Alert displays an appropriate icon based on the `color` prop. You can override this by providing a custom icon using the `icon` prop. - + + +### Without Icon + +You can hide the icon by setting the `hideIcon` prop to `true`. + + + +### With Action + +Alert supports an `endContent` prop for additional actions. + + ### Controlled Visibility @@ -92,6 +104,18 @@ Alert has the following attributes on the `base` element: +### Slots + +Alert has the following slots: + +- `base`: The main alert container element +- `title`: The title element +- `description`: The description element +- `mainWrapper`: The wrapper for the title and description content +- `closeButton`: The close button element +- `iconWrapper`: The wrapper for the alert icon +- `alertIcon`: The alert icon element + ## Accessibility - Alert has role of `alert` @@ -110,10 +134,14 @@ Alert has the following attributes on the `base` element: | icon | `ReactNode` | The alert icon - overrides the default icon | - | | description | `ReactNode` | The alert description | - | | color | `default` \| `primary` \| `secondary` \| `success` \| `warning` \| `danger` | The alert color theme | `default` | -| variant | `solid` \| `bordered` \| `flat` | The alert variant | `flat` | +| variant | `solid` \| `bordered` \| `flat` \| `faded` | The alert variant | `flat` | | radius | `none` \| `sm` \| `md` \| `lg` \| `full` | The alert border radius | `md` | +| startContent | `ReactNode` | The alert start content | - | +| endContent | `ReactNode` | The alert end content | - | | isVisible | `boolean` | Whether the alert is visible | - | | isClosable | `boolean` | Whether the alert can be closed | `false` | +| hideIcon | `boolean` | Whether the icon is hidden | `false` | +| hideIconWrapper | `boolean` | Whether the icon wrapper is hidden | `false` | | closeButtonProps | `ButtonProps` | Props for the close button | - | ### Alert Events diff --git a/apps/docs/content/docs/components/autocomplete.mdx b/apps/docs/content/docs/components/autocomplete.mdx index b826b21556..6bef6b4a21 100644 --- a/apps/docs/content/docs/components/autocomplete.mdx +++ b/apps/docs/content/docs/components/autocomplete.mdx @@ -13,7 +13,7 @@ An autocomplete combines a text input with a listbox, allowing users to filter a --- - + ## Installation @@ -24,11 +24,10 @@ An autocomplete combines a text input with a listbox, allowing users to filter a npm: "npm install @nextui-org/autocomplete", yarn: "yarn add @nextui-org/autocomplete", pnpm: "pnpm add @nextui-org/autocomplete", - bun: "bun add @nextui-org/autocomplete" + bun: "bun add @nextui-org/autocomplete", }} /> - ## Import NextUI exports 3 autocomplete-related components: @@ -84,7 +83,7 @@ the end of the label and the autocomplete will be required. ### Read Only -If you pass the `isReadOnly` property to the Autocomplete, the Listbox will open to display +If you pass the `isReadOnly` property to the Autocomplete, the Listbox will open to display all available options, but users won't be able to select any of the listed options. @@ -243,7 +242,10 @@ You can customize the autocomplete items by modifying the `AutocompleteItem` chi By default, a message `No results found.` will be shown if there is no result matching a query with your filter. You can customize the empty content message by modifying the `emptyContent` in `listboxProps`. - + ### Custom Filtering @@ -316,6 +318,36 @@ import {useInfiniteScroll} from "@nextui-org/use-infinite-scroll"; files={autocompleteContent.asyncLoadingItems} /> +### Virtualization + +Autocomplete supports virtualization, in the example below we are using the `isVirtualized` prop to enable virtualization. + + + +> **Note**: The virtualization strategy is based on the [@tanstack/react-virtual](https://tanstack.com/virtual/latest) package, which provides efficient rendering of large lists by only rendering items that are visible in the viewport. + +#### Ten Thousand Items + +Virtualization with 10,000 items. + + + +#### Max Listbox Height + +The `maxListboxHeight` prop is used to set the maximum height of the listbox. This is required when using virtualization. By default, it's set to `256`. + + + +#### Custom Item Height + +The `itemHeight` prop is used to set the height of each item in the listbox. This is required when using virtualization. By default, it's set to `32`. + + + ### With Sections You can use the `AutocompleteSection` component to group autocomplete items. @@ -412,57 +444,60 @@ properties to customize the popover, listbox and input components. ### Autocomplete Props -| Attribute | Type | Description | Default | -| --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------ | -| children\* | `ReactNode[]` | The children to render. Usually a list of `AutocompleteItem` and `AutocompleteSection` elements. | - | -| label | `ReactNode` | The content to display as the label. | - | -| name | `string` | The name of the input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname). | - | -| variant | `flat` \| `bordered` \| `faded` \| `underlined` | The variant of the Autocomplete. | `flat` | -| color | `default` \| `primary` \| `secondary` \| `success` \| `warning` \| `danger` | The color of the Autocomplete. | `default` | -| size | `sm` \| `md` \| `lg` | The size of the Autocomplete. | `md` | -| radius | `none` \| `sm` \| `md` \| `lg` \| `full` | The radius of the Autocomplete. | - | -| items | [`Iterable`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols) | The list of Autocomplete items. (controlled) | - | -| defaultItems | [`Iterable`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols) | The list of Autocomplete items (uncontrolled). | - | -| inputValue | `string` | The value of the Autocomplete input (controlled). | - | -| defaultInputValue | `string` | The value of the Autocomplete input (uncontrolled). | - | -| allowsCustomValue | `boolean` | Whether the Autocomplete allows a non-item matching input value to be set. | `false` | -| allowsEmptyCollection | `boolean` | Whether the autocomplete allows the menu to be open when the collection is empty. | `true` | -| shouldCloseOnBlur | `boolean` | Whether the Autocomplete should close when the input is blurred. | `true` | -| placeholder | `string` | Temporary text that occupies the text input when it is empty. | - | -| description | `ReactNode` | A description for the field. Provides a hint such as specific requirements for what to choose. | - | -| menuTrigger | `focus` \| `input` \| `manual` | The action that causes the menu to open. | `focus` | -| labelPlacement | `inside` \| `outside` \| `outside-left` | The position of the label. | `inside` | -| selectedKey | `React.Key` | The currently selected key in the collection (controlled). | - | -| defaultSelectedKey | `React.Key` | The initial selected key in the collection (uncontrolled). | - | -| disabledKeys | `all` \| `React.Key[]` | The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with. | - | -| errorMessage | `ReactNode` \| `((v: ValidationResult) => ReactNode)` | An error message to display below the field. | - | -| validate | `(value: { inputValue: string, selectedKey: React.Key }) => ValidationError ｜ true ｜ null ｜ undefined` | Validate input values when committing (e.g. on blur), and return error messages for invalid values. | - | -| validationBehavior | `native` \| `aria` | Whether to use native HTML form validation to prevent form submission when the value is missing or invalid, or mark the field as required or invalid via ARIA.| `aria` | -| startContent | `ReactNode` | Element to be rendered in the left side of the Autocomplete. | - | -| endContent | `ReactNode` | Element to be rendered in the right side of the Autocomplete. | - | -| autoFocus | `boolean` | Whether the Autocomplete should be focused on render. | `false` | -| defaultFilter | `(textValue: string, inputValue: string) => boolean` | The filter function used to determine if a option should be included in the Autocomplete list. | - | -| filterOptions | [Intl.CollatorOptions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Collator/Collator) | The options used to create the collator used for filtering. | `{ sensitivity: 'base'}` | -| isReadOnly | `boolean` | Whether the Autocomplete is read only. | `false` | -| isRequired | `boolean` | Whether the Autocomplete is required. | `false` | -| isInvalid | `boolean` | Whether the Autocomplete is invalid. | `false` | -| isDisabled | `boolean` | Whether the Autocomplete is disabled. | `false` | -| fullWidth | `boolean` | Whether the input should take up the width of its parent. | `true` | -| selectorIcon | `ReactNode` | The icon that represents the autocomplete open state. Usually a chevron icon. | - | -| clearIcon | `ReactNode` | The icon to be used in the clear button. Usually a cross icon. | - | -| showScrollIndicators | `boolean` | Whether the scroll indicators should be shown when the listbox is scrollable. | `true` | -| scrollRef | `React.RefObject` | A ref to the scrollable element. | - | -| inputProps | [InputProps](/docs/components/input#api) | Props to be passed to the Input component. | - | -| popoverProps | [PopoverProps](/docs/components/popover#api) | Props to be passed to the Popover component. | - | -| listboxProps | [ListboxProps](/docs/components/listbox#api) | Props to be passed to the Listbox component. | - | -| scrollShadowProps | [ScrollShadowProps](/docs/components/scroll-shadow#api) | Props to be passed to the ScrollShadow component. | - | -| selectorButtonProps | [ButtonProps](/docs/components/button#api) | Props to be passed to the selector button. | - | -| clearButtonProps | [ButtonProps](/docs/components/button#api) | Props to be passed to the clear button. | - | -| isClearable | `boolean` | Whether the clear button should be shown. | `true` | -| disableClearable | `boolean` | Whether the clear button should be hidden. (**Deprecated**) Use `isClearable` instead. | `false` | -| disableAnimation | `boolean` | Whether the Autocomplete should be animated. | `true` | -| disableSelectorIconRotation | `boolean` | Whether the select should disable the rotation of the selector icon. | `false` | -| classNames | `Record<"base"｜ "listboxWrapper"｜ "listbox"｜ "popoverContent" ｜ "endContentWrapper"｜ "clearButton" ｜ "selectorButton", string>` | Allows to set custom class names for the Autocomplete slots. | - | +| Attribute | Type | Description | Default | +| --------------------------- | ------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------ | +| children\* | `ReactNode[]` | The children to render. Usually a list of `AutocompleteItem` and `AutocompleteSection` elements. | - | +| label | `ReactNode` | The content to display as the label. | - | +| name | `string` | The name of the input element, used when submitting an HTML form. See [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#htmlattrdefname). | - | +| variant | `flat` \| `bordered` \| `faded` \| `underlined` | The variant of the Autocomplete. | `flat` | +| color | `default` \| `primary` \| `secondary` \| `success` \| `warning` \| `danger` | The color of the Autocomplete. | `default` | +| size | `sm` \| `md` \| `lg` | The size of the Autocomplete. | `md` | +| radius | `none` \| `sm` \| `md` \| `lg` \| `full` | The radius of the Autocomplete. | - | +| items | [`Iterable`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols) | The list of Autocomplete items. (controlled) | - | +| defaultItems | [`Iterable`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols) | The list of Autocomplete items (uncontrolled). | - | +| inputValue | `string` | The value of the Autocomplete input (controlled). | - | +| defaultInputValue | `string` | The value of the Autocomplete input (uncontrolled). | - | +| allowsCustomValue | `boolean` | Whether the Autocomplete allows a non-item matching input value to be set. | `false` | +| allowsEmptyCollection | `boolean` | Whether the autocomplete allows the menu to be open when the collection is empty. | `true` | +| shouldCloseOnBlur | `boolean` | Whether the Autocomplete should close when the input is blurred. | `true` | +| placeholder | `string` | Temporary text that occupies the text input when it is empty. | - | +| description | `ReactNode` | A description for the field. Provides a hint such as specific requirements for what to choose. | - | +| menuTrigger | `focus` \| `input` \| `manual` | The action that causes the menu to open. | `focus` | +| labelPlacement | `inside` \| `outside` \| `outside-left` | The position of the label. | `inside` | +| selectedKey | `React.Key` | The currently selected key in the collection (controlled). | - | +| defaultSelectedKey | `React.Key` | The initial selected key in the collection (uncontrolled). | - | +| disabledKeys | `all` \| `React.Key[]` | The item keys that are disabled. These items cannot be selected, focused, or otherwise interacted with. | - | +| errorMessage | `ReactNode` \| `((v: ValidationResult) => ReactNode)` | An error message to display below the field. | - | +| validate | `(value: { inputValue: string, selectedKey: React.Key }) => ValidationError ｜ true ｜ null ｜ undefined` | Validate input values when committing (e.g. on blur), and return error messages for invalid values. | - | +| validationBehavior | `native` \| `aria` | Whether to use native HTML form validation to prevent form submission when the value is missing or invalid, or mark the field as required or invalid via ARIA. | `aria` | +| startContent | `ReactNode` | Element to be rendered in the left side of the Autocomplete. | - | +| endContent | `ReactNode` | Element to be rendered in the right side of the Autocomplete. | - | +| autoFocus | `boolean` | Whether the Autocomplete should be focused on render. | `false` | +| defaultFilter | `(textValue: string, inputValue: string) => boolean` | The filter function used to determine if a option should be included in the Autocomplete list. | - | +| filterOptions | [Intl.CollatorOptions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Collator/Collator) | The options used to create the collator used for filtering. | `{ sensitivity: 'base'}` | +| maxListboxHeight | `number` | The maximum height of the listbox in pixels. Required when using virtualization. | `256` | +| itemHeight | `number` | The fixed height of each item in pixels. Required when using virtualization. | `32` | +| isVirtualized | `boolean` | Whether to enable virtualization. By default, it's enabled when the number of items exceeds 50. | `undefined` | +| isReadOnly | `boolean` | Whether the Autocomplete is read only. | `false` | +| isRequired | `boolean` | Whether the Autocomplete is required. | `false` | +| isInvalid | `boolean` | Whether the Autocomplete is invalid. | `false` | +| isDisabled | `boolean` | Whether the Autocomplete is disabled. | `false` | +| fullWidth | `boolean` | Whether the input should take up the width of its parent. | `true` | +| selectorIcon | `ReactNode` | The icon that represents the autocomplete open state. Usually a chevron icon. | - | +| clearIcon | `ReactNode` | The icon to be used in the clear button. Usually a cross icon. | - | +| showScrollIndicators | `boolean` | Whether the scroll indicators should be shown when the listbox is scrollable. | `true` | +| scrollRef | `React.RefObject` | A ref to the scrollable element. | - | +| inputProps | [InputProps](/docs/components/input#api) | Props to be passed to the Input component. | - | +| popoverProps | [PopoverProps](/docs/components/popover#api) | Props to be passed to the Popover component. | - | +| listboxProps | [ListboxProps](/docs/components/listbox#api) | Props to be passed to the Listbox component. | - | +| scrollShadowProps | [ScrollShadowProps](/docs/components/scroll-shadow#api) | Props to be passed to the ScrollShadow component. | - | +| selectorButtonProps | [ButtonProps](/docs/components/button#api) | Props to be passed to the selector button. | - | +| clearButtonProps | [ButtonProps](/docs/components/button#api) | Props to be passed to the clear button. | - | +| isClearable | `boolean` | Whether the clear button should be shown. | `true` | +| disableClearable | `boolean` | Whether the clear button should be hidden. (**Deprecated**) Use `isClearable` instead. | `false` | +| disableAnimation | `boolean` | Whether the Autocomplete should be animated. | `true` | +| disableSelectorIconRotation | `boolean` | Whether the select should disable the rotation of the selector icon. | `false` | +| classNames | `Record<"base"｜ "listboxWrapper"｜ "listbox"｜ "popoverContent" ｜ "endContentWrapper"｜ "clearButton" ｜ "selectorButton", string>` | Allows to set custom class names for the Autocomplete slots. | - | ### Autocomplete Events diff --git a/apps/docs/content/docs/components/drawer.mdx b/apps/docs/content/docs/components/drawer.mdx index 464f057588..6a37751e84 100644 --- a/apps/docs/content/docs/components/drawer.mdx +++ b/apps/docs/content/docs/components/drawer.mdx @@ -115,6 +115,15 @@ Drawer offers a `motionProps` property to customize the `enter` / `exit` animati > Learn more about Framer motion variants [here](https://www.framer.com/motion/animation/#variants). +### Custom Styles + + + +Credits + +The Drawer component design is inspired by [Luma](https://x.com/LumaHQ). + + ## Slots - **wrapper**: The wrapper slot of the drawer. It wraps the `base` and the `backdrop` slots. diff --git a/apps/docs/content/docs/components/table.mdx b/apps/docs/content/docs/components/table.mdx index 5415aa1e65..230aa89df5 100644 --- a/apps/docs/content/docs/components/table.mdx +++ b/apps/docs/content/docs/components/table.mdx @@ -457,7 +457,7 @@ You can customize the `Table` component by passing custom Tailwind CSS classes t | disableAnimation | `boolean` | Whether to disable the table and checkbox animations. | `false` | | checkboxesProps | [CheckboxProps](/docs/components/checkbox/#checkbox-props) | Props to be passed to the checkboxes. | - | | classNames | `Record<"base" ｜ "table" ｜ "thead" ｜ "tbody" ｜ "tfoot" ｜ "emptyWrapper" ｜ "loadingWrapper" ｜ "wrapper" ｜ "tr" ｜ "th" ｜ "td" ｜ "sortIcon", string>` | Allows to set custom class names for the dropdown item slots. | - | - +| isKeyboardNavigationDisabled | `boolean` | Whether to disable keyboard navigations or not. | `false` | ### Table Events | Attribute | Type | Description | diff --git a/apps/docs/content/docs/guide/form.mdx b/apps/docs/content/docs/guide/form.mdx new file mode 100644 index 0000000000..1729953a71 --- /dev/null +++ b/apps/docs/content/docs/guide/form.mdx @@ -0,0 +1,416 @@ +--- +title: Forms +description: Learn how to handle forms in NextUI. +--- + +# Forms + +NextUI form components are designed to be flexible and function as HTML form elements. They support form data submission, custom validation, real-time validation, and offer an accessible UI. + + + +## Labels and help text + +Accessible forms require clear and descriptive labels. NextUI components allow you to add labels to each field through the label prop. +You can also display help text such as descriptions or error messages. + +```tsx +import {Input} from "@nextui-org/react"; + + +``` + +Labels should usually be visually displayed, but in rare cases, you need to provide an aria-label or aria-labelledby attribute to identify the element for screen readers. + +## Submitting data + +How you submit form data depends on your framework, application, and server. +By default, HTML forms are submitted via a full-page refresh in the browser. +You can call `preventDefault` in the `onSubmit` event to handle form data submission via an API. + +### Uncontrolled forms + +A simple way to get form data is to use `FormData` API. You can send this data to a backend API or convert it into a JavaScript object using [`Object.fromEntries`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/fromEntries). +Each field should have a `name` prop to identify it, and the values will be serialized as strings by the browser. + +```tsx +import {Button, Form, Input} from "@nextui-org/react"; + +function Example() { + const [submitted, setSubmitted] = React.useState(null); + + const onSubmit = (e: React.FormEvent) => { + // Prevent default browser page refresh. + e.preventDefault(); + + // Get form data as an object. + const data = Object.fromEntries(new FormData(e.currentTarget)); + + // Submit data to your backend API. (currently logged to the console) + console.log("Form submitted:", data); + }; + + return ( +
+ + +
+ ); +} +``` + +### Controlled forms + +NextUI form components are uncontrolled by default, but if you need to manage state in real-time, you can use the `useState` hook to make the component controlled. + +```tsx +import {Button, Form, Input} from "@nextui-org/react"; + +function Example() { + const [name, setName] = React.useState(""); + const onSubmit = (e) => { + e.preventDefault(); + + // Submit data to your backend API. + alert(name); + }; + + return ( +
+ + +
+ ); +} +``` + +## Validation + +Form validation is crucial for ensuring that users enter the correct data. +NextUI supports native HTML constraint validation and allows for custom validation and real-time validation. + +### Built-in validation + +NextUI form components support [native HTML validation](https://developer.mozilla.org/docs/Web/HTML/Constraint_validation) attributes like `isRequired` and `minLength`. +These constraints are checked by the browser when the user commits changes (e.g., onBlur) or submits the form. +You can display validation errors with custom styles instead of the browser's default UI. + +```tsx +import {Button, Form, Input} from "@nextui-org/react"; + +
+ + +
+``` + +To enable native validation, set `validationBehavior="native"`. +By default, `validationBehavior="aria"` is set, which only marks the field as required or invalid for assistive technologies, without preventing form submission. +You can change the form defaults for your entire app using [NextUI Provider](/docs/api-references/nextui-provider). + +### Customizing error messages + +By default, error messages are provided by the browser. +You can customize these messages by providing a function to the `errorMessage` prop. + +```tsx {9-19} +import {Button, Form, Input} from "@nextui-org/react"; + +
+ { + if (validationResult.validationDetails.rangeOverflow) { + return "Value is too high"; + } + if (validationResult.validationDetails.rangeUnderflow) { + return "Value is too low"; + } + if (validationResult.validationDetails.valueMissing) { + return "Value is required"; + } + }} + /> + +
+``` + +> **Note**: The default error messages are localized by the browser based on the browser/operating system language settings. The [locale setting in NextUI Provider](/docs/api-references/nextui-provider#props) does not affect validation errors. + +### Custom validation + +In addition to built-in constraints, you can provide a function to the `validate` prop to support custom validation. + +```tsx {7-11} +import {Button, Form, Input} from "@nextui-org/react"; + +
+ { + if (value < 0 || value > 100) { + return "Value must be between 0 and 100"; + } + }} + /> + +
+``` + +### Realtime validation + +If you want to display validation errors while the user is typing, you can control the field value and use the `isInvalid` prop along with the `errorMessage` prop. + +```tsx {22-31} +import {Input} from "@nextui-org/react"; + +export function Example() { + const [password, setPassword] = React.useState(""); + const errors: string[] = []; + + if (password.length < 8) { + errors.push("Password must be 8 characters or more."); + } + if ((password.match(/[A-Z]/g) ?? []).length < 2) { + errors.push("Password must include at least 2 upper case letters"); + } + if ((password.match(/[^a-z]/gi) ?? []).length < 2) { + errors.push("Password must include at least 2 symbols."); + } + + return ( + 0} + errorMessage={() => ( +
    + {errors.map((error, i) => ( +
  • {error}
    • + ))} +
+ )} + /> + ); +} +``` + +### Server validation + +Client-side validation provides immediate feedback, but you should also validate data on the server to ensure accuracy and security. +NextUI allows you to display server-side validation errors by using the `validationErrors` prop in the `Form` component. +This prop should be an object where each key is the field `name` and the value is the error message. + +```tsx {15} +import {Button, Form, Input} from "@nextui-org/react"; + +function Example() { + const [errors, setErrors] = React.useState({}); + const onSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + + const data = Object.fromEntries(new FormData(e.currentTarget)); + const result = await callServer(data); + + setErrors(result.errors); + }; + + return ( +
+ + + +
+ ); +} + +// Fake server used in this example. +function callServer(data) { + return { + errors: { + username: "Sorry, this username is taken.", + }, + }; +} +``` + +#### Schema validation + +NextUI supports errors from schema validation libraries like Zod. +You can use Zod's `flatten` method to get error messages for each field and return them as part of the server response. + +```tsx +// In your server. +import {z} from "zod"; + +const schema = z.object({ + name: z.string().min(1), + age: z.coerce.number().positive() +}); + +function handleRequest(formData: FormData) { + const result = schema.safeParse( + Object.fromEntries(formData) + ); + if (!result.success) { + return { + errors: result.error.flatten().fieldErrors + }; + } + + return { + errors: {} + }; +} +``` + +#### React Server Actions + +[Server Actions](https://react.dev/reference/rsc/server-actions) that allows seamless form submission to the server and retrieval of results. +The [`useActionState`](https://react.dev/reference/react/useActionState) hook can be used to get the result of server actions (such as errors) after submitting a form. + +```tsx {14} +// app/add-form.tsx +"use client"; + +import {useActionState} from "react"; +import {Button, Input, Label} from "@nextui-org/react"; +import {createTodo} from "@/app/actions"; + +export function AddForm() { + const [{ errors }, formAction] = useActionState(createTodo, { + errors: {} + }); + + return ( +
+ + +
+ ); +} +``` + +```ts +// app/actions.ts +"use server"; + +export async function createTodo( + prevState: any, + formData: FormData +) { + try { + // Create the todo. + } catch (err) { + return { + errors: { + todo: "Invalid todo." + } + }; + } +} +``` + +#### Remix + +Remix actions handle form submissions on the server. +You can use the [`useSubmit`](https://remix.run/docs/en/main/hooks/use-submit) hook to submit form data to the server and the [`useActionData`](https://remix.run/docs/en/main/hooks/use-action-data) hook to retrieve validation errors from the server. + +```tsx {18} +// app/routes/signup.tsx +import type {ActionFunctionArgs} from "@remix-run/node"; +import {useActionData, useSubmit} from "@remix-run/react"; +import {Button, Form, Input} from "@nextui-org/react"; + +export default function SignupForm() { + const [errors, setErrors] = React.useState({}); + const onSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + + const data = Object.fromEntries(new FormData(e.currentTarget)); + const result = await callServer(data); + + setErrors(result.errors); + }; + + return ( +
+ + + +
+ ); +} + +export async function action( + { request }: ActionFunctionArgs +) { + try { + // Validate data and perform action... + } catch (err) { + return { + errors: { + username: "Sorry, this username is taken." + } + }; + } +} +``` + +## Form libraries + +In most cases, the built-in validation features of NextUI are sufficient. However, if you're building more complex forms or integrating NextUI components into an existing form, you can use a form library like React Hook Form or Formik. + +### React Hook Form + +You can integrate NextUI components using [`Controller`](https://react-hook-form.com/docs/usecontroller/controller). +`Controller` allows you to manage field values and validation errors, and reflect the validation result in NextUI components. + +```tsx +import {Controller, useForm} from "react-hook-form"; +import {Button, Input, Label} from "@nextui-org/react"; + +function App() { + const { handleSubmit, control } = useForm({ + defaultValues: { + name: "" + } + }); + const onSubmit = (data) => { + // Call your API here. + }; + + return ( +
+ ( + + )} + rules={{required: "Name is required."}} + /> + + + ); +} +``` diff --git a/apps/docs/content/docs/guide/routing.mdx b/apps/docs/content/docs/guide/routing.mdx index 92044633c8..07f1a26453 100644 --- a/apps/docs/content/docs/guide/routing.mdx +++ b/apps/docs/content/docs/guide/routing.mdx @@ -45,7 +45,7 @@ function App() { -## Next.js +## Next.js ### App Router @@ -58,10 +58,10 @@ Go to your `app/providers.tsx` or `app/providers.jsx` (create it if it doesn't e ```tsx {8} // app/providers.tsx -'use client' +"use client" -import {NextUIProvider} from '@nextui-org/react'; -import {useRouter} from 'next/navigation' +import {NextUIProvider} from "@nextui-org/react"; +import {useRouter} from "next/navigation" export function Providers({children}: { children: React.ReactNode }) { const router = useRouter(); @@ -84,7 +84,7 @@ import {Providers} from "./providers"; export default function RootLayout({children}: { children: React.ReactNode }) { return ( - + {children} @@ -99,11 +99,11 @@ export default function RootLayout({children}: { children: React.ReactNode }) { #### Add useHref (Optional) -If you are using the Next.js [basePath](https://nextjs.org/docs/app/api-reference/next-config-js/basePath) setting, you'll need to configure an environment variable to access it. +If you are using the Next.js [basePath](https://nextjs.org/docs/app/api-reference/next-config-js/basePath) setting, you'll need to configure an environment variable to access it. ```js // next.config.js -const basePath = '...'; +const basePath = "..."; const nextConfig = { basePath, env: { @@ -115,10 +115,10 @@ Then, provide a custom `useHref` function to prepend it to the href for all link ```tsx {9,12} // app/providers.tsx -'use client' +"use client" -import {NextUIProvider} from '@nextui-org/react'; -import {useRouter} from 'next/navigation' +import {NextUIProvider} from "@nextui-org/react"; +import {useRouter} from "next/navigation" export function Providers({children}: { children: React.ReactNode }) { const router = useRouter(); @@ -136,14 +136,14 @@ export function Providers({children}: { children: React.ReactNode }) { ### Pages Router -Go to pages`/_app.js` or `pages/_app.tsx` (create it if it doesn't exist) and add the`useRouter` hook +Go to pages`/_app.js` or `pages/_app.tsx` (create it if it doesn't exist) and add the`useRouter` hook from `next/router`, it returns a router object that can be used to perform navigation. ```tsx {7,10} // pages/_app.tsx -import type { AppProps } from 'next/app'; -import {NextUIProvider} from '@nextui-org/react'; -import {useRouter} from 'next/router'; +import type { AppProps } from "next/app"; +import {NextUIProvider} from "@nextui-org/react"; +import {useRouter} from "next/router"; function MyApp({ Component, pageProps }: AppProps) { const router = useRouter(); @@ -162,9 +162,9 @@ When using the [basePath](https://nextjs.org/docs/app/api-reference/next-config- ```tsx {8,11} // pages/_app.tsx -import type { AppProps } from 'next/app'; -import {NextUIProvider} from '@nextui-org/react'; -import {useRouter} from 'next/router'; +import type { AppProps } from "next/app"; +import {NextUIProvider} from "@nextui-org/react"; +import {useRouter} from "next/router"; function MyApp({ Component, pageProps }: AppProps) { const router = useRouter(); @@ -182,17 +182,17 @@ export default MyApp; ## React Router -The `useNavigate` hook from `react-router-dom` returns a `navigate` function that can be used to perform navigation. +The `useNavigate` hook from `react-router-dom` returns a `navigate` function that can be used to perform navigation. The `useHref` hook can also be provided if you're using React Router's `basename` option. Ensure that the component that calls useNavigate and renders Provider is inside the router component (e.g. `BrowserRouter`) so that it has access to React Router's internal context. The React Router `` element should also be defined inside `` so that links inside the rendered routes have access to the router. -Go to the `App` file commonly called `App.jsx` or `App.tsx`, add the `useNavigate` hook and pass the +Go to the `App` file commonly called `App.jsx` or `App.tsx`, add the `useNavigate` hook and pass the `navigate` function to the `NextUIProvider`: ```jsx {6,9} // App.tsx or App.jsx -import {BrowserRouter, useNavigate, useHref} from 'react-router-dom'; -import {NextUIProvider} from '@nextui-org/react'; +import {BrowserRouter, useNavigate, useHref} from "react-router-dom"; +import {NextUIProvider} from "@nextui-org/react"; function App() { const navigate = useNavigate(); @@ -210,7 +210,7 @@ function App() { // main.tsx or main.jsx -ReactDOM.createRoot(document.getElementById('root')).render( +ReactDOM.createRoot(document.getElementById("root")).render( @@ -219,22 +219,22 @@ ReactDOM.createRoot(document.getElementById('root')).render( ) ``` -Ensure that the component that calls `useNavigate` and renders `NextUIProvider` is inside the router -component (e.g. `BrowserRouter`) so that it has access to React Router's internal context. The React Router `` +Ensure that the component that calls `useNavigate` and renders `NextUIProvider` is inside the router +component (e.g. `BrowserRouter`) so that it has access to React Router's internal context. The React Router `` element should also be defined inside `NextUIProvider` so that links inside the rendered routes have access to the router. ## Remix -Remix uses React Router under the hood, so the same `useNavigate` and `useHref` hook described above also works in Remix -apps. `NextUIProvider` should be rendered at the `root` of each page that includes NextUI components, or in -`app/root.tsx` to add it to all pages. See the [Remix docs](https://remix.run/docs/en/main/file-conventions/root) +Remix uses React Router under the hood, so the same `useNavigate` and `useHref` hook described above also works in Remix +apps. `NextUIProvider` should be rendered at the `root` of each page that includes NextUI components, or in +`app/root.tsx` to add it to all pages. See the [Remix docs](https://remix.run/docs/en/main/file-conventions/root) for more details. ```jsx {14} // app/root.tsx -import {useNavigate, useHref, Outlet} from '@remix-run/react'; -import {NextUIProvider} from '@nextui-org/react'; +import {useNavigate, useHref, Outlet} from "@remix-run/react"; +import {NextUIProvider} from "@nextui-org/react"; export default function App() { const navigate = useNavigate(); @@ -257,17 +257,17 @@ export default function App() { ## TanStack -To use [TanStack Router](https://tanstack.com/router/latest) with NextUI, render NextUI's RouterProvider inside your root route. Use `router.navigate` in the `navigate` prop, and `router.buildLocation` in the `useHref` prop. +To use [TanStack Router](https://tanstack.com/router/latest) with NextUI, render NextUI's RouterProvider inside your root route. Use `router.navigate` in the `navigate` prop, and `router.buildLocation` in the `useHref` prop. ```tsx {9,10} // app/root.tsx -import {NextUIProvider} from '@nextui-org/react'; +import {NextUIProvider} from "@nextui-org/react"; function RootRoute() { let router = useRouter(); return ( - router.navigate({ to, ...options })} useHref={(to) => router.buildLocation({ to }).href} > @@ -279,7 +279,7 @@ function RootRoute() { ## Usage examples -Now that you have set up the `NextUIProvider` in your app, you can use the `href` prop in the `Tabs`, +Now that you have set up the `NextUIProvider` in your app, you can use the `href` prop in the `Tabs`, `Listbox` and `Dropdown` items to navigate between pages. The [Link](/docs/components/link) component will also use the `navigate` function from the diff --git a/apps/docs/package.json b/apps/docs/package.json index 9b5a0c687f..3f46950127 100644 --- a/apps/docs/package.json +++ b/apps/docs/package.json @@ -4,7 +4,7 @@ "private": true, "scripts": { "dev": "rimraf .contentlayer && concurrently \"contentlayer2 dev\" \"next dev\"", - "build": "contentlayer2 build && next build", + "build": "contentlayer2 build && next build ", "build:analyze": "ANALYZE=true next build", "start": "next start", "lint": "next lint", @@ -12,13 +12,15 @@ "preinstall": "node preinstall.js", "build:sponsors": "tsx scripts/build-sponsors.ts", "update:search-meta": "tsx scripts/update-search-meta.ts", + "update:github-info": "tsx scripts/update-github-info.ts", "postbuild": "next-sitemap" }, "dependencies": { "@codesandbox/sandpack-react": "^2.6.4", + "@emotion/is-prop-valid": "^1.3.1", "@iconify/icons-solar": "^1.2.3", "@iconify/react": "^4.1.1", - "@internationalized/date": "3.5.5", + "@internationalized/date": "3.5.6", "@mapbox/rehype-prism": "^0.6.0", "@nextui-org/aria-utils": "workspace:*", "@nextui-org/badge": "workspace:*", @@ -37,14 +39,14 @@ "@nextui-org/use-infinite-scroll": "workspace:*", "@nextui-org/use-is-mobile": "workspace:*", "@radix-ui/react-scroll-area": "^1.0.5", - "@react-aria/focus": "3.17.1", - "@react-aria/i18n": "3.11.1", - "@react-aria/interactions": "3.21.3", - "@react-aria/selection": "3.18.1", - "@react-aria/ssr": "3.9.4", - "@react-aria/utils": "3.24.1", + "@react-aria/focus": "3.18.4", + "@react-aria/i18n": "3.12.3", + "@react-aria/interactions": "3.22.4", + "@react-aria/selection": "3.20.1", + "@react-aria/ssr": "3.9.6", + "@react-aria/utils": "3.25.3", "@react-aria/virtualizer": "3.10.1", - "@react-aria/visually-hidden": "3.8.12", + "@react-aria/visually-hidden": "3.8.17", "@react-stately/data": "3.11.4", "@react-stately/layout": "3.13.9", "@react-stately/tree": "3.8.1", @@ -98,7 +100,7 @@ "@docusaurus/utils": "2.0.0-beta.3", "@next/bundle-analyzer": "^13.4.6", "@next/env": "^13.4.12", - "@react-types/shared": "3.24.1", + "@react-types/shared": "3.25.0", "@tailwindcss/typography": "^0.5.9", "@types/canvas-confetti": "^1.4.2", "@types/marked": "^5.0.0", diff --git a/apps/docs/public/sitemap-0.xml b/apps/docs/public/sitemap-0.xml index 09725255fe..3e8de3be73 100644 --- a/apps/docs/public/sitemap-0.xml +++ b/apps/docs/public/sitemap-0.xml @@ -1,65 +1,78 @@ -https://nextui.org/feed.xml2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/figma2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/accordion2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/autocomplete2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/avatar2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/badge2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/breadcrumbs2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/button2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/card2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/checkbox-group2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/checkbox2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/chip2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/circular-progress2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/code2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/divider2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/dropdown2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/image2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/input2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/kbd2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/link2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/listbox2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/modal2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/navbar2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/pagination2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/popover2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/progress2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/radio-group2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/scroll-shadow2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/select2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/skeleton2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/slider2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/snippet2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/spacer2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/spinner2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/switch2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/table2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/tabs2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/textarea2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/tooltip2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/components/user2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/frameworks/astro2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/frameworks/nextjs2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/frameworks/remix2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/frameworks/vite2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/guide/design-principles2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/guide/installation2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/guide/introduction2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/guide/routing2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/guide/upgrade-to-v22024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/customization/colors2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/customization/create-theme2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/customization/custom-variants2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/customization/customize-theme2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/customization/dark-mode2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/customization/layout2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/customization/override-styles2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/docs/customization/theme2024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/blog/nextui-v22024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/blog/v2.1.02024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/blog/v2.2.02024-02-02T20:24:45.107Zdaily0.7 -https://nextui.org/blog2024-02-02T20:24:45.107Zdaily0.7 +https://nextui.org/feed.xml2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/figma2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/blog/nextui-v22024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/blog/v2.1.02024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/blog/v2.2.02024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/blog/v2.3.02024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/blog/v2.4.02024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/blog2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/api-references/cli-api2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/api-references/nextui-provider2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/customization/colors2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/customization/create-theme2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/customization/custom-variants2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/customization/customize-theme2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/customization/dark-mode2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/customization/layout2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/customization/override-styles2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/customization/theme2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/accordion2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/alert2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/autocomplete2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/avatar2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/badge2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/breadcrumbs2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/button2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/calendar2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/card2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/checkbox-group2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/checkbox2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/chip2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/circular-progress2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/code2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/date-input2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/date-picker2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/date-range-picker2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/divider2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/drawer2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/dropdown2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/image2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/input2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/kbd2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/link2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/listbox2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/modal2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/navbar2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/pagination2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/popover2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/progress2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/radio-group2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/range-calendar2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/scroll-shadow2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/select2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/skeleton2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/slider2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/snippet2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/spacer2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/spinner2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/switch2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/table2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/tabs2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/textarea2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/time-input2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/tooltip2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/components/user2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/frameworks/astro2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/frameworks/nextjs2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/frameworks/remix2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/frameworks/vite2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/guide/cli2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/guide/design-principles2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/guide/installation2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/guide/introduction2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/guide/routing2024-11-16T13:54:50.591Zdaily0.7 +https://nextui.org/docs/guide/upgrade-to-v22024-11-16T13:54:50.591Zdaily0.7 \ No newline at end of file diff --git a/apps/docs/scripts/update-github-info.ts b/apps/docs/scripts/update-github-info.ts new file mode 100644 index 0000000000..042a18f76b --- /dev/null +++ b/apps/docs/scripts/update-github-info.ts @@ -0,0 +1,61 @@ +/* eslint-disable no-console */ +import path from "path"; +import fs from 'fs'; + +import prettier from 'prettier'; +import fetch from 'node-fetch'; + +import { formatCompactNumber } from '../utils/number'; + +const configFolder = "config"; + +interface GithubInfo { + stars: { + raw: number; + formatted: string; + }; + forks: number; + subscribers: number; + openIssues: number; +} + +async function getGithubInfo() { + try { + const response = await fetch('https://api.github.com/repos/nextui-org/nextui'); + const data = await response.json() as any; + + const githubInfo: GithubInfo = { + stars: { + raw: data.stargazers_count, + formatted: formatCompactNumber(data.stargazers_count) + }, + forks: data.forks_count, + subscribers: data.subscribers_count, + openIssues: data.open_issues_count, + }; + + // Format JSON with prettier + const formattedJson = prettier.format(JSON.stringify(githubInfo), { + parser: 'json', + printWidth: 80, + tabWidth: 2, + semi: true, + }); + + // Create config folder if it doesn't exist + if (!fs.existsSync(configFolder)) { + fs.mkdirSync(configFolder); + } + + // Write to github-info.json + const outPath = path.join(process.cwd(), configFolder, 'github-info.json'); + + fs.writeFileSync(outPath, formattedJson); + + console.log("[NextUI] GitHub info updated successfully ✅"); + } catch (error) { + console.error("[ERROR 🔥]:", error); + } +} + +getGithubInfo(); diff --git a/apps/docs/utils/number.ts b/apps/docs/utils/number.ts new file mode 100644 index 0000000000..c9e680d489 --- /dev/null +++ b/apps/docs/utils/number.ts @@ -0,0 +1,25 @@ +/** + * Formats a number into a shortened string representation (e.g., 1K, 1.5M, 2B) + * @param number The number to format + * @param decimals Number of decimal places to show (default: 1) + * @returns Formatted string + */ +export function formatCompactNumber(number: number, decimals: number = 1): string { + if (number === 0) return "0"; + + const absNumber = Math.abs(number); + const sign = number < 0 ? "-" : ""; + + if (absNumber < 1000) { + return sign + absNumber.toString(); + } + + const suffixes = ["", "K", "M", "B", "T"]; + const exponent = Math.min(Math.floor(Math.log10(absNumber) / 3), suffixes.length - 1); + const shortNumber = (absNumber / Math.pow(1000, exponent)).toFixed(decimals); + + // Remove trailing zeros after decimal point + const formattedNumber = parseFloat(shortNumber).toString(); + + return sign + formattedNumber + suffixes[exponent]; +} diff --git a/package.json b/package.json index 01b90ef50d..7e7642b0b8 100644 --- a/package.json +++ b/package.json @@ -69,9 +69,9 @@ "@commitlint/cli": "^17.2.0", "@commitlint/config-conventional": "^17.2.0", "@react-bootstrap/babel-preset": "^2.1.0", - "@react-types/link": "^3.4.4", - "@react-types/shared": "3.24.1", - "@storybook/react": "^8.4.5", + "@react-types/link": "3.5.7", + "@react-types/shared": "3.25.0", + "@storybook/react": "^8.4.5", "@swc/core": "^1.3.35", "@swc/jest": "^0.2.24", "@testing-library/dom": "^10.4.0", diff --git a/packages/components/accordion/CHANGELOG.md b/packages/components/accordion/CHANGELOG.md index 4f44a353a2..0da273cd91 100644 --- a/packages/components/accordion/CHANGELOG.md +++ b/packages/components/accordion/CHANGELOG.md @@ -1,5 +1,151 @@ # @nextui-org/accordion +## 2.1.0-beta.9 + +### Patch Changes + +- Updated dependencies []: + - @nextui-org/aria-utils@2.1.0-beta.8 + - @nextui-org/framer-utils@2.0.26-beta.8 + +## 2.1.0-beta.8 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/divider@2.1.0-beta.7 + - @nextui-org/use-aria-accordion@2.1.0-beta.6 + - @nextui-org/aria-utils@2.1.0-beta.7 + - @nextui-org/dom-animation@2.0.1-beta.6 + - @nextui-org/framer-utils@2.0.26-beta.7 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-icons@2.0.10-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.7 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/divider@2.1.0-beta.6 + - @nextui-org/use-aria-accordion@2.1.0-beta.5 + - @nextui-org/aria-utils@2.1.0-beta.6 + - @nextui-org/dom-animation@2.0.1-beta.5 + - @nextui-org/framer-utils@2.0.26-beta.6 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-icons@2.0.10-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/divider@2.1.0-beta.5 + - @nextui-org/use-aria-accordion@2.1.0-beta.4 + - @nextui-org/aria-utils@2.1.0-beta.5 + - @nextui-org/dom-animation@2.0.1-beta.4 + - @nextui-org/framer-utils@2.0.26-beta.5 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-icons@2.0.10-beta.4 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.5 + +### Patch Changes + +- Updated dependencies [[`0f55c491b`](https://github.com/nextui-org/nextui/commit/0f55c491b73da8944f9b38f2ad7486d1b89f8b7a)]: + - @nextui-org/shared-icons@2.0.10-beta.3 + - @nextui-org/divider@2.1.0-beta.4 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/divider@2.1.0-beta.4 + - @nextui-org/aria-utils@2.1.0-beta.4 + - @nextui-org/framer-utils@2.0.26-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/divider@2.1.0-beta.3 + - @nextui-org/use-aria-accordion@2.1.0-beta.3 + - @nextui-org/aria-utils@2.1.0-beta.3 + - @nextui-org/dom-animation@2.0.1-beta.3 + - @nextui-org/framer-utils@2.0.26-beta.3 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-icons@2.0.10-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/divider@2.1.0-beta.2 + - @nextui-org/use-aria-accordion@2.1.0-beta.2 + - @nextui-org/aria-utils@2.1.0-beta.2 + - @nextui-org/dom-animation@2.0.1-beta.2 + - @nextui-org/framer-utils@2.0.26-beta.2 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-icons@2.0.10-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/divider@2.1.0-beta.1 + - @nextui-org/use-aria-accordion@2.1.0-beta.1 + - @nextui-org/aria-utils@2.1.0-beta.1 + - @nextui-org/dom-animation@2.0.1-beta.1 + - @nextui-org/framer-utils@2.0.26-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-icons@2.0.10-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- [#3523](https://github.com/nextui-org/nextui/pull/3523) [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb) Thanks [@wingkwong](https://github.com/wingkwong)! - framer motion optimization (#3340) + +- [#3523](https://github.com/nextui-org/nextui/pull/3523) [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb) Thanks [@wingkwong](https://github.com/wingkwong)! - update `framer-motion` versions + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/divider@2.1.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/use-aria-accordion@2.1.0-beta.0 + - @nextui-org/aria-utils@2.1.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/dom-animation@2.0.1-beta.0 + - @nextui-org/framer-utils@2.0.26-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.0.40 ### Patch Changes diff --git a/packages/components/accordion/package.json b/packages/components/accordion/package.json index 681011d80e..81e2b086b2 100644 --- a/packages/components/accordion/package.json +++ b/packages/components/accordion/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/accordion", - "version": "2.0.40", + "version": "2.1.0-beta.9", "description": "Collapse display a list of high-level options that can expand/collapse to reveal more information.", "keywords": [ "react", @@ -40,11 +40,11 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", "framer-motion": ">=11.5.6", - "@nextui-org/theme": ">=2.1.0", - "@nextui-org/system": ">=2.0.0" + "@nextui-org/theme": ">=2.3.0-beta.0", + "@nextui-org/system": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/aria-utils": "workspace:*", @@ -55,13 +55,13 @@ "@nextui-org/divider": "workspace:*", "@nextui-org/use-aria-accordion": "workspace:*", "@nextui-org/dom-animation": "workspace:*", - "@react-aria/interactions": "3.22.2", - "@react-aria/focus": "3.18.2", - "@react-aria/utils": "3.25.2", - "@react-stately/tree": "3.8.4", - "@react-aria/button": "3.9.8", - "@react-types/accordion": "3.0.0-alpha.23", - "@react-types/shared": "3.24.1" + "@react-aria/interactions": "3.22.4", + "@react-aria/focus": "3.18.4", + "@react-aria/utils": "3.25.3", + "@react-stately/tree": "3.8.5", + "@react-aria/button": "3.10.1", + "@react-types/accordion": "3.0.0-alpha.24", + "@react-types/shared": "3.25.0" }, "devDependencies": { "@nextui-org/theme": "workspace:*", diff --git a/packages/components/alert/CHANGELOG.md b/packages/components/alert/CHANGELOG.md new file mode 100644 index 0000000000..18bde8a34c --- /dev/null +++ b/packages/components/alert/CHANGELOG.md @@ -0,0 +1,127 @@ +# @nextui-org/alert + +## 2.1.0-beta.10 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/button@2.1.0-beta.7 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-icons@2.0.10-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.9 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/button@2.1.0-beta.6 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-icons@2.0.10-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.8 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/button@2.1.0-beta.5 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-icons@2.0.10-beta.4 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.7 + +### Patch Changes + +- [#4073](https://github.com/nextui-org/nextui/pull/4073) [`70dc75983`](https://github.com/nextui-org/nextui/commit/70dc7598388022fca04255c3c1623468a38a3803) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Alert compoentn styles improved + +- Updated dependencies []: + - @nextui-org/button@2.1.0-beta.4 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4071](https://github.com/nextui-org/nextui/pull/4071) [`31349c178`](https://github.com/nextui-org/nextui/commit/31349c178b9b2bd0be9856bc09126a37be68901a) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Alert styles improved + +- Updated dependencies []: + - @nextui-org/button@2.1.0-beta.4 + +## 2.1.0-beta.5 + +### Patch Changes + +- [#4054](https://github.com/nextui-org/nextui/pull/4054) [`0f55c491b`](https://github.com/nextui-org/nextui/commit/0f55c491b73da8944f9b38f2ad7486d1b89f8b7a) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Alert design improved + +- Updated dependencies [[`0f55c491b`](https://github.com/nextui-org/nextui/commit/0f55c491b73da8944f9b38f2ad7486d1b89f8b7a)]: + - @nextui-org/shared-icons@2.0.10-beta.3 + - @nextui-org/button@2.1.0-beta.4 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/button@2.1.0-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/button@2.1.0-beta.3 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-icons@2.0.10-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/button@2.1.0-beta.2 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-icons@2.0.10-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/button@2.1.0-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-icons@2.0.10-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- [#3982](https://github.com/nextui-org/nextui/pull/3982) [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - introduced Alert component (#2250) + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/button@2.1.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 diff --git a/packages/components/alert/package.json b/packages/components/alert/package.json index c6ab2e033a..be1e5fa155 100644 --- a/packages/components/alert/package.json +++ b/packages/components/alert/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/alert", - "version": "2.0.0", + "version": "2.1.0-beta.10", "description": "Alerts are temporary notifications that provide concise feedback about an action or event.", "keywords": [ "alert" @@ -38,17 +38,17 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", - "@nextui-org/theme": ">=2.1.0", - "@nextui-org/system": ">=2.0.0" + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "@nextui-org/system": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/react-utils": "workspace:*", "@nextui-org/shared-icons": "workspace:*", "@nextui-org/shared-utils": "workspace:*", - "@react-stately/utils": "3.10.1", - "@react-aria/utils": "3.24.1", + "@react-stately/utils": "3.10.4", + "@react-aria/utils": "3.25.3", "@nextui-org/button": "workspace:*" }, "devDependencies": { diff --git a/packages/components/alert/src/alert.tsx b/packages/components/alert/src/alert.tsx index 3cac310475..cc8c9a691d 100644 --- a/packages/components/alert/src/alert.tsx +++ b/packages/components/alert/src/alert.tsx @@ -24,15 +24,16 @@ const iconMap = { export type AlertColor = keyof typeof iconMap; -export interface AlertProps extends Omit { - color: AlertColor; -} +export interface AlertProps extends Omit {} const Alert = forwardRef<"div", AlertProps>((props, ref) => { const { title, icon, + children, description, + endContent, + startContent, isClosable, domRef, handleClose, @@ -45,6 +46,7 @@ const Alert = forwardRef<"div", AlertProps>((props, ref) => { isVisible, onClose, getAlertIconProps, + getIconWrapperProps, } = useAlert({...props, ref}); if (!isVisible) return null; @@ -55,12 +57,16 @@ const Alert = forwardRef<"div", AlertProps>((props, ref) => { return (
- {customIcon || } + {startContent} +
+ {customIcon || } +
{title &&
{title}
} {!isEmpty(description) &&
{description}
} + {children}
- + {endContent} {(isClosable || onClose) && ( + } + title="You have no credits left" + variant="faded" + /> + ); +}; + +const CustomAlert = React.forwardRef( + ( + {title, children, variant = "faded", color = "secondary", className, classNames, ...props}, + ref, + ) => { + const colorClass = React.useMemo(() => { + switch (color) { + case "default": + return "before:bg-default-300"; + case "primary": + return "before:bg-primary"; + case "secondary": + return "before:bg-secondary"; + case "success": + return "before:bg-success"; + case "warning": + return "before:bg-warning"; + case "danger": + return "before:bg-danger"; + default: + return `before:bg-default-200`; + } + }, []); + + return ( + +
{children}
+ + ); + }, +); + +CustomAlert.displayName = "CustomAlert"; + +const CustomStylesTemplate = (args) => { + const colors = ["default", "primary", "secondary", "success", "warning", "danger"]; + + return ( +
+ {colors.map((color) => ( + +
+ + +
+ + ))} +
+ ); +}; + export const Default = { render: Template, args: { @@ -122,6 +230,7 @@ export const Color = { render: ColorTemplate, args: { ...defaultProps, + variant: "faded", }, }; @@ -172,21 +281,16 @@ export const Closable = { }, }; -export const CustomWithClassNames = { - render: Template, +export const WithEndContent = { + render: WithEndContentTemplate, + args: { + ...defaultProps, + }, +}; + +export const CustomStyles = { + render: CustomStylesTemplate, args: { ...defaultProps, - classNames: { - base: [ - "bg-background", - "border", - "border-foreground-400", - "shadow", - "hover:bg-slate-200", - "cursor-pointer", - ], - title: ["text-base", "text-foreground", "font-semibold"], - description: ["text-base", "text-foreground-600"], - }, }, }; diff --git a/packages/components/autocomplete/CHANGELOG.md b/packages/components/autocomplete/CHANGELOG.md index 77ddeded3b..5e39d513a7 100644 --- a/packages/components/autocomplete/CHANGELOG.md +++ b/packages/components/autocomplete/CHANGELOG.md @@ -1,5 +1,236 @@ # @nextui-org/autocomplete +## 2.2.0-beta.13 + +### Patch Changes + +- Updated dependencies [[`256d46277`](https://github.com/nextui-org/nextui/commit/256d462771c19d6ca5b969d0ec44419fb560f0ac)]: + - @nextui-org/listbox@2.2.0-beta.10 + - @nextui-org/button@2.1.0-beta.7 + - @nextui-org/input@2.3.0-beta.9 + - @nextui-org/popover@2.2.0-beta.9 + - @nextui-org/scroll-shadow@2.2.0-beta.7 + - @nextui-org/spinner@2.1.0-beta.7 + +## 2.2.0-beta.12 + +### Patch Changes + +- Updated dependencies []: + - @nextui-org/button@2.1.0-beta.7 + - @nextui-org/input@2.3.0-beta.9 + - @nextui-org/listbox@2.2.0-beta.9 + - @nextui-org/popover@2.2.0-beta.9 + - @nextui-org/scroll-shadow@2.2.0-beta.7 + - @nextui-org/aria-utils@2.1.0-beta.8 + +## 2.2.0-beta.11 + +### Patch Changes + +- [#4094](https://github.com/nextui-org/nextui/pull/4094) [`b9d5d4925`](https://github.com/nextui-org/nextui/commit/b9d5d492519778a4bf071748ec9f2b4e25d8373f) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Virtualization support added to Listbox & Autocomplete + +- Updated dependencies [[`b9d5d4925`](https://github.com/nextui-org/nextui/commit/b9d5d492519778a4bf071748ec9f2b4e25d8373f)]: + - @nextui-org/listbox@2.2.0-beta.8 + - @nextui-org/button@2.1.0-beta.7 + - @nextui-org/input@2.3.0-beta.9 + - @nextui-org/popover@2.2.0-beta.8 + - @nextui-org/scroll-shadow@2.2.0-beta.7 + - @nextui-org/spinner@2.1.0-beta.7 + +## 2.2.0-beta.10 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/button@2.1.0-beta.7 + - @nextui-org/input@2.3.0-beta.9 + - @nextui-org/listbox@2.2.0-beta.7 + - @nextui-org/popover@2.2.0-beta.8 + - @nextui-org/scroll-shadow@2.2.0-beta.7 + - @nextui-org/spinner@2.1.0-beta.7 + - @nextui-org/use-aria-button@2.1.0-beta.6 + - @nextui-org/use-safe-layout-effect@2.0.7-beta.4 + - @nextui-org/aria-utils@2.1.0-beta.7 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-icons@2.0.10-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.2.0-beta.9 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/button@2.1.0-beta.6 + - @nextui-org/input@2.3.0-beta.8 + - @nextui-org/listbox@2.2.0-beta.6 + - @nextui-org/popover@2.2.0-beta.7 + - @nextui-org/scroll-shadow@2.2.0-beta.6 + - @nextui-org/spinner@2.1.0-beta.6 + - @nextui-org/use-aria-button@2.1.0-beta.5 + - @nextui-org/use-safe-layout-effect@2.0.7-beta.3 + - @nextui-org/aria-utils@2.1.0-beta.6 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-icons@2.0.10-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.2.0-beta.8 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/button@2.1.0-beta.5 + - @nextui-org/input@2.3.0-beta.7 + - @nextui-org/listbox@2.2.0-beta.5 + - @nextui-org/popover@2.2.0-beta.6 + - @nextui-org/scroll-shadow@2.2.0-beta.5 + - @nextui-org/spinner@2.1.0-beta.5 + - @nextui-org/use-aria-button@2.1.0-beta.4 + - @nextui-org/use-safe-layout-effect@2.0.7-beta.2 + - @nextui-org/aria-utils@2.1.0-beta.5 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-icons@2.0.10-beta.4 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.2.0-beta.7 + +### Patch Changes + +- Updated dependencies [[`0f55c491b`](https://github.com/nextui-org/nextui/commit/0f55c491b73da8944f9b38f2ad7486d1b89f8b7a)]: + - @nextui-org/shared-icons@2.0.10-beta.3 + - @nextui-org/button@2.1.0-beta.4 + - @nextui-org/input@2.3.0-beta.6 + - @nextui-org/listbox@2.2.0-beta.4 + - @nextui-org/popover@2.2.0-beta.5 + - @nextui-org/scroll-shadow@2.2.0-beta.4 + - @nextui-org/spinner@2.1.0-beta.4 + +## 2.2.0-beta.6 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/button@2.1.0-beta.4 + - @nextui-org/input@2.3.0-beta.5 + - @nextui-org/listbox@2.2.0-beta.4 + - @nextui-org/popover@2.2.0-beta.5 + - @nextui-org/scroll-shadow@2.2.0-beta.4 + - @nextui-org/spinner@2.1.0-beta.4 + - @nextui-org/aria-utils@2.1.0-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.2.0-beta.5 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/button@2.1.0-beta.3 + - @nextui-org/input@2.3.0-beta.4 + - @nextui-org/listbox@2.2.0-beta.3 + - @nextui-org/popover@2.2.0-beta.4 + - @nextui-org/scroll-shadow@2.2.0-beta.3 + - @nextui-org/spinner@2.1.0-beta.3 + - @nextui-org/use-aria-button@2.1.0-beta.3 + - @nextui-org/use-safe-layout-effect@2.0.7-beta.1 + - @nextui-org/aria-utils@2.1.0-beta.3 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-icons@2.0.10-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.2.0-beta.4 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/button@2.1.0-beta.2 + - @nextui-org/input@2.3.0-beta.3 + - @nextui-org/listbox@2.2.0-beta.2 + - @nextui-org/popover@2.2.0-beta.3 + - @nextui-org/scroll-shadow@2.2.0-beta.2 + - @nextui-org/spinner@2.1.0-beta.2 + - @nextui-org/use-aria-button@2.1.0-beta.2 + - @nextui-org/use-safe-layout-effect@2.0.7-beta.0 + - @nextui-org/aria-utils@2.1.0-beta.2 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-icons@2.0.10-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.2.0-beta.3 + +### Patch Changes + +- Updated dependencies [[`563c1585a`](https://github.com/nextui-org/nextui/commit/563c1585a3c1a32e8272ec4641cfabeaaac3296c)]: + - @nextui-org/popover@2.2.0-beta.2 + +## 2.2.0-beta.2 + +### Patch Changes + +- Updated dependencies [[`a2d653137`](https://github.com/nextui-org/nextui/commit/a2d653137d61465a88dfa3830bb3a44e3a7faa87)]: + - @nextui-org/input@2.3.0-beta.2 + - @nextui-org/popover@2.2.0-beta.1 + - @nextui-org/listbox@2.2.0-beta.1 + +## 2.2.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/button@2.1.0-beta.1 + - @nextui-org/input@2.3.0-beta.1 + - @nextui-org/listbox@2.2.0-beta.1 + - @nextui-org/popover@2.2.0-beta.1 + - @nextui-org/scroll-shadow@2.2.0-beta.1 + - @nextui-org/spinner@2.1.0-beta.1 + - @nextui-org/use-aria-button@2.1.0-beta.1 + - @nextui-org/aria-utils@2.1.0-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-icons@2.0.10-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.2.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- [#3788](https://github.com/nextui-org/nextui/pull/3788) [`2e82f165a`](https://github.com/nextui-org/nextui/commit/2e82f165a98e1cdc8f0702d2971fc534b763fd15) Thanks [@abhinav700](https://github.com/abhinav700)! - Clicking the clear button clears the selected value without closing the dropdown. (#3788) + +- [#3845](https://github.com/nextui-org/nextui/pull/3845) [`780ba4316`](https://github.com/nextui-org/nextui/commit/780ba43162dc7ceb3f7b46c68c8134473013c873) Thanks [@alexnguyennz](https://github.com/alexnguyennz)! - Return null if there are items for exit animation on popover close to work + +- [#2186](https://github.com/nextui-org/nextui/pull/2186) [`557f10f5e`](https://github.com/nextui-org/nextui/commit/557f10f5ec60f9f69bed098b3670046cd56d15da) Thanks [@juliesaia](https://github.com/juliesaia)! - automatically focus first non-disabled item + +- [#3523](https://github.com/nextui-org/nextui/pull/3523) [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb) Thanks [@wingkwong](https://github.com/wingkwong)! - update `framer-motion` versions + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`a2e562b03`](https://github.com/nextui-org/nextui/commit/a2e562b03f79b52b0b35f07104b3585ea05e2cb6), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`9f6839faf`](https://github.com/nextui-org/nextui/commit/9f6839faf9fe05c766571bcb71028bd3236d6e3a), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`606f75726`](https://github.com/nextui-org/nextui/commit/606f75726c6b273ea25528ec3269fa6e82af3349), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/listbox@2.2.0-beta.0 + - @nextui-org/button@2.1.0-beta.0 + - @nextui-org/input@2.3.0-beta.0 + - @nextui-org/popover@2.2.0-beta.0 + - @nextui-org/scroll-shadow@2.2.0-beta.0 + - @nextui-org/spinner@2.1.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/use-aria-button@2.1.0-beta.0 + - @nextui-org/aria-utils@2.1.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.1.7 ### Patch Changes diff --git a/packages/components/autocomplete/__tests__/autocomplete.test.tsx b/packages/components/autocomplete/__tests__/autocomplete.test.tsx index 5fa0b3a783..55a050d64c 100644 --- a/packages/components/autocomplete/__tests__/autocomplete.test.tsx +++ b/packages/components/autocomplete/__tests__/autocomplete.test.tsx @@ -3,6 +3,7 @@ import * as React from "react"; import {within, render, renderHook, act} from "@testing-library/react"; import userEvent, {UserEvent} from "@testing-library/user-event"; import {useForm} from "react-hook-form"; +import {Form} from "@nextui-org/form"; import {Autocomplete, AutocompleteItem, AutocompleteProps, AutocompleteSection} from "../src"; import {Modal, ModalContent, ModalBody, ModalHeader, ModalFooter} from "../../modal/src"; @@ -588,6 +589,60 @@ describe("Autocomplete", () => { expect(autocomplete2).toHaveFocus(); }); + it("should work when key equals textValue", async () => { + const wrapper = render( + + {(item) => {item.value}} + , + ); + + const autocomplete = wrapper.getByTestId("when-key-equals-textValue"); + + const user = userEvent.setup(); + + await user.click(autocomplete); + + expect(autocomplete).toHaveValue("cat"); + expect(autocomplete).toHaveAttribute("aria-expanded", "true"); + + let listboxItems = wrapper.getAllByRole("option"); + + await user.click(listboxItems[1]); + + expect(autocomplete).toHaveValue("dog"); + expect(autocomplete).toHaveAttribute("aria-expanded", "false"); + }); + + it("should work when key equals textValue (controlled)", async () => { + const wrapper = render( + + {(item) => {item.value}} + , + ); + + const autocomplete = wrapper.getByTestId("when-key-equals-textValue"); + + const user = userEvent.setup(); + + await user.click(autocomplete); + + expect(autocomplete).toHaveValue("cat"); + expect(autocomplete).toHaveAttribute("aria-expanded", "true"); + + let listboxItems = wrapper.getAllByRole("option"); + + await user.click(listboxItems[1]); + + expect(autocomplete).toHaveValue("dog"); + expect(autocomplete).toHaveAttribute("aria-expanded", "false"); + }); + describe("validation", () => { let user; @@ -598,9 +653,9 @@ describe("Autocomplete", () => { describe("validationBehavior=native", () => { it("supports isRequired", async () => { const {getByTestId, getByRole, findByRole} = render( -
+ - , + , ); const input = getByRole("combobox") as HTMLInputElement; @@ -628,6 +683,62 @@ describe("Autocomplete", () => { await user.click(items[0]); expect(input).toHaveAttribute("aria-describedby"); }); + + it("supports server validation", async () => { + function Test() { + const [serverErrors, setServerErrors] = React.useState({}); + const onSubmit = (e) => { + e.preventDefault(); + setServerErrors({ + value: "Invalid value.", + }); + }; + + return ( +
+ + + + ); + } + + const {getByTestId, getByRole} = render(); + + const input = getByTestId("input") as HTMLInputElement; + + expect(input).not.toHaveAttribute("aria-describedby"); + + await user.click(getByTestId("submit")); + + expect(input).toHaveAttribute("aria-describedby"); + expect(document.getElementById(input.getAttribute("aria-describedby")!)).toHaveTextContent( + "Invalid value.", + ); + expect(input.validity.valid).toBe(false); + + await user.tab({shift: true}); + await user.keyboard("[ArrowRight]Ze"); + + act(() => { + jest.runAllTimers(); + }); + + const listbox = getByRole("listbox"); + const items = within(listbox).getAllByRole("option"); + + await user.click(items[0]); + act(() => { + jest.runAllTimers(); + }); + + expect(input).toHaveAttribute("aria-describedby"); + await user.tab(); + + expect(input).not.toHaveAttribute("aria-describedby"); + expect(input.validity.valid).toBe(true); + }); }); describe("validationBehavior=aria", () => { @@ -635,8 +746,8 @@ describe("Autocomplete", () => { let {getByRole, findByRole} = render(
(v.inputValue === "Penguin" ? "Invalid value" : null)} + defaultSelectedKey="penguin" + validate={(v) => (v.selectedKey === "penguin" ? "Invalid value" : null)} validationBehavior="aria" /> , @@ -664,61 +775,42 @@ describe("Autocomplete", () => { expect(input).not.toHaveAttribute("aria-describedby"); expect(input).not.toHaveAttribute("aria-invalid"); }); - }); - }); - it("should work when key equals textValue", async () => { - const wrapper = render( - - {(item) => {item.value}} - , - ); - - const autocomplete = wrapper.getByTestId("when-key-equals-textValue"); - - const user = userEvent.setup(); - - await user.click(autocomplete); - - expect(autocomplete).toHaveValue("cat"); - expect(autocomplete).toHaveAttribute("aria-expanded", "true"); - - let listboxItems = wrapper.getAllByRole("option"); - - await user.click(listboxItems[1]); - - expect(autocomplete).toHaveValue("dog"); - expect(autocomplete).toHaveAttribute("aria-expanded", "false"); - }); - - it("should work when key equals textValue (controlled)", async () => { - const wrapper = render( - - {(item) => {item.value}} - , - ); + it("supports server validation", async () => { + const {getByTestId, getByRole} = render( +
+ + , + ); - const autocomplete = wrapper.getByTestId("when-key-equals-textValue"); + const input = getByTestId("input"); - const user = userEvent.setup(); + expect(input).toHaveAttribute("aria-describedby"); + expect(input).toHaveAttribute("aria-invalid", "true"); + expect(document.getElementById(input.getAttribute("aria-describedby")!)).toHaveTextContent( + "Invalid value", + ); - await user.click(autocomplete); + await user.tab(); + await user.keyboard("[ArrowRight]Ze"); - expect(autocomplete).toHaveValue("cat"); - expect(autocomplete).toHaveAttribute("aria-expanded", "true"); + act(() => { + jest.runAllTimers(); + }); - let listboxItems = wrapper.getAllByRole("option"); + const listbox = getByRole("listbox"); + const items = within(listbox).getAllByRole("option"); - await user.click(listboxItems[1]); + await user.click(items[0]); + act(() => { + jest.runAllTimers(); + }); - expect(autocomplete).toHaveValue("dog"); - expect(autocomplete).toHaveAttribute("aria-expanded", "false"); + await user.tab(); + expect(input).not.toHaveAttribute("aria-describedby"); + expect(input).not.toHaveAttribute("aria-invalid"); + }); + }); }); }); diff --git a/packages/components/autocomplete/package.json b/packages/components/autocomplete/package.json index adf887b029..3ce7a9cd14 100644 --- a/packages/components/autocomplete/package.json +++ b/packages/components/autocomplete/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/autocomplete", - "version": "2.1.7", + "version": "2.2.0-beta.13", "description": "An autocomplete combines a text input with a listbox, allowing users to filter a list of options to items matching a query.", "keywords": [ "autocomplete" @@ -34,13 +34,14 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "@nextui-org/system": ">=2.0.0", - "@nextui-org/theme": ">=2.1.0", - "framer-motion": ">=11.5.6", - "react": ">=18", - "react-dom": ">=18" + "@nextui-org/system": ">=2.3.0-beta.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "framer-motion": ">=11.5.6 || >=12.0.0-alpha.1", + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0" }, "dependencies": { + "@nextui-org/form": "workspace:*", "@nextui-org/aria-utils": "workspace:*", "@nextui-org/button": "workspace:*", "@nextui-org/input": "workspace:*", @@ -53,15 +54,15 @@ "@nextui-org/spinner": "workspace:*", "@nextui-org/use-aria-button": "workspace:*", "@nextui-org/use-safe-layout-effect": "workspace:*", - "@react-aria/combobox": "3.10.3", - "@react-aria/focus": "3.18.2", - "@react-aria/i18n": "3.12.2", - "@react-aria/interactions": "3.22.2", - "@react-aria/utils": "3.25.2", - "@react-aria/visually-hidden": "3.8.15", - "@react-stately/combobox": "3.9.2", - "@react-types/combobox": "3.12.1", - "@react-types/shared": "3.24.1" + "@react-aria/combobox": "3.10.5", + "@react-aria/focus": "3.18.4", + "@react-aria/i18n": "3.12.3", + "@react-aria/interactions": "3.22.4", + "@react-aria/utils": "3.25.3", + "@react-aria/visually-hidden": "3.8.17", + "@react-stately/combobox": "3.10.0", + "@react-types/combobox": "3.13.0", + "@react-types/shared": "3.25.0" }, "devDependencies": { "@nextui-org/avatar": "workspace:*", @@ -70,7 +71,7 @@ "@nextui-org/system": "workspace:*", "@nextui-org/theme": "workspace:*", "@nextui-org/use-infinite-scroll": "workspace:*", - "@react-stately/data": "3.11.6", + "@react-stately/data": "3.11.7", "clean-package": "2.2.0", "framer-motion": "11.9.0", "react": "^18.0.0", @@ -78,4 +79,4 @@ "react-hook-form": "^7.51.3" }, "clean-package": "../../../clean-package.config.json" -} \ No newline at end of file +} diff --git a/packages/components/autocomplete/src/use-autocomplete.ts b/packages/components/autocomplete/src/use-autocomplete.ts index 6f84d1c979..f9bc483a1e 100644 --- a/packages/components/autocomplete/src/use-autocomplete.ts +++ b/packages/components/autocomplete/src/use-autocomplete.ts @@ -18,6 +18,7 @@ import {chain, mergeProps} from "@react-aria/utils"; import {ButtonProps} from "@nextui-org/button"; import {AsyncLoadable, PressEvent} from "@react-types/shared"; import {useComboBox} from "@react-aria/combobox"; +import {FormContext, useSlottedContext} from "@nextui-org/form"; import {ariaShouldCloseOnInteractOutside} from "@nextui-org/aria-utils"; interface Props extends Omit, keyof ComboBoxProps> { @@ -110,16 +111,34 @@ interface Props extends Omit, keyof ComboBoxProps * Callback fired when the select menu is closed. */ onClose?: () => void; + /** + * Whether to enable virtualization of the listbox items. + * By default, virtualization is automatically enabled when the number of items is greater than 50. + * @default undefined + */ + isVirtualized?: boolean; } export type UseAutocompleteProps = Props & Omit & ComboBoxProps & AsyncLoadable & - AutocompleteVariantProps; + AutocompleteVariantProps & { + /** + * The height of each item in the listbox. + * This is required for virtualized listboxes to calculate the height of each item. + */ + itemHeight?: number; + /** + * The max height of the listbox (which will be rendered in a popover). + * This is required for virtualized listboxes to set the maximum height of the listbox. + */ + maxListboxHeight?: number; + }; export function useAutocomplete(originalProps: UseAutocompleteProps) { const globalContext = useProviderContext(); + const {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {}; const [props, variantProps] = mapPropsVariants(originalProps, autocomplete.variantKeys); const disableAnimation = @@ -158,7 +177,10 @@ export function useAutocomplete(originalProps: UseAutocomplete clearButtonProps = {}, showScrollIndicators = true, allowsCustomValue = false, - validationBehavior = globalContext?.validationBehavior ?? "aria", + isVirtualized, + maxListboxHeight = 256, + itemHeight = 32, + validationBehavior = formValidationBehavior ?? globalContext?.validationBehavior ?? "aria", className, classNames, errorMessage, @@ -425,14 +447,25 @@ export function useAutocomplete(originalProps: UseAutocomplete onClick: chain(slotsProps.inputProps.onClick, otherProps.onClick), } as unknown as InputProps); - const getListBoxProps = () => - ({ + const getListBoxProps = () => { + // Use isVirtualized prop if defined, otherwise fallback to default behavior + const shouldVirtualize = isVirtualized ?? state.collection.size > 50; + + return { state, ref: listBoxRef, + isVirtualized: shouldVirtualize, + virtualization: shouldVirtualize + ? { + maxListboxHeight, + itemHeight, + } + : undefined, ...mergeProps(slotsProps.listboxProps, listBoxProps, { shouldHighlightOnFocus: true, }), - } as ListboxProps); + } as ListboxProps; + }; const getPopoverProps = (props: DOMAttributes = {}) => { const popoverProps = mergeProps(slotsProps.popoverProps, props); @@ -479,6 +512,9 @@ export function useAutocomplete(originalProps: UseAutocomplete props?.className, ), }), + style: { + maxHeight: originalProps.maxListboxHeight ?? 256, + }, }); const getEndContentWrapperProps: PropGetter = (props: any = {}) => ({ diff --git a/packages/components/autocomplete/stories/autocomplete.stories.tsx b/packages/components/autocomplete/stories/autocomplete.stories.tsx index ca4db45df2..a63fdf61b4 100644 --- a/packages/components/autocomplete/stories/autocomplete.stories.tsx +++ b/packages/components/autocomplete/stories/autocomplete.stories.tsx @@ -18,6 +18,7 @@ import {useInfiniteScroll} from "@nextui-org/use-infinite-scroll"; import {PetBoldIcon, SearchLinearIcon, SelectorIcon} from "@nextui-org/shared-icons"; import {Avatar} from "@nextui-org/avatar"; import {Button} from "@nextui-org/button"; +import {Form} from "@nextui-org/form"; import {Autocomplete, AutocompleteItem, AutocompleteProps, AutocompleteSection} from "../src"; @@ -100,6 +101,58 @@ const items = animalsData.map((item) => ( )); +interface LargeDatasetSchema { + label: string; + value: string; + description: string; +} + +function generateLargeDataset(n: number): LargeDatasetSchema[] { + const dataset: LargeDatasetSchema[] = []; + + const items = [ + "Cat", + "Dog", + "Elephant", + "Lion", + "Tiger", + "Giraffe", + "Dolphin", + "Penguin", + "Zebra", + "Shark", + "Whale", + "Otter", + "Crocodile", + ]; + + for (let i = 0; i < n; i++) { + const item = items[i % items.length]; + + dataset.push({ + label: `${item}${i}`, + value: `${item.toLowerCase()}${i}`, + description: "Sample description", + }); + } + + return dataset; +} + +const LargeDatasetTemplate = (args: AutocompleteProps & {numItems: number}) => { + const largeDataset = generateLargeDataset(args.numItems); + + return ( + + {largeDataset.map((item, index) => ( + + {item.label} + + ))} + + ); +}; + const Template = (args: AutocompleteProps) => ( Red Panda @@ -803,6 +856,33 @@ const WithReactHookFormTemplate = (args: AutocompleteProps) => { ); }; +const ServerValidationTemplate = (args: AutocompleteProps) => { + const [serverErrors, setServerErrors] = React.useState({}); + const onSubmit = (e) => { + e.preventDefault(); + setServerErrors({ + animals: "Please select a valid animal.", + }); + }; + + return ( +
+ + Red Panda + Cat + Dog + + +
+ ); +}; + export const Default = { render: Template, args: { @@ -978,6 +1058,13 @@ export const WithValidation = { }, }; +export const WithServerValidation = { + render: ServerValidationTemplate, + args: { + ...defaultProps, + }, +}; + export const WithSections = { render: WithSectionsTemplate, @@ -1061,3 +1148,42 @@ export const FullyControlled = { ...defaultProps, }, }; + +export const OneThousandList = { + render: LargeDatasetTemplate, + args: { + ...defaultProps, + placeholder: "Search...", + numItems: 1000, + }, +}; + +export const TenThousandList = { + render: LargeDatasetTemplate, + args: { + ...defaultProps, + placeholder: "Search...", + numItems: 10000, + }, +}; + +export const CustomMaxListboxHeight = { + render: LargeDatasetTemplate, + args: { + ...defaultProps, + placeholder: "Search...", + numItems: 1000, + maxListboxHeight: 400, + }, +}; + +export const CustomItemHeight = { + render: LargeDatasetTemplate, + args: { + ...defaultProps, + placeholder: "Search...", + numItems: 1000, + maxListboxHeight: 400, + itemHeight: 40, + }, +}; diff --git a/packages/components/avatar/CHANGELOG.md b/packages/components/avatar/CHANGELOG.md index 1064734906..aef66a41bc 100644 --- a/packages/components/avatar/CHANGELOG.md +++ b/packages/components/avatar/CHANGELOG.md @@ -1,5 +1,115 @@ # @nextui-org/avatar +## 2.1.0-beta.10 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/use-image@2.0.7-beta.9 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.9 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/use-image@2.0.7-beta.8 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.8 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/use-image@2.0.7-beta.7 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.7 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/use-image@2.0.7-beta.6 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.5 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/use-image@2.0.7-beta.5 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`52f6274e9`](https://github.com/nextui-org/nextui/commit/52f6274e9baecc928ee7cbb6a8110b72931061b8)]: + - @nextui-org/use-image@2.0.7-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- Updated dependencies [[`1c05c6d77`](https://github.com/nextui-org/nextui/commit/1c05c6d77b10f6b18f3c34d36eece7702704267a)]: + - @nextui-org/use-image@2.0.7-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- Updated dependencies [[`98b13d9a9`](https://github.com/nextui-org/nextui/commit/98b13d9a9368ed188f62e3e7ff885ed3ec7c3f5a)]: + - @nextui-org/use-image@2.0.7-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/use-image@2.0.7-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`90cb5b14a`](https://github.com/nextui-org/nextui/commit/90cb5b14abcf70878896ea83b0b8bce0795d97fd), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/use-image@2.0.7-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.0.33 ### Patch Changes diff --git a/packages/components/avatar/package.json b/packages/components/avatar/package.json index 5d6ab35353..eb36220b2d 100644 --- a/packages/components/avatar/package.json +++ b/packages/components/avatar/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/avatar", - "version": "2.0.33", + "version": "2.1.0-beta.10", "description": "The Avatar component is used to represent a user, and displays the profile picture, initials or fallback icon.", "keywords": [ "avatar" @@ -34,18 +34,18 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", - "@nextui-org/theme": ">=2.1.0", - "@nextui-org/system": ">=2.0.0" + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "@nextui-org/system": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/shared-utils": "workspace:*", "@nextui-org/react-utils": "workspace:*", "@nextui-org/use-image": "workspace:*", - "@react-aria/interactions": "3.22.2", - "@react-aria/focus": "3.18.2", - "@react-aria/utils": "3.25.2" + "@react-aria/interactions": "3.22.4", + "@react-aria/focus": "3.18.4", + "@react-aria/utils": "3.25.3" }, "devDependencies": { "@nextui-org/theme": "workspace:*", diff --git a/packages/components/badge/CHANGELOG.md b/packages/components/badge/CHANGELOG.md index 45f2dbcc25..f03bcd164f 100644 --- a/packages/components/badge/CHANGELOG.md +++ b/packages/components/badge/CHANGELOG.md @@ -1,5 +1,87 @@ # @nextui-org/badge +## 2.1.0-beta.7 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.5 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.0.32 ### Patch Changes diff --git a/packages/components/badge/package.json b/packages/components/badge/package.json index 3645386db4..c860ef5d35 100644 --- a/packages/components/badge/package.json +++ b/packages/components/badge/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/badge", - "version": "2.0.32", + "version": "2.1.0-beta.7", "description": "Badges are used as a small numerical value or status descriptor for UI elements.", "keywords": [ "badge" @@ -34,10 +34,10 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", - "@nextui-org/theme": ">=2.1.0", - "@nextui-org/system": ">=2.0.0" + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "@nextui-org/system": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/shared-utils": "workspace:*", diff --git a/packages/components/breadcrumbs/CHANGELOG.md b/packages/components/breadcrumbs/CHANGELOG.md index 0e1c5a4b7f..8574fcb311 100644 --- a/packages/components/breadcrumbs/CHANGELOG.md +++ b/packages/components/breadcrumbs/CHANGELOG.md @@ -1,5 +1,100 @@ # @nextui-org/breadcrumbs +## 2.1.0-beta.8 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-icons@2.0.10-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.7 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-icons@2.0.10-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-icons@2.0.10-beta.4 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.5 + +### Patch Changes + +- Updated dependencies [[`0f55c491b`](https://github.com/nextui-org/nextui/commit/0f55c491b73da8944f9b38f2ad7486d1b89f8b7a)]: + - @nextui-org/shared-icons@2.0.10-beta.3 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-icons@2.0.10-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-icons@2.0.10-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-icons@2.0.10-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.0.13 ### Patch Changes diff --git a/packages/components/breadcrumbs/package.json b/packages/components/breadcrumbs/package.json index 4317644457..25a77a69f9 100644 --- a/packages/components/breadcrumbs/package.json +++ b/packages/components/breadcrumbs/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/breadcrumbs", - "version": "2.0.13", + "version": "2.1.0-beta.8", "description": "Breadcrumbs display a hierarchy of links to the current page or resource in an application.", "keywords": [ "breadcrumbs" @@ -34,20 +34,20 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", - "@nextui-org/theme": ">=2.1.0", - "@nextui-org/system": ">=2.0.0" + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "@nextui-org/system": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/react-utils": "workspace:*", "@nextui-org/shared-utils": "workspace:*", "@nextui-org/shared-icons": "workspace:*", - "@react-aria/focus": "3.18.2", - "@react-aria/breadcrumbs": "3.5.16", - "@react-aria/utils": "3.25.2", - "@react-types/breadcrumbs": "3.7.7", - "@react-types/shared": "3.24.1" + "@react-aria/focus": "3.18.4", + "@react-aria/breadcrumbs": "3.5.18", + "@react-aria/utils": "3.25.3", + "@react-types/breadcrumbs": "3.7.8", + "@react-types/shared": "3.25.0" }, "devDependencies": { "@nextui-org/theme": "workspace:*", diff --git a/packages/components/button/CHANGELOG.md b/packages/components/button/CHANGELOG.md index 5c718bdea7..c2671bf658 100644 --- a/packages/components/button/CHANGELOG.md +++ b/packages/components/button/CHANGELOG.md @@ -1,5 +1,112 @@ # @nextui-org/button +## 2.1.0-beta.7 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/ripple@2.1.0-beta.7 + - @nextui-org/spinner@2.1.0-beta.7 + - @nextui-org/use-aria-button@2.1.0-beta.6 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/ripple@2.1.0-beta.6 + - @nextui-org/spinner@2.1.0-beta.6 + - @nextui-org/use-aria-button@2.1.0-beta.5 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.5 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/ripple@2.1.0-beta.5 + - @nextui-org/spinner@2.1.0-beta.5 + - @nextui-org/use-aria-button@2.1.0-beta.4 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/ripple@2.1.0-beta.4 + - @nextui-org/spinner@2.1.0-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/ripple@2.1.0-beta.3 + - @nextui-org/spinner@2.1.0-beta.3 + - @nextui-org/use-aria-button@2.1.0-beta.3 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/ripple@2.1.0-beta.2 + - @nextui-org/spinner@2.1.0-beta.2 + - @nextui-org/use-aria-button@2.1.0-beta.2 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/ripple@2.1.0-beta.1 + - @nextui-org/spinner@2.1.0-beta.1 + - @nextui-org/use-aria-button@2.1.0-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- [#3523](https://github.com/nextui-org/nextui/pull/3523) [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb) Thanks [@wingkwong](https://github.com/wingkwong)! - update `framer-motion` versions + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/ripple@2.1.0-beta.0 + - @nextui-org/spinner@2.1.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/use-aria-button@2.1.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.0.38 ### Patch Changes diff --git a/packages/components/button/package.json b/packages/components/button/package.json index 8f93565575..9c487c1e8c 100644 --- a/packages/components/button/package.json +++ b/packages/components/button/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/button", - "version": "2.0.38", + "version": "2.1.0-beta.7", "description": "Buttons allow users to perform actions and choose with a single tap.", "keywords": [ "button" @@ -34,11 +34,11 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", - "framer-motion": ">=11.5.6", - "@nextui-org/theme": ">=2.1.0", - "@nextui-org/system": ">=2.0.0" + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", + "framer-motion": ">=11.5.6 || >=12.0.0-alpha.1", + "@nextui-org/theme": ">=2.3.0-beta.0", + "@nextui-org/system": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/shared-utils": "workspace:*", @@ -46,12 +46,12 @@ "@nextui-org/use-aria-button": "workspace:*", "@nextui-org/ripple": "workspace:*", "@nextui-org/spinner": "workspace:*", - "@react-aria/button": "3.9.8", - "@react-aria/interactions": "3.22.2", - "@react-aria/utils": "3.25.2", - "@react-aria/focus": "3.18.2", - "@react-types/shared": "3.24.1", - "@react-types/button": "3.9.6" + "@react-aria/button": "3.10.1", + "@react-aria/interactions": "3.22.4", + "@react-aria/utils": "3.25.3", + "@react-aria/focus": "3.18.4", + "@react-types/shared": "3.25.0", + "@react-types/button": "3.10.0" }, "devDependencies": { "@nextui-org/theme": "workspace:*", diff --git a/packages/components/calendar/CHANGELOG.md b/packages/components/calendar/CHANGELOG.md index 811a0ac4c6..0d0b485d29 100644 --- a/packages/components/calendar/CHANGELOG.md +++ b/packages/components/calendar/CHANGELOG.md @@ -1,5 +1,158 @@ # @nextui-org/calendar +## 2.1.0-beta.10 + +### Patch Changes + +- [#4140](https://github.com/nextui-org/nextui/pull/4140) [`78a99b628`](https://github.com/nextui-org/nextui/commit/78a99b628e3fde8808a0cce3c69059d727afd49b) Thanks [@wingkwong](https://github.com/wingkwong)! - add missing `framer-motion` in `peerDependencies` + +- Updated dependencies []: + - @nextui-org/button@2.1.0-beta.7 + +## 2.1.0-beta.9 + +### Patch Changes + +- Updated dependencies []: + - @nextui-org/button@2.1.0-beta.7 + - @nextui-org/framer-utils@2.0.26-beta.8 + +## 2.1.0-beta.8 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/button@2.1.0-beta.7 + - @nextui-org/use-aria-button@2.1.0-beta.6 + - @nextui-org/dom-animation@2.0.1-beta.6 + - @nextui-org/framer-utils@2.0.26-beta.7 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-icons@2.0.10-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.7 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/button@2.1.0-beta.6 + - @nextui-org/use-aria-button@2.1.0-beta.5 + - @nextui-org/dom-animation@2.0.1-beta.5 + - @nextui-org/framer-utils@2.0.26-beta.6 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-icons@2.0.10-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/button@2.1.0-beta.5 + - @nextui-org/use-aria-button@2.1.0-beta.4 + - @nextui-org/dom-animation@2.0.1-beta.4 + - @nextui-org/framer-utils@2.0.26-beta.5 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-icons@2.0.10-beta.4 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.5 + +### Patch Changes + +- Updated dependencies [[`0f55c491b`](https://github.com/nextui-org/nextui/commit/0f55c491b73da8944f9b38f2ad7486d1b89f8b7a)]: + - @nextui-org/shared-icons@2.0.10-beta.3 + - @nextui-org/button@2.1.0-beta.4 + +## 2.1.0-beta.4 + +### Patch Changes + +- [#4039](https://github.com/nextui-org/nextui/pull/4039) [`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7) Thanks [@wingkwong](https://github.com/wingkwong)! - support inert value with boolean type for react 19 (#4038) + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/button@2.1.0-beta.4 + - @nextui-org/framer-utils@2.0.26-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/button@2.1.0-beta.3 + - @nextui-org/use-aria-button@2.1.0-beta.3 + - @nextui-org/dom-animation@2.0.1-beta.3 + - @nextui-org/framer-utils@2.0.26-beta.3 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-icons@2.0.10-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/button@2.1.0-beta.2 + - @nextui-org/use-aria-button@2.1.0-beta.2 + - @nextui-org/dom-animation@2.0.1-beta.2 + - @nextui-org/framer-utils@2.0.26-beta.2 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-icons@2.0.10-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/button@2.1.0-beta.1 + - @nextui-org/use-aria-button@2.1.0-beta.1 + - @nextui-org/dom-animation@2.0.1-beta.1 + - @nextui-org/framer-utils@2.0.26-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-icons@2.0.10-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- [#3302](https://github.com/nextui-org/nextui/pull/3302) [`a4a1d8fb6`](https://github.com/nextui-org/nextui/commit/a4a1d8fb69dd7f496a179a66af072f72aae0ec17) Thanks [@ryo-manba](https://github.com/ryo-manba)! - Add month and year picker to DateRangePicker and RangeCalendar (#3089, #3090) + +- [#3523](https://github.com/nextui-org/nextui/pull/3523) [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb) Thanks [@wingkwong](https://github.com/wingkwong)! - replaced lodash with native approaches + +- [#3523](https://github.com/nextui-org/nextui/pull/3523) [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb) Thanks [@wingkwong](https://github.com/wingkwong)! - framer motion optimization (#3340) + +- [#3523](https://github.com/nextui-org/nextui/pull/3523) [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb) Thanks [@wingkwong](https://github.com/wingkwong)! - update `framer-motion` versions + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/button@2.1.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/use-aria-button@2.1.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/dom-animation@2.0.1-beta.0 + - @nextui-org/framer-utils@2.0.26-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.0.12 ### Patch Changes diff --git a/packages/components/calendar/package.json b/packages/components/calendar/package.json index 0272d267f0..367c0a0aec 100644 --- a/packages/components/calendar/package.json +++ b/packages/components/calendar/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/calendar", - "version": "2.0.12", + "version": "2.1.0-beta.10", "description": "A calendar displays one or more date grids and allows users to select a single date.", "keywords": [ "calendar" @@ -34,10 +34,11 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "@nextui-org/system": ">=2.1.0", - "@nextui-org/theme": ">=2.2.0", - "react": ">=18", - "react-dom": ">=18" + "@nextui-org/system": ">=2.3.0-beta.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "framer-motion": ">=11.5.6 || >=12.0.0-alpha.1", + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0" }, "dependencies": { "@nextui-org/react-utils": "workspace:*", @@ -47,18 +48,18 @@ "@nextui-org/use-aria-button": "workspace:*", "@nextui-org/button": "workspace:*", "@nextui-org/dom-animation": "workspace:*", - "@internationalized/date": "3.5.5", - "@react-aria/calendar": "3.5.11", - "@react-aria/focus": "3.18.2", - "@react-aria/i18n": "3.12.2", - "@react-stately/calendar": "3.5.4", - "@react-types/button": "3.9.6", - "@react-aria/visually-hidden": "3.8.15", - "@react-aria/utils": "3.25.2", - "@react-stately/utils": "3.10.3", - "@react-types/calendar": "3.4.9", - "@react-aria/interactions": "3.22.2", - "@react-types/shared": "3.24.1", + "@internationalized/date": "3.5.6", + "@react-aria/calendar": "3.5.13", + "@react-aria/focus": "3.18.4", + "@react-aria/i18n": "3.12.3", + "@react-stately/calendar": "3.5.5", + "@react-types/button": "3.10.0", + "@react-aria/visually-hidden": "3.8.17", + "@react-aria/utils": "3.25.3", + "@react-stately/utils": "3.10.4", + "@react-types/calendar": "3.4.10", + "@react-aria/interactions": "3.22.4", + "@react-types/shared": "3.25.0", "scroll-into-view-if-needed": "3.0.10", "@types/lodash.debounce": "^4.0.7" }, @@ -73,4 +74,4 @@ "react-dom": "^18.0.0" }, "clean-package": "../../../clean-package.config.json" -} \ No newline at end of file +} diff --git a/packages/components/calendar/src/calendar-month.tsx b/packages/components/calendar/src/calendar-month.tsx index e17fca20d9..8972f10bd6 100644 --- a/packages/components/calendar/src/calendar-month.tsx +++ b/packages/components/calendar/src/calendar-month.tsx @@ -4,7 +4,7 @@ import {HTMLNextUIProps} from "@nextui-org/system"; import {useLocale} from "@react-aria/i18n"; import {useCalendarGrid} from "@react-aria/calendar"; import {m} from "framer-motion"; -import {dataAttr} from "@nextui-org/shared-utils"; +import {dataAttr, getInertValue} from "@nextui-org/shared-utils"; import {CalendarCell} from "./calendar-cell"; import {slideVariants} from "./calendar-transitions"; @@ -40,9 +40,8 @@ export function CalendarMonth(props: CalendarMonthProps) { className={slots?.gridBodyRow({class: classNames?.gridBodyRow})} data-slot="grid-body-row" // makes the browser ignore the element and its children when tabbing - // TODO: invert inert when switching to React 19 (ref: https://github.com/facebook/react/issues/17157) // @ts-ignore - inert={isHeaderExpanded ? "" : undefined} + inert={getInertValue(!!isHeaderExpanded)} > {state .getDatesInWeek(weekIndex, startDate) diff --git a/packages/components/calendar/src/calendar-picker.tsx b/packages/components/calendar/src/calendar-picker.tsx index 76e4cf07e5..c75194aa2a 100644 --- a/packages/components/calendar/src/calendar-picker.tsx +++ b/packages/components/calendar/src/calendar-picker.tsx @@ -2,6 +2,7 @@ import type {CalendarPickerProps} from "./use-calendar-picker"; import {HTMLNextUIProps} from "@nextui-org/system"; import {useCallback} from "react"; +import {getInertValue} from "@nextui-org/shared-utils"; import {CalendarPickerItem} from "./calendar-picker-item"; import {useCalendarPicker} from "./use-calendar-picker"; @@ -66,9 +67,8 @@ export function CalendarPicker(props: CalendarPickerProps) { })} data-slot="picker-wrapper" // makes the browser ignore the element and its children when tabbing - // TODO: invert inert when switching to React 19 (ref: https://github.com/facebook/react/issues/17157) // @ts-ignore - inert={isHeaderExpanded ? undefined : ""} + inert={getInertValue(!isHeaderExpanded)} >
; @@ -241,7 +247,6 @@ const CalendarWidthTemplate = (args: CalendarProps) => { return (
-

calendarWidth: 300

calendarWidth: 300

@@ -257,6 +262,31 @@ const CalendarWidthTemplate = (args: CalendarProps) => { ); }; +const ReducedMotionTemplate = (args: CalendarProps) => { + return ( +
+
+

reducedMotion: never

+ + + +
+
+

reducedMotion: always

+ + + +
+
+

reducedMotion: user

+ + + +
+
+ ); +}; + export const Default = { render: Template, args: { @@ -375,3 +405,10 @@ export const CalendarWidth = { ...defaultProps, }, }; + +export const ReducedMotion = { + render: ReducedMotionTemplate, + args: { + ...defaultProps, + }, +}; diff --git a/packages/components/card/CHANGELOG.md b/packages/components/card/CHANGELOG.md index b6adfab24a..809c654891 100644 --- a/packages/components/card/CHANGELOG.md +++ b/packages/components/card/CHANGELOG.md @@ -1,5 +1,104 @@ # @nextui-org/card +## 2.1.0-beta.7 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/ripple@2.1.0-beta.7 + - @nextui-org/use-aria-button@2.1.0-beta.6 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/ripple@2.1.0-beta.6 + - @nextui-org/use-aria-button@2.1.0-beta.5 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.5 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/ripple@2.1.0-beta.5 + - @nextui-org/use-aria-button@2.1.0-beta.4 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/ripple@2.1.0-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/ripple@2.1.0-beta.3 + - @nextui-org/use-aria-button@2.1.0-beta.3 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/ripple@2.1.0-beta.2 + - @nextui-org/use-aria-button@2.1.0-beta.2 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/ripple@2.1.0-beta.1 + - @nextui-org/use-aria-button@2.1.0-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- [#3523](https://github.com/nextui-org/nextui/pull/3523) [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb) Thanks [@wingkwong](https://github.com/wingkwong)! - update `framer-motion` versions + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/ripple@2.1.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/use-aria-button@2.1.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.0.34 ### Patch Changes diff --git a/packages/components/card/package.json b/packages/components/card/package.json index 2059b040da..af650bf57c 100644 --- a/packages/components/card/package.json +++ b/packages/components/card/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/card", - "version": "2.0.34", + "version": "2.1.0-beta.7", "description": "Card is a container for text, photos, and actions in the context of a single subject.", "keywords": [ "card" @@ -34,22 +34,22 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", - "framer-motion": ">=11.5.6", - "@nextui-org/theme": ">=2.1.0", - "@nextui-org/system": ">=2.0.0" + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", + "framer-motion": ">=11.5.6 || >=12.0.0-alpha.1", + "@nextui-org/theme": ">=2.3.0-beta.0", + "@nextui-org/system": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/shared-utils": "workspace:*", "@nextui-org/react-utils": "workspace:*", "@nextui-org/use-aria-button": "workspace:*", "@nextui-org/ripple": "workspace:*", - "@react-aria/focus": "3.18.2", - "@react-aria/utils": "3.25.2", - "@react-aria/interactions": "3.22.2", - "@react-aria/button": "3.9.8", - "@react-types/shared": "3.24.1" + "@react-aria/focus": "3.18.4", + "@react-aria/utils": "3.25.3", + "@react-aria/interactions": "3.22.4", + "@react-aria/button": "3.10.1", + "@react-types/shared": "3.25.0" }, "devDependencies": { "@nextui-org/theme": "workspace:*", diff --git a/packages/components/checkbox/CHANGELOG.md b/packages/components/checkbox/CHANGELOG.md index 6366e36876..ddf0eea2df 100644 --- a/packages/components/checkbox/CHANGELOG.md +++ b/packages/components/checkbox/CHANGELOG.md @@ -1,5 +1,97 @@ # @nextui-org/checkbox +## 2.2.0-beta.7 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/use-callback-ref@2.0.7-beta.4 + - @nextui-org/use-safe-layout-effect@2.0.7-beta.4 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.2.0-beta.6 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/use-callback-ref@2.0.7-beta.3 + - @nextui-org/use-safe-layout-effect@2.0.7-beta.3 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.2.0-beta.5 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/use-callback-ref@2.0.7-beta.2 + - @nextui-org/use-safe-layout-effect@2.0.7-beta.2 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.2.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.2.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/use-callback-ref@2.0.7-beta.1 + - @nextui-org/use-safe-layout-effect@2.0.7-beta.1 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.2.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/use-callback-ref@2.0.7-beta.0 + - @nextui-org/use-safe-layout-effect@2.0.7-beta.0 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.2.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.2.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.1.5 ### Patch Changes diff --git a/packages/components/checkbox/__tests__/checkbox-group.test.tsx b/packages/components/checkbox/__tests__/checkbox-group.test.tsx index 7245ca6b2b..9e604b410b 100644 --- a/packages/components/checkbox/__tests__/checkbox-group.test.tsx +++ b/packages/components/checkbox/__tests__/checkbox-group.test.tsx @@ -1,5 +1,6 @@ import * as React from "react"; import {act, render} from "@testing-library/react"; +import {Form} from "@nextui-org/form"; import userEvent, {UserEvent} from "@testing-library/user-event"; import {CheckboxGroup, Checkbox} from "../src"; @@ -281,6 +282,60 @@ describe("Checkbox.Group", () => { expect(input.validity.valid).toBe(true); } }); + + it("supports server validation", async () => { + function Test() { + const [serverErrors, setServerErrors] = React.useState({}); + const onSubmit = (e) => { + e.preventDefault(); + setServerErrors({ + terms: "You must accept the terms.", + }); + }; + + return ( +
+ + Terms and conditions + Cookies + Privacy policy + + +
+ ); + } + + const {getAllByRole, getByRole} = render(); + + const group = getByRole("group"); + + expect(group).not.toHaveAttribute("aria-describedby"); + const button = getByRole("button"); + + expect(button).toBeVisible(); + await user.click(button); + + expect(group).toHaveAttribute("aria-describedby"); + expect(document.getElementById(group.getAttribute("aria-describedby")!)).toHaveTextContent( + "You must accept the terms.", + ); + + const checkboxes = getAllByRole("checkbox") as HTMLInputElement[]; + + for (let input of checkboxes) { + expect(input.validity.valid).toBe(false); + } + + await user.click(checkboxes[0]); + expect(group).not.toHaveAttribute("aria-describedby"); + for (let input of checkboxes) { + expect(input.validity.valid).toBe(true); + } + }); }); describe("validationBehavior=aria", () => { @@ -320,6 +375,35 @@ describe("Checkbox.Group", () => { await user.click(checkboxes[2]); expect(group).toHaveAttribute("aria-describedby"); }); + + it("supports server validation", async () => { + const {getAllByRole, getByRole} = render( +
+ + Terms and conditions + Cookies + Privacy policy + +
, + ); + + const group = getByRole("group"); + + expect(group).toHaveAttribute("aria-describedby"); + expect(document.getElementById(group.getAttribute("aria-describedby")!)).toHaveTextContent( + "You must accept the terms", + ); + + const checkboxes = getAllByRole("checkbox"); + + for (let input of checkboxes) { + expect(input).toHaveAttribute("aria-invalid", "true"); + } + + // TODO: Fix the following functions to work + // await user.click(checkboxes[0]); + // expect(group).not.toHaveAttribute("aria-describedby"); + }); }); }); }); diff --git a/packages/components/checkbox/package.json b/packages/components/checkbox/package.json index e25432c6a1..a773e164d5 100644 --- a/packages/components/checkbox/package.json +++ b/packages/components/checkbox/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/checkbox", - "version": "2.1.5", + "version": "2.2.0-beta.7", "description": "Checkboxes allow users to select multiple items from a list of individual items, or to mark one individual item as selected.", "keywords": [ "checkbox" @@ -34,25 +34,26 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "@nextui-org/system": ">=2.0.0", - "@nextui-org/theme": ">=2.1.0", - "react": ">=18", - "react-dom": ">=18" + "@nextui-org/system": ">=2.3.0-beta.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0" }, "dependencies": { + "@nextui-org/form": "workspace:*", "@nextui-org/react-utils": "workspace:*", "@nextui-org/shared-utils": "workspace:*", "@nextui-org/use-callback-ref": "workspace:*", "@nextui-org/use-safe-layout-effect": "workspace:*", - "@react-aria/checkbox": "3.14.6", - "@react-aria/focus": "3.18.2", - "@react-aria/interactions": "3.22.2", - "@react-aria/utils": "3.25.2", - "@react-aria/visually-hidden": "3.8.15", - "@react-stately/checkbox": "3.6.8", - "@react-stately/toggle": "3.7.7", - "@react-types/checkbox": "3.8.3", - "@react-types/shared": "3.24.1" + "@react-aria/checkbox": "3.14.8", + "@react-aria/focus": "3.18.4", + "@react-aria/interactions": "3.22.4", + "@react-aria/utils": "3.25.3", + "@react-aria/visually-hidden": "3.8.17", + "@react-stately/checkbox": "3.6.9", + "@react-stately/toggle": "3.7.8", + "@react-types/checkbox": "3.8.4", + "@react-types/shared": "3.25.0" }, "devDependencies": { "@nextui-org/chip": "workspace:*", @@ -67,4 +68,4 @@ "react-hook-form": "^7.51.3" }, "clean-package": "../../../clean-package.config.json" -} \ No newline at end of file +} diff --git a/packages/components/checkbox/src/checkbox-group.tsx b/packages/components/checkbox/src/checkbox-group.tsx index 5f4aec3dbd..33ca09d4c0 100644 --- a/packages/components/checkbox/src/checkbox-group.tsx +++ b/packages/components/checkbox/src/checkbox-group.tsx @@ -1,5 +1,4 @@ import {forwardRef} from "@nextui-org/system"; -import {useMemo} from "react"; import {CheckboxGroupProvider} from "./checkbox-group-context"; import {UseCheckboxGroupProps, useCheckboxGroup} from "./use-checkbox-group"; @@ -21,16 +20,14 @@ const CheckboxGroup = forwardRef<"div", CheckboxGroupProps>((props, ref) => { getErrorMessageProps, } = useCheckboxGroup({...props, ref}); - const errorMessageContent = useMemo(() => errorMessage, [isInvalid]); - return (
{label && {label}}
{children}
- {isInvalid && errorMessageContent ? ( -
{errorMessageContent}
+ {isInvalid && errorMessage ? ( +
{errorMessage}
) : description ? (
{description}
) : null} diff --git a/packages/components/checkbox/src/use-checkbox-group.ts b/packages/components/checkbox/src/use-checkbox-group.ts index ee7eaba973..f0ca24e562 100644 --- a/packages/components/checkbox/src/use-checkbox-group.ts +++ b/packages/components/checkbox/src/use-checkbox-group.ts @@ -2,7 +2,6 @@ import type {CheckboxGroupSlots, SlotsToClasses} from "@nextui-org/theme"; import type {AriaCheckboxGroupProps} from "@react-types/checkbox"; import type {Orientation} from "@react-types/shared"; import type {ReactRef} from "@nextui-org/react-utils"; -import type {CheckboxGroupProps} from "@react-types/checkbox"; import type {HTMLNextUIProps, PropGetter} from "@nextui-org/system"; import {useProviderContext} from "@nextui-org/system"; @@ -13,6 +12,7 @@ import {useCheckboxGroup as useReactAriaCheckboxGroup} from "@react-aria/checkbo import {CheckboxGroupState, useCheckboxGroupState} from "@react-stately/checkbox"; import {filterDOMProps, useDOMRef} from "@nextui-org/react-utils"; import {clsx, safeAriaLabel} from "@nextui-org/shared-utils"; +import {FormContext, useSlottedContext} from "@nextui-org/form"; import {CheckboxProps} from "./index"; @@ -71,6 +71,7 @@ export type ContextType = { export function useCheckboxGroup(props: UseCheckboxGroupProps) { const globalContext = useProviderContext(); + const {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {}; const { as, @@ -89,7 +90,7 @@ export function useCheckboxGroup(props: UseCheckboxGroupProps) { orientation = "vertical", lineThrough = false, isDisabled = false, - validationBehavior = globalContext?.validationBehavior ?? "aria", + validationBehavior = formValidationBehavior ?? globalContext?.validationBehavior ?? "aria", disableAnimation = globalContext?.disableAnimation ?? false, isReadOnly, isRequired, @@ -105,7 +106,7 @@ export function useCheckboxGroup(props: UseCheckboxGroupProps) { const domRef = useDOMRef(ref); - const checkboxGroupProps = useMemo(() => { + const checkboxGroupProps = useMemo(() => { return { ...otherProps, value, @@ -136,7 +137,6 @@ export function useCheckboxGroup(props: UseCheckboxGroupProps) { ]); const groupState = useCheckboxGroupState(checkboxGroupProps); - const { labelProps, groupProps, diff --git a/packages/components/checkbox/src/use-checkbox.ts b/packages/components/checkbox/src/use-checkbox.ts index 841b93eab6..f9f4baec20 100644 --- a/packages/components/checkbox/src/use-checkbox.ts +++ b/packages/components/checkbox/src/use-checkbox.ts @@ -18,6 +18,7 @@ import { } from "@react-aria/checkbox"; import {useSafeLayoutEffect} from "@nextui-org/use-safe-layout-effect"; import {mergeRefs} from "@nextui-org/react-utils"; +import {FormContext, useSlottedContext} from "@nextui-org/form"; import {useCheckboxGroupContext} from "./checkbox-group-context"; @@ -75,6 +76,7 @@ export type UseCheckboxProps = Omit & export function useCheckbox(props: UseCheckboxProps = {}) { const globalContext = useProviderContext(); const groupContext = useCheckboxGroupContext(); + const {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {}; const isInGroup = !!groupContext; const { @@ -97,7 +99,9 @@ export function useCheckbox(props: UseCheckboxProps = {}) { validationState, isInvalid = validationState ? validationState === "invalid" : groupContext?.isInvalid ?? false, isIndeterminate = false, - validationBehavior = groupContext?.validationBehavior ?? "aria", + validationBehavior = isInGroup + ? groupContext.validationBehavior + : formValidationBehavior ?? globalContext?.validationBehavior ?? "aria", defaultSelected, classNames, className, diff --git a/packages/components/checkbox/stories/checkbox-group.stories.tsx b/packages/components/checkbox/stories/checkbox-group.stories.tsx index 34ad88f04b..6182918020 100644 --- a/packages/components/checkbox/stories/checkbox-group.stories.tsx +++ b/packages/components/checkbox/stories/checkbox-group.stories.tsx @@ -4,6 +4,7 @@ import React from "react"; import {Meta} from "@storybook/react"; import {checkbox} from "@nextui-org/theme"; import {button} from "@nextui-org/theme"; +import {Form} from "@nextui-org/form"; import {CheckboxGroup, Checkbox, CheckboxGroupProps} from "../src"; @@ -90,7 +91,7 @@ const InvalidTemplate = (args: CheckboxGroupProps) => { const FormTemplate = (args: CheckboxGroupProps) => { return (
{ const formData = new FormData(e.currentTarget); const selectedCities = formData.getAll("favorite-cities"); @@ -135,6 +136,40 @@ const ControlledTemplate = (args: CheckboxGroupProps) => { ); }; +const ServerValidationTemplate = (args: CheckboxGroupProps) => { + const [serverErrors, setServerErrors] = React.useState({}); + + const onSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + + setServerErrors({ + terms: "Please select a valid animal.", + }); + }; + + return ( + + + Terms and conditions + Cookies + Privacy policy + + + + ); +}; + export const Default = { render: Template, @@ -253,6 +288,14 @@ export const WithValidation = { }, }; +export const WithServerValidation = { + render: ServerValidationTemplate, + + args: { + ...defaultProps, + }, +}; + export const DisableAnimation = { render: Template, diff --git a/packages/components/checkbox/stories/checkbox.stories.tsx b/packages/components/checkbox/stories/checkbox.stories.tsx index aa60c33c0d..f4982f19d1 100644 --- a/packages/components/checkbox/stories/checkbox.stories.tsx +++ b/packages/components/checkbox/stories/checkbox.stories.tsx @@ -75,7 +75,7 @@ const ControlledTemplate = (args: CheckboxProps) => { const FormTemplate = (args: CheckboxProps) => { return (
{ e.preventDefault(); const checkbox = e.target["check"] as HTMLInputElement; diff --git a/packages/components/chip/CHANGELOG.md b/packages/components/chip/CHANGELOG.md index 0baf5a900d..82d3d58dee 100644 --- a/packages/components/chip/CHANGELOG.md +++ b/packages/components/chip/CHANGELOG.md @@ -1,5 +1,100 @@ # @nextui-org/chip +## 2.1.0-beta.8 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-icons@2.0.10-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.7 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-icons@2.0.10-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-icons@2.0.10-beta.4 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.5 + +### Patch Changes + +- Updated dependencies [[`0f55c491b`](https://github.com/nextui-org/nextui/commit/0f55c491b73da8944f9b38f2ad7486d1b89f8b7a)]: + - @nextui-org/shared-icons@2.0.10-beta.3 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-icons@2.0.10-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-icons@2.0.10-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-icons@2.0.10-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.0.33 ### Patch Changes diff --git a/packages/components/chip/package.json b/packages/components/chip/package.json index ff778d80bf..4eed845165 100644 --- a/packages/components/chip/package.json +++ b/packages/components/chip/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/chip", - "version": "2.0.33", + "version": "2.1.0-beta.8", "description": "Chips help people enter information, make selections, filter content, or trigger actions.", "keywords": [ "chip" @@ -34,19 +34,19 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", - "@nextui-org/theme": ">=2.1.0", - "@nextui-org/system": ">=2.0.0" + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "@nextui-org/system": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/shared-icons": "workspace:*", "@nextui-org/shared-utils": "workspace:*", "@nextui-org/react-utils": "workspace:*", - "@react-aria/focus": "3.18.2", - "@react-aria/interactions": "3.22.2", - "@react-aria/utils": "3.25.2", - "@react-types/checkbox": "3.8.3" + "@react-aria/focus": "3.18.4", + "@react-aria/interactions": "3.22.4", + "@react-aria/utils": "3.25.3", + "@react-types/checkbox": "3.8.4" }, "devDependencies": { "@nextui-org/theme": "workspace:*", diff --git a/packages/components/code/CHANGELOG.md b/packages/components/code/CHANGELOG.md index c824086f20..327c9a3ecd 100644 --- a/packages/components/code/CHANGELOG.md +++ b/packages/components/code/CHANGELOG.md @@ -1,5 +1,94 @@ # @nextui-org/code +## 2.1.0-beta.7 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/system-rsc@2.2.0-beta.6 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/system-rsc@2.2.0-beta.5 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.5 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/system-rsc@2.2.0-beta.4 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/system-rsc@2.2.0-beta.3 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/system-rsc@2.2.0-beta.3 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/system-rsc@2.2.0-beta.2 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/system-rsc@2.2.0-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/system-rsc@2.2.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.0.33 ### Patch Changes diff --git a/packages/components/code/package.json b/packages/components/code/package.json index 811b747c31..4d3e21159f 100644 --- a/packages/components/code/package.json +++ b/packages/components/code/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/code", - "version": "2.0.33", + "version": "2.1.0-beta.7", "description": "Code is a component used to display inline code.", "keywords": [ "code" @@ -34,9 +34,9 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", - "@nextui-org/theme": ">=2.1.0" + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", + "@nextui-org/theme": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/system-rsc": "workspace:*", diff --git a/packages/components/date-input/CHANGELOG.md b/packages/components/date-input/CHANGELOG.md index d2f016b586..b2039fc571 100644 --- a/packages/components/date-input/CHANGELOG.md +++ b/packages/components/date-input/CHANGELOG.md @@ -1,5 +1,87 @@ # @nextui-org/date-input +## 2.2.0-beta.7 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.2.0-beta.6 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.2.0-beta.5 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.2.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.2.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.2.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.2.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.2.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.1.4 ### Patch Changes diff --git a/packages/components/date-input/package.json b/packages/components/date-input/package.json index a306aa8f57..45acdbac96 100644 --- a/packages/components/date-input/package.json +++ b/packages/components/date-input/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/date-input", - "version": "2.1.4", + "version": "2.2.0-beta.7", "description": "A date input allows users to enter and edit date and time values using a keyboard.", "keywords": [ "date-field" @@ -34,21 +34,22 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "@nextui-org/system": ">=2.1.0", - "@nextui-org/theme": ">=2.2.0", - "react": ">=18", - "react-dom": ">=18" + "@nextui-org/system": ">=2.3.0-beta.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0" }, "dependencies": { + "@nextui-org/form": "workspace:*", "@nextui-org/react-utils": "workspace:*", "@nextui-org/shared-utils": "workspace:*", - "@internationalized/date": "3.5.5", - "@react-aria/datepicker": "3.11.2", - "@react-aria/i18n": "3.12.2", - "@react-stately/datepicker": "3.10.2", - "@react-types/datepicker": "3.8.2", - "@react-types/shared": "3.24.1", - "@react-aria/utils": "3.25.2" + "@internationalized/date": "3.5.6", + "@react-aria/datepicker": "3.11.4", + "@react-aria/i18n": "3.12.3", + "@react-stately/datepicker": "3.10.3", + "@react-types/datepicker": "3.8.3", + "@react-types/shared": "3.25.0", + "@react-aria/utils": "3.25.3" }, "devDependencies": { "@nextui-org/system": "workspace:*", @@ -60,4 +61,4 @@ "react-dom": "^18.0.0" }, "clean-package": "../../../clean-package.config.json" -} \ No newline at end of file +} diff --git a/packages/components/date-input/src/use-date-input.ts b/packages/components/date-input/src/use-date-input.ts index a13f64022f..0f88927714 100644 --- a/packages/components/date-input/src/use-date-input.ts +++ b/packages/components/date-input/src/use-date-input.ts @@ -18,6 +18,7 @@ import {useDateFieldState} from "@react-stately/datepicker"; import {objectToDeps, clsx, dataAttr, getGregorianYearOffset} from "@nextui-org/shared-utils"; import {dateInput, cn} from "@nextui-org/theme"; import {useMemo} from "react"; +import {FormContext, useSlottedContext} from "@nextui-org/form"; type NextUIBaseProps = Omit< HTMLNextUIProps<"div">, @@ -115,6 +116,7 @@ export type UseDateInputProps = Props & export function useDateInput(originalProps: UseDateInputProps) { const globalContext = useProviderContext(); + const {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {}; const [props, variantProps] = mapPropsVariants(originalProps, dateInput.variantKeys); @@ -144,7 +146,7 @@ export function useDateInput(originalProps: UseDateInputPro innerWrapperProps: innerWrapperPropsProp, errorMessageProps: errorMessagePropsProp, descriptionProps: descriptionPropsProp, - validationBehavior = globalContext?.validationBehavior ?? "aria", + validationBehavior = formValidationBehavior ?? globalContext?.validationBehavior ?? "aria", shouldForceLeadingZeros = true, minValue = globalContext?.defaultDates?.minDate ?? new CalendarDate(calendarProp, 1900 + gregorianYearOffset, 1, 1), diff --git a/packages/components/date-input/src/use-time-input.ts b/packages/components/date-input/src/use-time-input.ts index 042ae11589..7f41ae425f 100644 --- a/packages/components/date-input/src/use-time-input.ts +++ b/packages/components/date-input/src/use-time-input.ts @@ -14,6 +14,7 @@ import {useTimeFieldState} from "@react-stately/datepicker"; import {objectToDeps, clsx, dataAttr} from "@nextui-org/shared-utils"; import {dateInput} from "@nextui-org/theme"; import {useMemo} from "react"; +import {FormContext, useSlottedContext} from "@nextui-org/form"; type NextUIBaseProps = Omit< HTMLNextUIProps<"div">, @@ -74,6 +75,7 @@ export type UseTimeInputProps = Props & export function useTimeInput(originalProps: UseTimeInputProps) { const globalContext = useProviderContext(); + const {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {}; const [props, variantProps] = mapPropsVariants(originalProps, dateInput.variantKeys); @@ -92,7 +94,7 @@ export function useTimeInput(originalProps: UseTimeInputPro fieldProps: fieldPropsProp, errorMessageProps: errorMessagePropsProp, descriptionProps: descriptionPropsProp, - validationBehavior = globalContext?.validationBehavior ?? "aria", + validationBehavior = formValidationBehavior ?? globalContext?.validationBehavior ?? "aria", shouldForceLeadingZeros = true, minValue, maxValue, diff --git a/packages/components/date-picker/CHANGELOG.md b/packages/components/date-picker/CHANGELOG.md index bcc2096ee9..467bbed36b 100644 --- a/packages/components/date-picker/CHANGELOG.md +++ b/packages/components/date-picker/CHANGELOG.md @@ -1,5 +1,178 @@ # @nextui-org/date-picker +## 2.2.0-beta.11 + +### Patch Changes + +- Updated dependencies [[`78a99b628`](https://github.com/nextui-org/nextui/commit/78a99b628e3fde8808a0cce3c69059d727afd49b)]: + - @nextui-org/calendar@2.1.0-beta.10 + - @nextui-org/button@2.1.0-beta.7 + - @nextui-org/date-input@2.2.0-beta.7 + - @nextui-org/popover@2.2.0-beta.9 + +## 2.2.0-beta.10 + +### Patch Changes + +- Updated dependencies []: + - @nextui-org/button@2.1.0-beta.7 + - @nextui-org/calendar@2.1.0-beta.9 + - @nextui-org/date-input@2.2.0-beta.7 + - @nextui-org/popover@2.2.0-beta.9 + - @nextui-org/aria-utils@2.1.0-beta.8 + +## 2.2.0-beta.9 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/button@2.1.0-beta.7 + - @nextui-org/calendar@2.1.0-beta.8 + - @nextui-org/date-input@2.2.0-beta.7 + - @nextui-org/popover@2.2.0-beta.8 + - @nextui-org/aria-utils@2.1.0-beta.7 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-icons@2.0.10-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.2.0-beta.8 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/button@2.1.0-beta.6 + - @nextui-org/calendar@2.1.0-beta.7 + - @nextui-org/date-input@2.2.0-beta.6 + - @nextui-org/popover@2.2.0-beta.7 + - @nextui-org/aria-utils@2.1.0-beta.6 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-icons@2.0.10-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.2.0-beta.7 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/button@2.1.0-beta.5 + - @nextui-org/calendar@2.1.0-beta.6 + - @nextui-org/date-input@2.2.0-beta.5 + - @nextui-org/popover@2.2.0-beta.6 + - @nextui-org/aria-utils@2.1.0-beta.5 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-icons@2.0.10-beta.4 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.2.0-beta.6 + +### Patch Changes + +- Updated dependencies [[`0f55c491b`](https://github.com/nextui-org/nextui/commit/0f55c491b73da8944f9b38f2ad7486d1b89f8b7a)]: + - @nextui-org/shared-icons@2.0.10-beta.3 + - @nextui-org/button@2.1.0-beta.4 + - @nextui-org/calendar@2.1.0-beta.5 + - @nextui-org/date-input@2.2.0-beta.4 + - @nextui-org/popover@2.2.0-beta.5 + +## 2.2.0-beta.5 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/calendar@2.1.0-beta.4 + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/button@2.1.0-beta.4 + - @nextui-org/date-input@2.2.0-beta.4 + - @nextui-org/popover@2.2.0-beta.5 + - @nextui-org/aria-utils@2.1.0-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.2.0-beta.4 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/button@2.1.0-beta.3 + - @nextui-org/calendar@2.1.0-beta.3 + - @nextui-org/date-input@2.2.0-beta.3 + - @nextui-org/popover@2.2.0-beta.4 + - @nextui-org/aria-utils@2.1.0-beta.3 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-icons@2.0.10-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.2.0-beta.3 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/button@2.1.0-beta.2 + - @nextui-org/calendar@2.1.0-beta.2 + - @nextui-org/date-input@2.2.0-beta.2 + - @nextui-org/popover@2.2.0-beta.3 + - @nextui-org/aria-utils@2.1.0-beta.2 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-icons@2.0.10-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.2.0-beta.2 + +### Patch Changes + +- Updated dependencies [[`563c1585a`](https://github.com/nextui-org/nextui/commit/563c1585a3c1a32e8272ec4641cfabeaaac3296c)]: + - @nextui-org/popover@2.2.0-beta.2 + +## 2.2.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/button@2.1.0-beta.1 + - @nextui-org/calendar@2.1.0-beta.1 + - @nextui-org/date-input@2.2.0-beta.1 + - @nextui-org/popover@2.2.0-beta.1 + - @nextui-org/aria-utils@2.1.0-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-icons@2.0.10-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.2.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- [#3773](https://github.com/nextui-org/nextui/pull/3773) [`a4ab02006`](https://github.com/nextui-org/nextui/commit/a4ab02006a63013e1a25c28c182d999e3d7c9eeb) Thanks [@macci001](https://github.com/macci001)! - Fixes getCalendarProps to propagate the classNames in the calendarProps. (#3769) + +- [#3302](https://github.com/nextui-org/nextui/pull/3302) [`a4a1d8fb6`](https://github.com/nextui-org/nextui/commit/a4a1d8fb69dd7f496a179a66af072f72aae0ec17) Thanks [@ryo-manba](https://github.com/ryo-manba)! - Add month and year picker to DateRangePicker and RangeCalendar (#3089, #3090) + +- [#3248](https://github.com/nextui-org/nextui/pull/3248) [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8) Thanks [@ryo-manba](https://github.com/ryo-manba)! - Add support for selectorButtonPlacement property (#3015) + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`a4a1d8fb6`](https://github.com/nextui-org/nextui/commit/a4a1d8fb69dd7f496a179a66af072f72aae0ec17), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`9f6839faf`](https://github.com/nextui-org/nextui/commit/9f6839faf9fe05c766571bcb71028bd3236d6e3a), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/button@2.1.0-beta.0 + - @nextui-org/calendar@2.1.0-beta.0 + - @nextui-org/date-input@2.2.0-beta.0 + - @nextui-org/popover@2.2.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/aria-utils@2.1.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.1.8 ### Patch Changes diff --git a/packages/components/date-picker/__tests__/date-picker.test.tsx b/packages/components/date-picker/__tests__/date-picker.test.tsx index eeb9e5bf33..461aa8be3f 100644 --- a/packages/components/date-picker/__tests__/date-picker.test.tsx +++ b/packages/components/date-picker/__tests__/date-picker.test.tsx @@ -1,10 +1,11 @@ /* eslint-disable jsx-a11y/no-autofocus */ import * as React from "react"; -import {render, act, fireEvent, waitFor} from "@testing-library/react"; +import {render, act, fireEvent, waitFor, within} from "@testing-library/react"; import {pointerMap, triggerPress} from "@nextui-org/test-utils"; import userEvent from "@testing-library/user-event"; import {CalendarDate, CalendarDateTime} from "@internationalized/date"; import {NextUIProvider} from "@nextui-org/system"; +import {Form} from "@nextui-org/form"; import {DatePicker as DatePickerBase, DatePickerProps} from "../src"; @@ -232,7 +233,7 @@ describe("DatePicker", () => { }); it("should apply custom dateInput classNames", function () { - const {getByRole, getByText} = render( + const {getByText} = render( { expect(label).toHaveClass("text-green-500"); - const inputWrapper = getByRole("group"); + const inputWrapper = document.querySelector( + `div[data-slot="input-wrapper"]`, + )!; expect(inputWrapper).toHaveClass("border-green-500"); }); @@ -739,4 +742,215 @@ describe("DatePicker", () => { expect(dialog).not.toBeVisible(); }); }); + + describe("validation", () => { + describe("validationBehavior=native", () => { + it("supports isRequired", async () => { + const {getByRole, getByTestId} = render( + + + , + ); + + const group = getByRole("group"); + const input = document.querySelector("input[name=date]") as HTMLInputElement; + + expect(input).toHaveAttribute("required"); + expect(input.validity.valid).toBe(false); + expect(group).not.toHaveAttribute("aria-describedby"); + + act(() => { + (getByTestId("form") as HTMLFormElement).checkValidity(); + }); + + expect(group).toHaveAttribute("aria-describedby"); + const getDescription = () => + group + .getAttribute("aria-describedby") + ?.split(" ") + .map((d) => document.getElementById(d)?.textContent) + .join(" "); + + expect(getDescription()).toContain("Constraints not satisfied"); + expect(document.activeElement).toBe(within(group).getAllByRole("spinbutton")[0]); + + await user.keyboard("[ArrowUp][Tab][ArrowUp][Tab][ArrowUp]"); + + expect(getDescription()).toContain("Constraints not satisfied"); + expect(input.validity.valid).toBe(true); + }); + }); + + it("supports validate function", async () => { + const {getByRole, getByTestId} = render( +
+ (v.year < 2022 ? "Invalid value" : null)} + validationBehavior="native" + /> + , + ); + + const group = getByRole("group"); + const input = document.querySelector("input[name=date]") as HTMLInputElement; + const getDescription = () => + group + .getAttribute("aria-describedby") + ?.split(" ") + .map((d) => document.getElementById(d)?.textContent) + .join(" "); + + expect(getDescription()).not.toContain("Invalid value"); + expect(input.validity.valid).toBe(false); + + act(() => { + (getByTestId("form") as HTMLFormElement).checkValidity(); + }); + + expect(group).toHaveAttribute("aria-describedby"); + expect(getDescription()).toContain("Invalid value"); + expect(document.activeElement).toBe(within(group).getAllByRole("spinbutton")[0]); + + await user.keyboard("[ArrowRight][ArrowRight]2024"); + + expect(getDescription()).toContain("Invalid value"); + expect(input.validity.valid).toBe(true); + }); + + it("supports server validation", async () => { + function Test() { + const [serverErrors, setServerErrors] = React.useState({}); + const onSubmit = (e) => { + e.preventDefault(); + setServerErrors({ + date: "Invalid value", + }); + }; + + return ( +
+ + + + ); + } + + const {getByTestId, getByRole} = render(); + + const group = getByRole("group"); + const input = document.querySelector("input[name=date]") as HTMLInputElement; + + expect(group).not.toHaveAttribute("aria-describedby"); + + await user.click(getByTestId("submit")); + + const getDescription = () => + group + .getAttribute("aria-describedby") + ?.split(" ") + .map((d) => document.getElementById(d)?.textContent) + .join(" "); + + expect(getDescription()).toContain("Invalid value"); + expect(input.validity.valid).toBe(false); + + await user.tab({shift: true}); + await user.tab({shift: true}); + await user.keyboard("2024[ArrowLeft]2[ArrowLeft]2"); + act(() => (document.activeElement as HTMLInputElement)?.blur()); + + expect(getDescription()).not.toContain("Invalid value"); + expect(input.validity.valid).toBe(true); + }); + + describe("validationBehavior=aria", () => { + it("supports minValue and maxValue", async () => { + const {getByRole} = render( +
+ + , + ); + + const group = getByRole("group"); + const getDescription = () => + group + .getAttribute("aria-describedby") + ?.split(" ") + .map((d) => document.getElementById(d)?.textContent) + .join(" "); + + expect(getDescription()).toContain("Value must be 2/3/2020 or later."); + + await user.keyboard("[Tab][Tab][Tab][ArrowUp]"); + expect(getDescription()).not.toContain("Value must be 2/3/2020 or later."); + + await user.keyboard("[ArrowUp][ArrowUp][ArrowUp][ArrowUp][ArrowUp]"); + expect(getDescription()).toContain("Value must be 2/3/2024 or earlier."); + + await user.keyboard("[ArrowDown]"); + expect(getDescription()).not.toContain("Value must be 2/3/2024 or earlier."); + }); + + it("supports validate function", async () => { + const {getByRole} = render( +
+ (v.year < 2022 ? "Invalid value" : null)} + /> + , + ); + + const group = getByRole("group"); + + expect(group).toHaveAttribute("aria-describedby"); + const getDescription = () => + group + .getAttribute("aria-describedby") + ?.split(" ") + .map((d) => document.getElementById(d)?.textContent) + .join(" "); + + expect(getDescription()).toContain("Invalid value"); + + await user.keyboard("[Tab][ArrowRight][ArrowRight]2024"); + expect(getDescription()).not.toContain("Invalid value"); + }); + + it("supports server validation", async () => { + const {getByRole} = render( +
+ + , + ); + + const group = getByRole("group"); + + expect(group).toHaveAttribute("aria-describedby"); + const getDescription = () => + group + .getAttribute("aria-describedby") + ?.split(" ") + .map((d) => document.getElementById(d)?.textContent) + .join(" "); + + expect(getDescription()).toContain("Invalid value"); + + await user.keyboard("[Tab][ArrowRight][ArrowRight]2024[Tab]"); + expect(getDescription()).not.toContain("Invalid value"); + }); + }); + }); }); diff --git a/packages/components/date-picker/package.json b/packages/components/date-picker/package.json index a6bfd36072..6b17872c2f 100644 --- a/packages/components/date-picker/package.json +++ b/packages/components/date-picker/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/date-picker", - "version": "2.1.8", + "version": "2.2.0-beta.11", "description": "A date picker combines a DateInput and a Calendar popover to allow users to enter or select a date and time value.", "keywords": [ "date-picker" @@ -34,29 +34,30 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "@nextui-org/system": ">=2.1.0", - "@nextui-org/theme": ">=2.2.0", - "react": ">=18", - "react-dom": ">=18" + "@nextui-org/system": ">=2.3.0-beta.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0" }, "dependencies": { - "@internationalized/date": "3.5.5", + "@internationalized/date": "3.5.6", "@nextui-org/aria-utils": "workspace:*", "@nextui-org/button": "workspace:*", "@nextui-org/calendar": "workspace:*", "@nextui-org/date-input": "workspace:*", + "@nextui-org/form": "workspace:*", "@nextui-org/popover": "workspace:*", "@nextui-org/react-utils": "workspace:*", "@nextui-org/shared-icons": "workspace:*", "@nextui-org/shared-utils": "workspace:*", - "@react-aria/datepicker": "3.11.2", - "@react-aria/i18n": "3.12.2", - "@react-aria/utils": "3.25.2", - "@react-stately/datepicker": "3.10.2", - "@react-stately/overlays": "3.6.10", - "@react-stately/utils": "3.10.3", - "@react-types/datepicker": "3.8.2", - "@react-types/shared": "3.24.1" + "@react-aria/datepicker": "3.11.4", + "@react-aria/i18n": "3.12.3", + "@react-aria/utils": "3.25.3", + "@react-stately/datepicker": "3.10.3", + "@react-stately/overlays": "3.6.11", + "@react-stately/utils": "3.10.4", + "@react-types/datepicker": "3.8.3", + "@react-types/shared": "3.25.0" }, "devDependencies": { "@nextui-org/radio": "workspace:*", diff --git a/packages/components/date-picker/src/use-date-picker.ts b/packages/components/date-picker/src/use-date-picker.ts index 645059e6d7..25b563e82f 100644 --- a/packages/components/date-picker/src/use-date-picker.ts +++ b/packages/components/date-picker/src/use-date-picker.ts @@ -15,6 +15,7 @@ import {useDatePickerState} from "@react-stately/datepicker"; import {AriaDatePickerProps, useDatePicker as useAriaDatePicker} from "@react-aria/datepicker"; import {clsx, dataAttr, objectToDeps} from "@nextui-org/shared-utils"; import {mergeProps} from "@react-aria/utils"; +import {FormContext, useSlottedContext} from "@nextui-org/form"; import {ariaShouldCloseOnInteractOutside} from "@nextui-org/aria-utils"; import {useDatePickerBase} from "./use-date-picker-base"; @@ -63,9 +64,13 @@ export function useDatePicker({ ...originalProps }: UseDatePickerProps) { const globalContext = useProviderContext(); + const {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {}; const validationBehavior = - originalProps.validationBehavior ?? globalContext?.validationBehavior ?? "aria"; + originalProps.validationBehavior ?? + formValidationBehavior ?? + globalContext?.validationBehavior ?? + "aria"; const { domRef, diff --git a/packages/components/date-picker/src/use-date-range-picker.ts b/packages/components/date-picker/src/use-date-range-picker.ts index 89bfbe2e19..df9134c283 100644 --- a/packages/components/date-picker/src/use-date-range-picker.ts +++ b/packages/components/date-picker/src/use-date-range-picker.ts @@ -21,6 +21,7 @@ import {useDateRangePicker as useAriaDateRangePicker} from "@react-aria/datepick import {clsx, dataAttr, objectToDeps} from "@nextui-org/shared-utils"; import {mergeProps} from "@react-aria/utils"; import {dateRangePicker, dateInput, cn} from "@nextui-org/theme"; +import {FormContext, useSlottedContext} from "@nextui-org/form"; import {ariaShouldCloseOnInteractOutside} from "@nextui-org/aria-utils"; import {useDatePickerBase} from "./use-date-picker-base"; @@ -71,8 +72,12 @@ export function useDateRangePicker({ }: UseDateRangePickerProps) { const globalContext = useProviderContext(); + const {validationBehavior: formValidationBehavior} = useSlottedContext(FormContext) || {}; const validationBehavior = - originalProps.validationBehavior ?? globalContext?.validationBehavior ?? "aria"; + originalProps.validationBehavior ?? + formValidationBehavior ?? + globalContext?.validationBehavior ?? + "aria"; const { domRef, diff --git a/packages/components/date-picker/stories/date-picker.stories.tsx b/packages/components/date-picker/stories/date-picker.stories.tsx index e49afe48db..49a72bb301 100644 --- a/packages/components/date-picker/stories/date-picker.stories.tsx +++ b/packages/components/date-picker/stories/date-picker.stories.tsx @@ -21,6 +21,7 @@ import {Radio, RadioGroup, RadioProps} from "@nextui-org/radio"; import {cn} from "@nextui-org/theme"; import {MoonIcon, SunIcon} from "@nextui-org/shared-icons"; import {ValidationResult} from "@react-types/shared"; +import {Form} from "@nextui-org/form"; import {DatePicker, DatePickerProps} from "../src"; @@ -315,6 +316,29 @@ const UnavailableDatesTemplate = (args: DatePickerProps) => { ); }; +const ServerValidationTemplate = (args: DatePickerProps) => { + const [serverErrors, setServerErrors] = React.useState({}); + const onSubmit = (e) => { + e.preventDefault(); + setServerErrors({ + date: "Please select a valid date.", + }); + }; + + return ( +
+ + + + ); +}; + const StartAndEndContentTemplate = (args: DatePickerProps) => { return (
@@ -630,6 +654,13 @@ export const WithValidation = { }, }; +export const WithServerValidation = { + render: ServerValidationTemplate, + args: { + ...defaultProps, + }, +}; + export const WithStartAndEndContent = { render: StartAndEndContentTemplate, args: { diff --git a/packages/components/date-picker/stories/date-range-picker.stories.tsx b/packages/components/date-picker/stories/date-range-picker.stories.tsx index a54f9cf7cb..1dcac5ac4d 100644 --- a/packages/components/date-picker/stories/date-range-picker.stories.tsx +++ b/packages/components/date-picker/stories/date-range-picker.stories.tsx @@ -21,6 +21,7 @@ import {I18nProvider, useDateFormatter, useLocale} from "@react-aria/i18n"; import {Button, ButtonGroup} from "@nextui-org/button"; import {Radio, RadioGroup, RadioProps} from "@nextui-org/radio"; import {cn} from "@nextui-org/theme"; +import {Form} from "@nextui-org/form"; import {MoonIcon, SunIcon} from "@nextui-org/shared-icons"; import {DateRangePicker, DateRangePickerProps} from "../src"; @@ -379,6 +380,30 @@ const PresetsTemplate = (args: DateRangePickerProps) => { ); }; +const ServerValidationTemplate = (args: DateRangePickerProps) => { + const [serverErrors, setServerErrors] = React.useState({}); + const onSubmit = (e) => { + e.preventDefault(); + setServerErrors({ + startDate: "Please select a valid start date.", + endDate: "Please select a valid end date.", + }); + }; + + return ( +
+ + + + ); +}; + const StartAndEndContentTemplate = (args: DateRangePickerProps) => { return (
@@ -719,6 +744,13 @@ export const WithValidation = { }, }; +export const WithServerValidation = { + render: ServerValidationTemplate, + args: { + ...defaultProps, + }, +}; + export const WithStartAndEndContent = { render: StartAndEndContentTemplate, args: { diff --git a/packages/components/divider/CHANGELOG.md b/packages/components/divider/CHANGELOG.md index f858c18cbe..751f7928d4 100644 --- a/packages/components/divider/CHANGELOG.md +++ b/packages/components/divider/CHANGELOG.md @@ -1,5 +1,91 @@ # @nextui-org/divider +## 2.1.0-beta.7 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/system-rsc@2.2.0-beta.6 + - @nextui-org/react-rsc-utils@2.0.15-beta.4 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/system-rsc@2.2.0-beta.5 + - @nextui-org/react-rsc-utils@2.0.15-beta.3 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.5 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/system-rsc@2.2.0-beta.4 + - @nextui-org/react-rsc-utils@2.0.15-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/system-rsc@2.2.0-beta.3 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/system-rsc@2.2.0-beta.3 + - @nextui-org/react-rsc-utils@2.0.15-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/system-rsc@2.2.0-beta.2 + - @nextui-org/react-rsc-utils@2.0.15-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/system-rsc@2.2.0-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/system-rsc@2.2.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + ## 2.0.32 ### Patch Changes diff --git a/packages/components/divider/package.json b/packages/components/divider/package.json index 2cc01f0547..a9cbead399 100644 --- a/packages/components/divider/package.json +++ b/packages/components/divider/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/divider", - "version": "2.0.32", + "version": "2.1.0-beta.7", "description": ". A separator is a visual divider between two groups of content", "keywords": [ "divider" @@ -34,15 +34,15 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", - "@nextui-org/theme": ">=2.1.0" + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", + "@nextui-org/theme": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/shared-utils": "workspace:*", "@nextui-org/react-rsc-utils": "workspace:*", "@nextui-org/system-rsc": "workspace:*", - "@react-types/shared": "3.24.1" + "@react-types/shared": "3.25.0" }, "devDependencies": { "@nextui-org/theme": "workspace:*", diff --git a/packages/components/drawer/CHANGELOG.md b/packages/components/drawer/CHANGELOG.md new file mode 100644 index 0000000000..69ff50eed7 --- /dev/null +++ b/packages/components/drawer/CHANGELOG.md @@ -0,0 +1,123 @@ +# @nextui-org/drawer + +## 2.1.0-beta.10 + +### Patch Changes + +- Updated dependencies []: + - @nextui-org/modal@2.1.0-beta.10 + - @nextui-org/framer-utils@2.0.26-beta.8 + +## 2.1.0-beta.9 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/modal@2.1.0-beta.9 + - @nextui-org/framer-utils@2.0.26-beta.7 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.1.0-beta.8 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/modal@2.1.0-beta.8 + - @nextui-org/framer-utils@2.0.26-beta.6 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.1.0-beta.7 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/modal@2.1.0-beta.7 + - @nextui-org/framer-utils@2.0.26-beta.5 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.1.0-beta.6 + +### Patch Changes + +- [#4057](https://github.com/nextui-org/nextui/pull/4057) [`d947b9283`](https://github.com/nextui-org/nextui/commit/d947b92833c8e4abc16dae72466cdb922313e9c8) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Drawer styles and transition improved + +- Updated dependencies [[`d947b9283`](https://github.com/nextui-org/nextui/commit/d947b92833c8e4abc16dae72466cdb922313e9c8)]: + - @nextui-org/modal@2.1.0-beta.6 + +## 2.1.0-beta.5 + +### Patch Changes + +- Updated dependencies []: + - @nextui-org/modal@2.1.0-beta.5 + +## 2.1.0-beta.4 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/modal@2.1.0-beta.4 + - @nextui-org/framer-utils@2.0.26-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.1.0-beta.3 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/modal@2.1.0-beta.3 + - @nextui-org/framer-utils@2.0.26-beta.3 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.1.0-beta.2 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/modal@2.1.0-beta.2 + - @nextui-org/framer-utils@2.0.26-beta.2 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.1.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/modal@2.1.0-beta.1 + - @nextui-org/framer-utils@2.0.26-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.1.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`2d6ae74c3`](https://github.com/nextui-org/nextui/commit/2d6ae74c36a157472bd4b06b8580e7db163eddcc), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/modal@2.1.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/framer-utils@2.0.26-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 diff --git a/packages/components/drawer/package.json b/packages/components/drawer/package.json index 96559ab14c..bf757e7de6 100644 --- a/packages/components/drawer/package.json +++ b/packages/components/drawer/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/drawer", - "version": "2.0.0", + "version": "2.1.0-beta.10", "description": "Used to render a content that slides in from the side of the screen.", "keywords": [ "drawer" @@ -34,10 +34,10 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "react": ">=18", - "react-dom": ">=18", - "@nextui-org/theme": ">=2.0.0", - "@nextui-org/system": ">=2.0.0" + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "@nextui-org/system": ">=2.3.0-beta.0" }, "dependencies": { "@nextui-org/shared-utils": "workspace:*", @@ -50,7 +50,10 @@ "@nextui-org/system": "workspace:*", "@nextui-org/input": "workspace:*", "@nextui-org/checkbox": "workspace:*", + "@nextui-org/tooltip": "workspace:*", + "@nextui-org/image": "workspace:*", "@nextui-org/button": "workspace:*", + "@nextui-org/avatar": "workspace:*", "@nextui-org/link": "workspace:*", "@nextui-org/switch": "workspace:*", "@nextui-org/shared-icons": "workspace:*", diff --git a/packages/components/drawer/src/use-drawer.ts b/packages/components/drawer/src/use-drawer.ts index b7d0478816..3a820bb467 100644 --- a/packages/components/drawer/src/use-drawer.ts +++ b/packages/components/drawer/src/use-drawer.ts @@ -4,7 +4,7 @@ import {drawer} from "@nextui-org/theme"; import {ReactRef, useDOMRef} from "@nextui-org/react-utils"; import {useCallback, useMemo} from "react"; import {TRANSITION_EASINGS} from "@nextui-org/framer-utils"; -import {clsx} from "@nextui-org/shared-utils"; +import {clsx, isEmpty} from "@nextui-org/shared-utils"; import {PropGetter} from "@nextui-org/system"; interface Props extends Omit { @@ -39,7 +39,7 @@ export function useDrawer(originalProps: UseDrawerProps) { const domRef = useDOMRef(ref); const motionProps = useMemo(() => { - if (drawerMotionProps !== void 0) return drawerMotionProps; + if (!isEmpty(drawerMotionProps)) return drawerMotionProps; const key = placement === "left" || placement === "right" ? "x" : "y"; @@ -49,9 +49,8 @@ export function useDrawer(originalProps: UseDrawerProps) { [key]: 0, transition: { [key]: { - bounce: 0, - duration: 0.3, - ease: TRANSITION_EASINGS.ease, + duration: 0.2, + ease: TRANSITION_EASINGS.easeOut, }, }, }, @@ -59,9 +58,8 @@ export function useDrawer(originalProps: UseDrawerProps) { [key]: placement === "top" || placement === "left" ? "-100%" : "100%", transition: { [key]: { - bounce: 0, - duration: 0.6, - ease: TRANSITION_EASINGS.ease, + duration: 0.1, + ease: TRANSITION_EASINGS.easeIn, }, }, }, diff --git a/packages/components/drawer/stories/drawer.stories.tsx b/packages/components/drawer/stories/drawer.stories.tsx index 259c2449fc..92be13f41f 100644 --- a/packages/components/drawer/stories/drawer.stories.tsx +++ b/packages/components/drawer/stories/drawer.stories.tsx @@ -6,6 +6,9 @@ import {Button} from "@nextui-org/button"; import {Input} from "@nextui-org/input"; import {Checkbox} from "@nextui-org/checkbox"; import {Link} from "@nextui-org/link"; +import {Tooltip} from "@nextui-org/tooltip"; +import {Image} from "@nextui-org/image"; +import {Avatar, AvatarGroup} from "@nextui-org/avatar"; import {MailFilledIcon, LockFilledIcon} from "@nextui-org/shared-icons"; import {useDisclosure} from "@nextui-org/use-disclosure"; @@ -165,6 +168,335 @@ const PlacementTemplate = (args: DrawerProps) => { ); }; +const CustomStylesTemplate = (args: DrawerProps) => { + const {isOpen, onOpen, onOpenChange} = useDisclosure({defaultOpen: args.defaultOpen}); + + return ( + <> + + + + {(onClose) => ( + <> + + + + +
+ + +
+
+ + + + + + +
+ + +
+ Event image +
+
+

SF Bay Area Meetup in November

+

+ 555 California St, San Francisco, CA 94103 +

+
+
+
+
Nov
+
+ 19 +
+
+
+

+ Tuesday, November 19 +

+

5:00 PM - 9:00 PM PST

+
+
+
+
+ + + + + + +
+
+ + + + } + className="group gap-x-0.5 text-medium text-foreground font-medium" + href="https://www.google.com/maps/place/555+California+St,+San+Francisco,+CA+94103" + rel="noreferrer noopener" + > + 555 California St suite 500 + +

San Francisco, California

+
+
+
+ About the event +
+

+ Hey Bay Area! We are excited to announce our next meetup on Tuesday, + November 19th. +

+

+ Join us for an evening of insightful discussions and hands-on workshops + focused on the latest developments in web development and design. Our + featured speakers will share their experiences with modern frontend + frameworks, responsive design patterns, and emerging web technologies. + You'll have the opportunity to network with fellow developers and + designers while enjoying refreshments and snacks. +

+

+ During the main session, we'll dive deep into practical examples of + building scalable applications, exploring best practices for component + architecture, and understanding advanced state management techniques. Our + interactive workshop portion will let you apply these concepts directly, + with experienced mentors available to provide guidance and answer your + questions. Whether you're a seasoned developer or just starting your + journey, you'll find valuable takeaways from this session. +

+ +

+ Brought to you by the{" "} + + NextUI team + + . +

+
+
+
+ Hosted By +
+ + NextUI Team +
+
+
+ 105 Going +
+ + + + + + + + + + + + + + +
+
+
+
+ + + + Contact the host + + + Report event + + + + )} + + + + ); +}; + export const Default = { render: Template, args: { @@ -216,3 +548,10 @@ export const CustomMotion = { }, }, }; + +export const CustomStyles = { + render: CustomStylesTemplate, + args: { + ...defaultProps, + }, +}; diff --git a/packages/components/dropdown/CHANGELOG.md b/packages/components/dropdown/CHANGELOG.md index 3f59691259..7807e216bb 100644 --- a/packages/components/dropdown/CHANGELOG.md +++ b/packages/components/dropdown/CHANGELOG.md @@ -1,5 +1,137 @@ # @nextui-org/dropdown +## 2.2.0-beta.10 + +### Patch Changes + +- Updated dependencies [[`256d46277`](https://github.com/nextui-org/nextui/commit/256d462771c19d6ca5b969d0ec44419fb560f0ac)]: + - @nextui-org/menu@2.1.0-beta.9 + - @nextui-org/popover@2.2.0-beta.9 + +## 2.2.0-beta.9 + +### Patch Changes + +- Updated dependencies []: + - @nextui-org/menu@2.1.0-beta.8 + - @nextui-org/popover@2.2.0-beta.9 + - @nextui-org/aria-utils@2.1.0-beta.8 + +## 2.2.0-beta.8 + +### Patch Changes + +- [#4092](https://github.com/nextui-org/nextui/pull/4092) [`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Test new runner + +- Updated dependencies [[`528668db8`](https://github.com/nextui-org/nextui/commit/528668db85b98b46473cb1e214780b7468cdadba)]: + - @nextui-org/menu@2.1.0-beta.7 + - @nextui-org/popover@2.2.0-beta.8 + - @nextui-org/aria-utils@2.1.0-beta.7 + - @nextui-org/react-utils@2.0.18-beta.7 + - @nextui-org/shared-utils@2.0.9-beta.7 + +## 2.2.0-beta.7 + +### Patch Changes + +- [#4086](https://github.com/nextui-org/nextui/pull/4086) [`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Pnpm clean + +- Updated dependencies [[`f69fe47b5`](https://github.com/nextui-org/nextui/commit/f69fe47b5b8f6f3a77a7a8c20d8715263fa32acb)]: + - @nextui-org/menu@2.1.0-beta.6 + - @nextui-org/popover@2.2.0-beta.7 + - @nextui-org/aria-utils@2.1.0-beta.6 + - @nextui-org/react-utils@2.0.18-beta.6 + - @nextui-org/shared-utils@2.0.9-beta.6 + +## 2.2.0-beta.6 + +### Patch Changes + +- [#4083](https://github.com/nextui-org/nextui/pull/4083) [`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix build + +- Updated dependencies [[`35058262c`](https://github.com/nextui-org/nextui/commit/35058262c61628fb42907f529c4417886aa12bb2)]: + - @nextui-org/menu@2.1.0-beta.5 + - @nextui-org/popover@2.2.0-beta.6 + - @nextui-org/aria-utils@2.1.0-beta.5 + - @nextui-org/react-utils@2.0.18-beta.5 + - @nextui-org/shared-utils@2.0.9-beta.5 + +## 2.2.0-beta.5 + +### Patch Changes + +- Updated dependencies [[`5339b2571`](https://github.com/nextui-org/nextui/commit/5339b2571e6d73ca6efe2acd34d88669419db9f7)]: + - @nextui-org/shared-utils@2.0.9-beta.4 + - @nextui-org/menu@2.1.0-beta.4 + - @nextui-org/popover@2.2.0-beta.5 + - @nextui-org/aria-utils@2.1.0-beta.4 + - @nextui-org/react-utils@2.0.18-beta.4 + +## 2.2.0-beta.4 + +### Patch Changes + +- [#4010](https://github.com/nextui-org/nextui/pull/4010) [`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - framer-motion alpha version added + +- Updated dependencies [[`ef432eb53`](https://github.com/nextui-org/nextui/commit/ef432eb539714fded6cab86a2185956fb103e0df)]: + - @nextui-org/menu@2.1.0-beta.3 + - @nextui-org/popover@2.2.0-beta.4 + - @nextui-org/aria-utils@2.1.0-beta.3 + - @nextui-org/react-utils@2.0.18-beta.3 + - @nextui-org/shared-utils@2.0.9-beta.3 + +## 2.2.0-beta.3 + +### Patch Changes + +- [#4008](https://github.com/nextui-org/nextui/pull/4008) [`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - React 19 added to peerDeps + +- Updated dependencies [[`7c1c0dd8f`](https://github.com/nextui-org/nextui/commit/7c1c0dd8fef3ea72996c1095b919574c4b7f9b89)]: + - @nextui-org/menu@2.1.0-beta.2 + - @nextui-org/popover@2.2.0-beta.3 + - @nextui-org/aria-utils@2.1.0-beta.2 + - @nextui-org/react-utils@2.0.18-beta.2 + - @nextui-org/shared-utils@2.0.9-beta.2 + +## 2.2.0-beta.2 + +### Patch Changes + +- Updated dependencies [[`563c1585a`](https://github.com/nextui-org/nextui/commit/563c1585a3c1a32e8272ec4641cfabeaaac3296c)]: + - @nextui-org/popover@2.2.0-beta.2 + +## 2.2.0-beta.1 + +### Patch Changes + +- [#3990](https://github.com/nextui-org/nextui/pull/3990) [`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Beta 1 + +- Updated dependencies [[`cb5bc4c74`](https://github.com/nextui-org/nextui/commit/cb5bc4c74f00caaee80dca89c1f02038db315b85)]: + - @nextui-org/menu@2.1.0-beta.1 + - @nextui-org/popover@2.2.0-beta.1 + - @nextui-org/aria-utils@2.1.0-beta.1 + - @nextui-org/react-utils@2.0.18-beta.1 + - @nextui-org/shared-utils@2.0.9-beta.1 + +## 2.2.0-beta.0 + +### Minor Changes + +- [#3732](https://github.com/nextui-org/nextui/pull/3732) [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d) Thanks [@ryo-manba](https://github.com/ryo-manba)! - update react-aria version + +### Patch Changes + +- [#3523](https://github.com/nextui-org/nextui/pull/3523) [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb) Thanks [@wingkwong](https://github.com/wingkwong)! - update `framer-motion` versions + +- Updated dependencies [[`0cf91395c`](https://github.com/nextui-org/nextui/commit/0cf91395c7c66a69fb05c7fca4a30cbad9e1e0f8), [`781b85566`](https://github.com/nextui-org/nextui/commit/781b85566ee5eac3f505625462c4f5f14e36ed3a), [`67ea2f65e`](https://github.com/nextui-org/nextui/commit/67ea2f65e17f913bdffae4690586a6ae202c8f7d), [`38a54ab49`](https://github.com/nextui-org/nextui/commit/38a54ab497781e17799b37f0061ba50f2dc44e09), [`af3c4f706`](https://github.com/nextui-org/nextui/commit/af3c4f706bb88eae02eee594a6db68cdd33bbe88), [`ae73de1a6`](https://github.com/nextui-org/nextui/commit/ae73de1a61c26e78235ce2d4c38159d486b55d56), [`ad6393ab3`](https://github.com/nextui-org/nextui/commit/ad6393ab33362119203455ef5c8ffbfe1ffa96a1), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`cb1b3135b`](https://github.com/nextui-org/nextui/commit/cb1b3135bc7e811c9c2e163d4778f9f6eb2ef8c8), [`a5cac4561`](https://github.com/nextui-org/nextui/commit/a5cac45619e529cf9850f02f416b6bc7cba77f3f), [`d90ad05b1`](https://github.com/nextui-org/nextui/commit/d90ad05b13b36617009cb0e5f57f299aa7bb7bd0), [`a0d7141db`](https://github.com/nextui-org/nextui/commit/a0d7141db314c6bea27df6b8beb15dae3b1bcb93), [`9f6839faf`](https://github.com/nextui-org/nextui/commit/9f6839faf9fe05c766571bcb71028bd3236d6e3a), [`2aebfcca5`](https://github.com/nextui-org/nextui/commit/2aebfcca5906fb72a7f751273b38e41a40dc16a3), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`3f0d81b56`](https://github.com/nextui-org/nextui/commit/3f0d81b560e7ef3eb315bd98407249c0eb4ed5eb), [`8a33eabb2`](https://github.com/nextui-org/nextui/commit/8a33eabb2583202fcc8fbc33e8f2ed23bb45f1a4), [`559436d46`](https://github.com/nextui-org/nextui/commit/559436d462bdb8739d8c817d1aa98607969d8a07)]: + - @nextui-org/theme@2.3.0-beta.0 + - @nextui-org/menu@2.1.0-beta.0 + - @nextui-org/popover@2.2.0-beta.0 + - @nextui-org/system@2.3.0-beta.0 + - @nextui-org/aria-utils@2.1.0-beta.0 + - @nextui-org/shared-utils@2.0.9-beta.0 + - @nextui-org/react-utils@2.0.18-beta.0 + ## 2.1.31 ### Patch Changes diff --git a/packages/components/dropdown/__tests__/dropdown.test.tsx b/packages/components/dropdown/__tests__/dropdown.test.tsx index 86bf926aaa..370d5ca718 100644 --- a/packages/components/dropdown/__tests__/dropdown.test.tsx +++ b/packages/components/dropdown/__tests__/dropdown.test.tsx @@ -560,14 +560,12 @@ describe("Dropdown", () => { ); const dropdown = wrapper.getByTestId("dropdown"); - const dropdown2 = wrapper.getByTestId("dropdown2"); - expect(dropdown).not.toBeNull(); - - expect(dropdown2).not.toBeNull(); + expect(dropdown).toBeVisible(); + expect(dropdown2).toBeVisible(); - // open the dropdown listbox by clicking dropdownor button in the first dropdown + // open the dropdown listbox by clicking dropdown button in the first dropdown await user.click(dropdown); // assert that the first dropdown listbox is open diff --git a/packages/components/dropdown/package.json b/packages/components/dropdown/package.json index 27c91e72ab..f7a1980e1b 100644 --- a/packages/components/dropdown/package.json +++ b/packages/components/dropdown/package.json @@ -1,6 +1,6 @@ { "name": "@nextui-org/dropdown", - "version": "2.1.31", + "version": "2.2.0-beta.10", "description": "A dropdown displays a list of actions or options that a user can choose.", "keywords": [ "dropdown" @@ -34,11 +34,11 @@ "postpack": "clean-package restore" }, "peerDependencies": { - "@nextui-org/system": ">=2.0.0", - "@nextui-org/theme": ">=2.1.0", - "framer-motion": ">=11.5.6", - "react": ">=18", - "react-dom": ">=18" + "@nextui-org/system": ">=2.3.0-beta.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "framer-motion": ">=11.5.6 || >=12.0.0-alpha.1", + "react": ">=18 || >=19.0.0-rc.0", + "react-dom": ">=18 || >=19.0.0-rc.0" }, "dependencies": { "@nextui-org/aria-utils": "workspace:*", @@ -46,11 +46,11 @@ "@nextui-org/popover": "workspace:*", "@nextui-org/react-utils": "workspace:*", "@nextui-org/shared-utils": "workspace:*", - "@react-aria/focus": "3.18.2", - "@react-aria/menu": "3.15.3", - "@react-aria/utils": "3.25.2", - "@react-stately/menu": "3.8.2", - "@react-types/menu": "3.9.11" + "@react-aria/focus": "3.18.4", + "@react-aria/menu": "3.15.5", + "@react-aria/utils": "3.25.3", + "@react-stately/menu": "3.8.3", + "@react-types/menu": "3.9.12" }, "devDependencies": { "@nextui-org/avatar": "workspace:*", @@ -67,4 +67,4 @@ "react-dom": "^18.0.0" }, "clean-package": "../../../clean-package.config.json" -} \ No newline at end of file +} diff --git a/packages/components/dropdown/src/use-dropdown.ts b/packages/components/dropdown/src/use-dropdown.ts index cff1cc1b9e..fa78241ab3 100644 --- a/packages/components/dropdown/src/use-dropdown.ts +++ b/packages/components/dropdown/src/use-dropdown.ts @@ -77,7 +77,7 @@ const getCloseOnSelect = ( return props?.closeOnSelect; }; -export function useDropdown(props: UseDropdownProps) { +export function useDropdown(props: UseDropdownProps): UseDropdownReturn { const globalContext = useProviderContext(); const { @@ -212,4 +212,18 @@ export function useDropdown(props: UseDropdownProps) { }; } -export type UseDropdownReturn = ReturnType; +// export type UseDropdownReturn = ReturnType; + +export type UseDropdownReturn = { + Component: string | React.ElementType; + menuRef: React.RefObject; + menuProps: any; + classNames: string; + closeOnSelect: boolean; + onClose: () => void; + autoFocus: any; + disableAnimation: boolean; + getPopoverProps: PropGetter; + getMenuProps: (props?: Partial>, ref?: Ref) => MenuProps; + getMenuTriggerProps: (props?: any, ref?: Ref) => any; +}; diff --git a/packages/components/form/README.md b/packages/components/form/README.md new file mode 100644 index 0000000000..ed42241ec3 --- /dev/null +++ b/packages/components/form/README.md @@ -0,0 +1,24 @@ +# @nextui-org/form + +A Quick description of the component + +> This is an internal utility, not intended for public usage. + +## Installation + +```sh +yarn add @nextui-org/form +# or +npm i @nextui-org/form +``` + +## Contribution + +Yes please! See the +[contributing guidelines](https://github.com/nextui-org/nextui/blob/master/CONTRIBUTING.md) +for details. + +## License + +This project is licensed under the terms of the +[MIT license](https://github.com/nextui-org/nextui/blob/master/LICENSE). diff --git a/packages/components/form/package.json b/packages/components/form/package.json new file mode 100644 index 0000000000..53069e644f --- /dev/null +++ b/packages/components/form/package.json @@ -0,0 +1,57 @@ +{ + "name": "@nextui-org/form", + "version": "2.0.0", + "description": "A form is a group of inputs that allows users submit data to a server and supports field validation errors.", + "keywords": [ + "form" + ], + "author": "Junior Garcia ", + "homepage": "https://nextui.org", + "license": "MIT", + "main": "src/index.ts", + "sideEffects": false, + "files": [ + "dist" + ], + "publishConfig": { + "access": "public" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/nextui-org/nextui.git", + "directory": "packages/components/form" + }, + "bugs": { + "url": "https://github.com/nextui-org/nextui/issues" + }, + "scripts": { + "build": "tsup src --dts", + "build:fast": "tsup src", + "dev": "pnpm build:fast --watch", + "clean": "rimraf dist .turbo", + "typecheck": "tsc --noEmit", + "prepack": "clean-package", + "postpack": "clean-package restore" + }, + "peerDependencies": { + "@nextui-org/system": ">=2.3.0-beta.0", + "@nextui-org/theme": ">=2.3.0-beta.0", + "react": ">=18", + "react-dom": ">=18" + }, + "dependencies": { + "@nextui-org/react-utils": "workspace:*", + "@nextui-org/shared-utils": "workspace:*", + "@react-aria/utils": "3.25.3", + "@react-types/shared": "3.25.0", + "@react-stately/form": "3.0.6", + "@react-types/form": "^3.7.8" + }, + "devDependencies": { + "@nextui-org/button": "workspace:*", + "clean-package": "2.2.0", + "react": "^18.0.0", + "react-dom": "^18.0.0" + }, + "clean-package": "../../../clean-package.config.json" +} diff --git a/packages/components/form/src/base-form.tsx b/packages/components/form/src/base-form.tsx new file mode 100644 index 0000000000..bbd1b186f4 --- /dev/null +++ b/packages/components/form/src/base-form.tsx @@ -0,0 +1,47 @@ +/* + * This file is copied from https://github.dev/adobe/react-spectrum/blob/2d4521098a3b4999f2e98b4d52d22483ee3451c8/packages/react-aria-components/src/Form.tsx + * We copied this internally to avoid installing the complete react-aria-components package. + */ + +import type {FormProps as SharedFormProps} from "@react-types/form"; + +import {FormValidationContext} from "@react-stately/form"; +import React, {createContext, ForwardedRef, forwardRef} from "react"; + +import {ContextValue, DOMProps, useContextProps} from "./utils"; + +export interface FormProps extends SharedFormProps, DOMProps { + /** + * Whether to use native HTML form validation to prevent form submission + * when a field value is missing or invalid, or mark fields as required + * or invalid via ARIA. + * @default 'native' + */ + validationBehavior?: "aria" | "native"; +} + +export const FormContext = createContext>(null); + +/** + * A form is a group of inputs that allows users to submit data to a server, + * with support for providing field validation errors. + */ +export const Form = forwardRef(function Form(props: FormProps, ref: ForwardedRef) { + [props, ref] = useContextProps(props, ref, FormContext); + let {validationErrors, validationBehavior = "native", children, className, ...domProps} = props; + + return ( +
+ + + {children} + + +
+ ); +}); diff --git a/packages/components/form/src/form.tsx b/packages/components/form/src/form.tsx new file mode 100644 index 0000000000..f5bae8a497 --- /dev/null +++ b/packages/components/form/src/form.tsx @@ -0,0 +1,11 @@ +import {useProviderContext} from "@nextui-org/system"; + +import {Form as AriaForm, FormProps} from "./base-form"; + +export const Form = (props: FormProps) => { + const globalContext = useProviderContext(); + const validationBehavior = + props.validationBehavior ?? globalContext?.validationBehavior ?? "aria"; + + return ; +}; diff --git a/packages/components/form/src/index.ts b/packages/components/form/src/index.ts new file mode 100644 index 0000000000..a45d37b3e0 --- /dev/null +++ b/packages/components/form/src/index.ts @@ -0,0 +1,11 @@ +// export types +export type {FormProps} from "./base-form"; + +// export hooks +export {useSlottedContext} from "./utils"; + +// export context +export {FormContext} from "./base-form"; + +// export component +export {Form} from "./form"; diff --git a/packages/components/form/src/utils.ts b/packages/components/form/src/utils.ts new file mode 100644 index 0000000000..2f90c2974a --- /dev/null +++ b/packages/components/form/src/utils.ts @@ -0,0 +1,106 @@ +/* + * This file is copied from https://github.dev/adobe/react-spectrum/blob/2d4521098a3b4999f2e98b4d52d22483ee3451c8/packages/react-aria-components/src/utils.ts + * We copied this internally to avoid installing the complete react-aria-components package. + */ + +import type {CSSProperties, ForwardedRef, ReactNode} from "react"; + +import {Context, useContext, useMemo} from "react"; +import {RefObject, DOMProps as SharedDOMProps} from "@react-types/shared"; +import {mergeProps, mergeRefs, useObjectRef} from "@react-aria/utils"; +export const DEFAULT_SLOT = Symbol("default"); + +interface SlottedValue { + slots?: Record; +} + +export type WithRef = T & {ref?: ForwardedRef}; +export type SlottedContextValue = SlottedValue | T | null | undefined; +export type ContextValue = SlottedContextValue>; + +export interface StyleProps { + /** The CSS [className](https://developer.mozilla.org/en-US/docs/Web/API/Element/className) for the element. */ + className?: string; + /** The inline [style](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/style) for the element. */ + style?: CSSProperties; +} + +export interface DOMProps extends StyleProps, SharedDOMProps { + /** The children of the component. */ + children?: ReactNode; +} + +export interface SlotProps { + /** + * A slot name for the component. Slots allow the component to receive props from a parent component. + * An explicit `null` value indicates that the local props completely override all props received from a parent. + */ + slot?: string | null; +} + +export function useSlottedContext( + context: Context>, + slot?: string | null, +): T | null | undefined { + let ctx = useContext(context); + + if (slot === null) { + // An explicit `null` slot means don't use context. + return null; + } + if (ctx && typeof ctx === "object" && "slots" in ctx && ctx.slots) { + let availableSlots = new Intl.ListFormat().format(Object.keys(ctx.slots).map((p) => `"${p}"`)); + + if (!slot && !ctx.slots[DEFAULT_SLOT]) { + throw new Error(`A slot prop is required. Valid slot names are ${availableSlots}.`); + } + let slotKey = slot || DEFAULT_SLOT; + + if (!ctx.slots[slotKey]) { + // @ts-ignore + throw new Error(`Invalid slot "${slot}". Valid slot names are ${availableSlots}.`); + } + + return ctx.slots[slotKey]; + } + + // @ts-ignore + return ctx; +} + +export function useContextProps( + props: T & SlotProps, + ref: ForwardedRef, + context: Context>, +): [T, RefObject] { + let ctx = useSlottedContext(context, props.slot) || {}; + // @ts-ignore - TS says "Type 'unique symbol' cannot be used as an index type." but not sure why. + let {ref: contextRef, ...contextProps} = ctx as any; + let mergedRef = useObjectRef(useMemo(() => mergeRefs(ref, contextRef), [ref, contextRef])); + let mergedProps = mergeProps(contextProps, props) as unknown as T; + + // mergeProps does not merge `style`. Adding this there might be a breaking change. + if ("style" in contextProps && contextProps.style && "style" in props && props.style) { + if (typeof contextProps.style === "function" || typeof props.style === "function") { + // @ts-ignore + mergedProps.style = (renderProps) => { + let contextStyle = + typeof contextProps.style === "function" + ? contextProps.style(renderProps) + : contextProps.style; + let defaultStyle = {...renderProps.defaultStyle, ...contextStyle}; + let style = + typeof props.style === "function" + ? props.style({...renderProps, defaultStyle}) + : props.style; + + return {...defaultStyle, ...style}; + }; + } else { + // @ts-ignore + mergedProps.style = {...contextProps.style, ...props.style}; + } + } + + return [mergedProps, mergedRef]; +} diff --git a/packages/components/form/stories/form.stories.tsx b/packages/components/form/stories/form.stories.tsx new file mode 100644 index 0000000000..c9eb3d4526 --- /dev/null +++ b/packages/components/form/stories/form.stories.tsx @@ -0,0 +1,76 @@ +import React, {useState} from "react"; +import {Meta} from "@storybook/react"; +// import {Input} from "@nextui-org/input"; +import {Button} from "@nextui-org/button"; + +import {Form, FormProps} from "../src"; + +export default { + title: "Components/Form", + component: Form, + argTypes: { + isDisabled: { + control: { + type: "boolean", + }, + }, + validationBehavior: { + control: { + type: "select", + }, + options: ["aria", "native"], + }, + }, +} as Meta; + +const defaultProps = {}; + +const Template = (args: FormProps) => ( +
+ {/* TODO: Doesn't work due to circular dependencies in the monorepo. + * See: https://github.com/vercel/turborepo/discussions/1752 + */} + {/* */} + +
+); + +export const Default = { + render: Template, + args: { + ...defaultProps, + }, +}; + +export const NativeValidation = { + render: Template, + args: { + ...defaultProps, + validationBehavior: "native", + }, +}; + +export const AriaValidation = { + render: Template, + args: { + ...defaultProps, + validationBehavior: "aria", + }, +}; + +export const ServerValidation = () => { + const [serverErrors, setServerErrors] = useState({}); + const onSubmit = async (e) => { + e.preventDefault(); + let errors = {}; + + for (let el of e.target.elements) { + errors[el.name] = `Invalid value for "${el.name}".`; + } + setServerErrors(errors); + }; + + return