Skip to content

Commit

Permalink
v2.4.2 (#3256)
Browse files Browse the repository at this point in the history
* chore(root): reat-aria packages updated (#2889)

* chore(storybook): common colors enabled (#2902)

* fix(range-calendar): hide only dates outside the month (#2906)

* fix(range-calendar): hide only dates outside the month #2890

* fix(range-calendar): corrected spelling mistake in changeset description

* fix(range-calendar): corrected capitalization in changeset description

* chore(changeset): patch @nextui-org/theme

---------

Co-authored-by: shrinidhi.upadhyaya <[email protected]>
Co-authored-by: աɨռɢӄաօռɢ <[email protected]>

* fix(date-picker): keep date picker style consistent for different variants (#2908)

* fix: add missing TableRowProps export (#2866)

* fix: add missing TableRowProps export

* feat(changeset): add changeset for PR2866

* chore(changeset): revise changeset message

---------

Co-authored-by: աɨռɢӄաօռɢ <[email protected]>

* fix(input): correct label margin for RTL required inputs (#2781)

* fix(input): correct label margin for RTL required inputs

* fix(theme): add changeset fr theme

* docs(core): add storybook and canary release info (#2914)

* Cn utility refactor (#2915)

* refactor(core): cn utility adjusted and moved to the theme package

* chore(root): changeset

* fix(storybook): stories that used cn

* docs(date-picker): change to jsx instead (#2919)

* fix(switch): support uncontrolled switch in react-hook-form (#2924)

* feat(switch): add @nextui-org/use-safe-layout-effect

* chore(deps): add @nextui-org/use-safe-layout-effect

* fix(switch): react-hook-form uncontrolled switch component

* fix(switch): react-hook-form uncontrolled switch component

* feat(switch): add rect-hook-form in dev dep

* feat(switch): add WithReactHookFormTemplate

* refactor(root): react aria packages fixed (#2944)

* feat(docs): docs changes (#2868)

* feat(docs): add example how to set locale (#2867)

* docs(guide): add an explanation for the installation guide (#2769)

* docs(guide): add an explanation for the installation guide

* docs(guide): add an explanation for the cli guide

* docs(guide): add support for cli output

* fix: change sort priority - cmdk (#2873)

* docs: remove unsupported props in range calendar and date range picker (#2881)

* chore(calendar): remove showMonthAndYearPickers from range calendar story

* docs(date-range-picker): remove showMonthAndYearPickers info

* docs(range-calendar): remove unsupported props

* docs: refactor typing in form.ts (#2882)

* chore(docs): supplement errorMessage behaviour in input (#2892)

* refactor(docs): revise NextUI Provider structure

* chore(docs): add updated tag

---------

Co-authored-by: Nozomi-Hijikata <[email protected]>
Co-authored-by: HaRuki <[email protected]>
Co-authored-by: Kaben <[email protected]>

* fix(slider): missing marks when hideThumb is true & revise slider styles (#2883)

* chore(slider): include marks in hideThumb

* fix(slider): revise slider styles

* feat(changeset): add changeset

* feat(slider): add tests with marks and hideThumb

* feat(test): react hook form tests & stories (#2931)

* feat(input): add Input with React Hook Form tests

* refactor(input): add missing types

* feat(checkbox): add checkbox with React Hook Form tests

* feat(select): add react-hook-form to dev dep

* feat(select): add react hook form story

* feat(select): react hook form tests

* fix(select): incorrect button reference

* feat(deps): add react-hook-form to dev dep in autocomplete

* feat(autocomplete): react hook form story

* feat(autocomplete): react hook form tests

* fix(autocomplete): rollback wrapper type

* feat(switch): add react hook form tests

* refactor(stories): reorder stories items

* fix: update accordion item heading tag to be customizable (#2265)

* fix: update accordion item heading tag to be customizable

* Update .changeset/heavy-hairs-join.md

Co-authored-by: Junior Garcia <[email protected]>

* Update .changeset/heavy-hairs-join.md

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

* chore(accordion): lint

* chore(changeset): add issue number

* feat(docs): add HeadingComponent prop

---------

Co-authored-by: Shawn Dong <[email protected]>
Co-authored-by: Junior Garcia <[email protected]>
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Co-authored-by: աɨռɢӄաօռɢ <[email protected]>

* fix(theme): add pointer-events-none to skeleton base (#2972)

* feat(tabs): add `destroyInactiveTabPanel` prop for Tabs component (#2973)

* feat(tabs): add destroyInactiveTabPanel and set default to false

* feat(tabs): integrate with destroyInactiveTabPanel

* feat(theme): hidden inert tab panel

* feat(changeset): add changeset

* chore(changeset): add issue number

* feat(docs): add `destroyInactiveTabPanel` prop to tabs page

* chore(docs): set destroyInactiveTabPanel to true by default

* chore(tabs): set destroyInactiveTabPanel to true by default

* chore(tabs): revise destroyInactiveTabPanel logic

* feat(tabs): add tests for destroyInactiveTabPanel

* chore(tabs): change the default value of destroyInactiveTabPanel to true

* refactor: add support for disabling the animation globally (#2929)

* refactor: add support for disabling the animation globally

* chore(docs): disableAnimation removed from global provider

* feat(docs): nextui provider api updated, storybook preview adjusted

* chore(theme): button is scalable when disabled, tooltip animation improved

* fix(theme): remove origin-bottom from button (#2990)

* fix(skeleton): overflow issue in skeleton (#2986)

* fix(theme): set overflow visible after skeleton loaded

* feat(changeset): add changeset

* fix(table): v2 input/textarea don't allow spaces inside a table (#3020)

* fix(table): set onKeyDownCapture to undefined

* feat(changeset): add changeset

* fix(slider): calculate the correct value on mark click (#3017)

* fix(slider): calculate the correct value on mark click

* refactor(slider): remove the tests inside describe block

* feat(slider): add tests for thumb move on mark click

* refactor(slider): use val instead of pos

* fix(theme): revise input isInvalid styles (#3010)

* fix(theme): revise isInvalid input styles

* feat(changeset): add changeset

* feat(date-picker): add missing ref to input wrapper (#3011)

* fix(date-picker): add missing ref to input wrapper

* feat(changeset): add changeset

* fix(core): incorrect tailwind classnames (#3018)

* fix(dropdown): focus behaviour on press / enter keydown (#2970)

* fix(dropdown): set focus on the first item

* feat(dropdown): add keyboard interactions tests

* feat(changeset): add changeset

* fix(dropdown): use fireEvent.keyDown instead

* chore(deps): add @nextui-org/test-utils to dropdown

* refactor(dropdown): pass onKeyDown to menu trigger and don't hardcode autoFocus

* chore(dropdown): remove autoFocus

* fix(menu): pass userMenuProps to useTreeState and useAriaMenu and remove from getListProps

* chore(changeset): add menu package

* fix(component): update type definition to prevent primitive values as items (#2953)

* fix: update type definition to prevent primitive values as items

* fix: typecheck

* fix(select): onSelectionChange can handle number (#2937)

* fix: onSelectionChange type for dynamic items in Select component

* docs: remove unnecessary properties

* docs: update highlightedLines

* chore: add changeset

* fix(calendar): scrolling is hidden when changing the month (#2949)

* fix(calendar): scrolling is hidden when changing the month

* chore(changeset): correct package name

---------

Co-authored-by: Poli Sour <[email protected]>
Co-authored-by: WK Wong <[email protected]>

* fix: make VisuallyHidden's element type as span when it's inside phrasing element (#3013)

* fix(checkbox): make VisuallyHidden's element type as span

* feat(changeset): add changeset

* fix(radio): make the VisuallyHidden element type as span

* fix(switch): make the VisuallyHidden element type as span

* fix(select): make the VisuallyHidden element type as span

* feat(changeset): replace changeset

* chore: fix formatting

* docs: sync nextui-cli  api (#3035)

* docs: sync nextui-cli  api

* docs: update

* chore: update routes.json with new path and set updated flag

---------

Co-authored-by: Junior Garcia <[email protected]>

* feat: switch default validationBehavior to aria and allow switching via props (#2987)

* chore: add support validationBehavior aria

* chore: add validationBehavior to Provider

* chore: add autocomplete validation test

* chore: add checkbox validation test

* fix(input): require condition

* docs: add description of validationBehavior props

* chore: add support validationBehavior props for date components

* docs(dates): add description of validationBehavior props

* chore: add changeset

* chore: format

* chore: fix test

* fix: select validationBehavior is not support yet

* fix: select validationBehavior not supported yet

* chore(docs): validation behavior prop added to nextui-provider

---------

Co-authored-by: Junior Garcia <[email protected]>

* fix: popover-based focus behaviour (#2854)

* fix(autocomplete): autocomplete focus behaviour

* feat(autocomplete): add test case for catching blur cases

* refactor(autocomplete): use isOpen instead

* feat(autocomplete): add "should focus when clicking autocomplete" test case

* feat(autocomplete): add should set the input after selection

* fix(autocomplete): remove shouldUseVirtualFocus

* fix(autocomplete): uncomment blur logic

* refactor(autocomplete): remove state as it is in getPopoverProps

* refactor(autocomplete): remove unnecessary blur

* refactor(select): remove unncessary props

* fix(popover): use domRef instead

* fix(popover): revise isNonModal and isDismissable

* fix(popover): use dialogRef back

* fix(popover): rollback

* fix(autocomplete): onFocus logic

* feat(popover): set disableFocusManagement to overlay

* feat(modal): set disableFocusManagement to overlay

* fix(autocomplete): set disableFocusManagement for autocomplete

* feat(popover): include disableFocusManagement prop

* refactor(autocomplete): revise type in selectorButton

* fix(autocomplete): revise focus logic

* feat(autocomplete): add internal focus state and add shouldCloseOnInteractOutside

* feat(autocomplete): handle selectedItem change

* feat(autocomplete): add clear button test

* feat(changeset): add changeset

* refactor(components): use the original order

* refactor(autocomplete): add more comments

* fix(autocomplete): revise focus behaviours

* refactor(autocomplete): rename to listbox

* chore(popover): remove disableFocusManagement from popover

* chore(autocomplete): remove disableFocusManagement from autocomplete

* chore(changeset): add issue number

* fix(popover): don't set default value to transformOrigin

* fix(autocomplete): revise shouldCloseOnInteractOutside logic

* feat(autocomplete): should close listbox by clicking another autocomplete

* fix(popover): add disableFocusManagement to overlay

* refactor(autocomplete): revise comments and refactor shouldCloseOnInteractOutside

* feat(changeset): add issue number

* fix(autocomplete): merge with selectorButtonProps.onClick

* refactor(autocomplete): remove extra line

* refactor(autocomplete): revise comment

* feat(select): add shouldCloseOnInteractOutside

* feat(dropdown): add shouldCloseOnInteractOutside

* feat(date-picker): add shouldCloseOnInteractOutside

* feat(changeset): add dropdown and date-picker

* fix(popover): revise shouldCloseOnInteractOutside

* feat(date-picker): integrate with ariaShouldCloseOnInteractOutside

* feat(select): integrate with ariaShouldCloseOnInteractOutside

* feat(dropdown): integrate with ariaShouldCloseOnInteractOutside

* feat(popover): integrate with ariaShouldCloseOnInteractOutside

* feat(aria-utils): ariaShouldCloseOnInteractOutside

* chore(deps): update pnpm-lock.yaml

* feat(autocomplete): integrate with ariaShouldCloseOnInteractOutside

* feat(aria-utils): handle setShouldFocus logic

* feat(changeset): add @nextui-org/aria-utils

* chore(autocomplete): put the test into correct group

* feat(select): should close listbox by clicking another select

* feat(dropdown): should close listbox by clicking another dropdown

* feat(popover): should close listbox by clicking another popover

* feat(date-picker): should close listbox by clicking another datepicker

* chore(changeset): add issue numbers and revise changeset message

* refactor(autocomplete): change to useRef instead

* refactor(autocomplete): change to useRef instead

* refactor(aria-utils): revise comments and format code

* chore(changeset): add issue number

* chore: take popoverProps.shouldCloseOnInteractOutside first

* refactor(autocomplete): remove unnecessary logic

* refactor(autocomplete): focus management logic

* fix(components): Fix 'Tap to click' behavior on macOS with Edge/Chrome for Accordion and Tab (#2725)

* fix(components): fix 'Tap to click' behavior on macOS

* Add change file for accordion, menu, and tabs

* Remove 'fix(components)' from the .changeset file

* fix(components): undo dropdown change now that it's no longer applicable

* fix(components): update changeset file now that we are no longer modifying the dropdown component

* fix(date-picker): corrected inert value for true condition (#3054)

* fix(date-picker): corrected inert value for true condition #3044

* refactor(calendar): add todo comment

* feat(changeset): add changeset

---------

Co-authored-by: shrinidhi.upadhyaya <[email protected]>
Co-authored-by: WK Wong <[email protected]>

* fix(hooks): resolve type error in onKeyDown event handler (#3064)

* fix(hooks): resolve type error in onKeyDown event handler

* chore(changeset): revise changeset

---------

Co-authored-by: WK Wong <[email protected]>

* Update dependency array on setPage useCallback hook (#3029)

Changes:
Add the onChangeActivePage function to the dependency array of the setPage useCallback hook to ensure it always reflects the latest state.

Impact:
This fix ensures that the pagination component accurately reflects the current state when triggering onChangeActivePage.

* fix: error peerDep in pkg (#3014)

* fix: error peerDep in pkg

* docs: changeset

* Fix DatePicker Time Input (#2845)

* fix(date-picker): set `isCalendarHeaderExpanded` to `false` when DatePicker is closed

* fix(date-picker): calendar header controlled state on DatePicker

* chore(date-picker): update test

* chore(date-picker): remove unnecessary `async` in test

* Update packages/components/date-picker/__tests__/date-picker.test.tsx

---------

Co-authored-by: WK Wong <[email protected]>
Co-authored-by: Junior Garcia <[email protected]>

* fix(date-picker): test

* fix(hooks): optimize useScrollPosition with useCallback and useRef (#3049)

* fix(hooks): optimize useScrollPosition with useCallback and useRef

* Update .changeset/lucky-cobras-jog.md

* Update packages/hooks/use-scroll-position/src/index.ts

* Update packages/hooks/use-scroll-position/src/index.ts

---------

Co-authored-by: Junior Garcia <[email protected]>

* fix(select): placeholder text display for controlled component (#3081)

* fix: return placeholder when selectedItems is empty

* chore: add test and changeset

* chore(docs): v2.4.0 (#3084)

* chore(docs): v2.4.0

* chore(docs): v2.4.0 blog

* chore(docs): revise typos based on coderabbitai

* chore(docs): adjust navbar

---------

Co-authored-by: WK Wong <[email protected]>

* chore(changese): update @nextui-org/react dependency to minor version

* docs: update cli docs (#3096)

* ci(changesets): version packages (#2903)

Co-authored-by: Junior Garcia <[email protected]>

* fix(radio): remove required attribute for Radio with validationBehavior="aria" (#3110)

* fix(theme): add missing pointer event after data loaded (#3126)

* fix(system): listbox href issue (experimental) (#3119)

* fix(system): @react-aria/utils

* feat(hooks): include routerLinkProps

* feat(changeset): add changeset

* chore(deps): bump @react-aria/utils to 3.24.1

* fix(hooks): missing arguments

* chore(deps): bump @react-types/link

* chore(link): bump @react-aria/link to 3.7.1

* chore(link): use @react-aria/link instead

* chore(changeset): revise changeset

* chore(hooks): undo use-aria-link changes

* chore(deps): undo use-aria-link changes

* chore(deps): bump `@react-aria/utils` to `3.24.1`

* chore(deps): bump `@react-types/shared`

* feat: add missing router.open parameters due to router change

* chore(changeset): add new line

* chore(deps): bump `@react-types/shared` to `3.23.1`

* fix(avatar): avoid passing `disableAnimation` prop to a DOM element (#3111)

* fix(avatar): avoid passing `disableAnimation` prop to a DOM element

* refactor(avatar): use filterDOMProps approach

* chore(avatar): remove to type import

* chore(avatar): change to shouldFilterDOMProps

* fix(docs): removed unused import & corrected prop for disabled DatePicker (#3136)

Co-authored-by: shrinidhi.upadhyaya <[email protected]>

* ci(changesets): version packages (#3115)

* fix(pagination): missing animation (#3144)

* fix tsup domain (#3158)

* chore(docs): remove destroyInactiveTabPanel from Tab due to merge conflict (#3155)

* fix(autocomplete): maximum update depth exceeded in autocomplete (#3175)

* chore(checkbox): avoid passing non-DOM attributes to svg  (#3199)

* chore(docs): avoid passing non-DOM attributes to svg

* chore(utilities): avoid passing non-DOM attributes to svg

* feat(changeset): add changeset

* fix(docs): fix typo in autocomplete documentation page (#3182)

* fix(select): add missing data-invalid in select and add missing data attributes in docs (#3177)

* fix(select): add missing data-invalid attribute

* chore(docs): add missing data attributes for select base

* fix(tabs): destroyInactiveTabPanel unmounts inactive tabs' content (#3164)

* fix(tabs): incorrect content in tab panel

* feat(tabs): revise destroyInactiveTabPanel test cases

* fix(select): unset form value after unselecting an item (#3157)

* fix(select): set empty string instead of undefined for unsetting value

* feat(selet): should unset form value

* fix(tabs): set tab panel id correctly (#3246)

* docs(tooltip): supplement correct style path (#3183)

* docs(tooltip): supplement correct style path

* chore(docs): move the note below import tabs

* fix(use-aria-menu): link logic in useMenuItem (#3229)

* chore(deps): bump @internationalized/date version (#3230)

* fix(input): input display with hidden type (#3174)

* fix(input): input display with hidden type

* chore(input): add isHiddenType to dependency

* refactor(input): move the styles to theme and change hidden to data attr

* feat(theme): add isHiddenType to input

* chore(changeset): include theme package

* chore(input): revise input test

* fix(theme): remove isHiddenType from variants and use data-hidden prop instead

* fix(theme): remove isHiddenType from defaultVariants

* fix(input): remove isHiddenType passing to input

* feat(date-picker): add support for DatePicker to apply styles to DateInput (#3146)

* feat(date-picker): add support for DatePicker to apply styles to DateInput

* chore: update changeset

* docs(date-picker): add dateInputClassNames props

* refactor(date): updated errorMessage story and modified to import props (#3112)

* refactor(date): updated errorMessage story and modified to import props

* docs(date): add errorMessageFunction examples

* chore: add changeset

* fix: remove unnecessary props

* fix: typo

* Update regex-validation.ts (#3123)

* Update regex-validation.ts

Fix email regex

* Update email regex input.stories.tsx

* fix(autocomplete): controlled state logic (#2969)

* fix(autocomplete): autocomplete controlled state (#2955)

* chore(autocomplete): add changeset

* Update packages/components/autocomplete/__tests__/autocomplete.test.tsx

---------

Co-authored-by: Junior Garcia <[email protected]>

* fix(utilities): resolve assignRef TypeScript ref assignment issue (#3098)

* fix(utilities): resolve assignRef TypeScript ref assignment issue

* chore(changeset): revise changeset message

---------

Co-authored-by: WK Wong <[email protected]>

* fix(table): table-column align prop (#2900)

* fix(navbar): fixed the height of navbar menu (#1805)

* fix(navbar): fixed the height of navbar menu

* fix(navbar): refactored the css of navbar

* fix(navbar): fix redundant expression

* fix(navbar): fixed unnecessary changes

* fix(navbar): adjust viewport

* fix: RA dependencies bump (#3240)

* fix(popover): popover focus issue (#3187)

* fix(popover): move useDialog to popover-content

* fix(popover): move useDialog to free-solo-popover

* refactor(popover): use const instead

* feat(changset): add changeset

* feat(popover): popover focus test

* refactor(popover): getDialogProps

* fix: interactions with popover & focus issues (#3137)

* fix(aria-utils): handle click on listbox

* fix(popover): move useDialog to popover-content

* fix(popover): move useDialog to free-solo-popover

* refactor(popover): use const instead

* feat(changset): add changeset

* feat(popover): popover focus test

* refactor(popover): getDialogProps

* chore(utilities): remove ariaShouldCloseOnInteractOutside

* chore(deps): pnpm-lock.yaml

* fix(popover): remove disableFocusManagement

* fix(modal): remove disableFocusManagement

* fix(autocomplete): remove custom focus logic and remove ariaShouldCloseOnInteractOutside

* fix(popover): rewrite shouldCloseOnInteractOutside logic

* chore(utilities): remove ariaShouldCloseOnInteractOutside

* chore(deps): bump react-aria dependencies

* chore(autocomplete): change back to focus

* feat(changeset): update changeset

* chore(docs): update type in onSelectionChange

* fix(popover): revise popover test case

* chore(deps): add @nextui-org/aria-utils

* fix(autocomplete): add ariaShouldCloseOnInteractOutside

* fix(date-picker): add ariaShouldCloseOnInteractOutside

* fix(select): add ariaShouldCloseOnInteractOutside

* chore(deps): add @nextui-org/aria-utils

* fix(dropdown): add ariaShouldCloseOnInteractOutside

* feat(utilities): rewrite ariaShouldCloseOnInteractOutside

* fix(popover): use ariaShouldCloseOnInteractOutside

* fix(autocomplete): add back shouldFocus

* fix(utilities): include shouldFocus logic

* chore(utilities): remove !

* refactor(aria-utils): add more comments

* chore(changeset): update packages

* refactor(aria-utils): add more comments

* feat(popover): add test

* fix: dropdown onPress issue (#3211)

* fix(popover): move useDialog to popover-content

* fix(popover): move useDialog to free-solo-popover

* refactor(popover): use const instead

* feat(changset): add changeset

* feat(popover): popover focus test

* refactor(popover): getDialogProps

* fix(popover): dropdown onPress blocking issue

* fix(dropdown): incorrect keyCodes

* feat(dropdown): add keyboard onPress test cases

* chore(deps): keep all @react-aria/overlays version consistent

* chore(deps): sync dependencies

* chore(deps): sync dependencies

* refactor(aria-utils): remove shouldFocus logic

* refactor(autocomplete): remove shouldFocus logic and set input focus when open

* chore(deps): bump dependencies

* chore(deps): fix react aria dependencies

* fix(autocomplete): move popover style width inside isOpen true block

* fix(autocomplete): focus back to trigger

* feat(changeset): add changeset

* chore(deps): bump react-aria dependencies

* refactor(autocomplete): revise comment

* refactor(dropdown): revise logSpy and trigger mockRestore

* refactor(popover): remove debug className

* fix(date-input): avoid setting isInvalid in useDateFieldState

* fix(autocomplete): use ComboBoxValidationValue

* feat(use-aria-menu): add deprecate message

* feat(changeset): add missing packages

* refactor(use-aria-menu): remove isLink since it is included in useLinkProps

* Update packages/hooks/use-aria-menu/src/use-menu-item.ts

---------

Co-authored-by: Junior Garcia <[email protected]>

* ci(changesets): version packages (#3147)

Co-authored-by: Junior Garcia <[email protected]>

---------

Co-authored-by: Shrinidhi Upadhyaya <[email protected]>
Co-authored-by: shrinidhi.upadhyaya <[email protected]>
Co-authored-by: աɨռɢӄաօռɢ <[email protected]>
Co-authored-by: Paul Tiedtke <[email protected]>
Co-authored-by: Mohammad Reza Badri <[email protected]>
Co-authored-by: Nozomi-Hijikata <[email protected]>
Co-authored-by: HaRuki <[email protected]>
Co-authored-by: Kaben <[email protected]>
Co-authored-by: Shawn Dong <[email protected]>
Co-authored-by: Shawn Dong <[email protected]>
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Co-authored-by: Ryo Matsukawa <[email protected]>
Co-authored-by: Poli Sour <[email protected]>
Co-authored-by: Poli Sour <[email protected]>
Co-authored-by: Artem Pitikin <[email protected]>
Co-authored-by: winches <[email protected]>
Co-authored-by: Eric Abreu <[email protected]>
Co-authored-by: Minsu <[email protected]>
Co-authored-by: Jesus Perdomo Lampignano <[email protected]>
Co-authored-by: chirokas <[email protected]>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: EGOIST <[email protected]>
Co-authored-by: Damien Leroy <[email protected]>
Co-authored-by: Christian Abele <[email protected]>
Co-authored-by: Nozomi Hijikata <[email protected]>
  • Loading branch information
1 parent ecb93d0 commit 47c6228
Show file tree
Hide file tree
Showing 181 changed files with 2,702 additions and 1,359 deletions.
5 changes: 0 additions & 5 deletions .changeset/famous-mice-approve.md

This file was deleted.

5 changes: 0 additions & 5 deletions .changeset/tough-peaches-live.md

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ export default function Page() {

// Specify how each of the Autocomplete values should change when an
// option is selected from the list box
const onSelectionChange = (key: React.Key) => {
const onSelectionChange = (key: React.Key | null) => {
setFieldState((prevState) => {
let selectedItem = prevState.items.find((option) => option.value === key);

Expand Down
6 changes: 4 additions & 2 deletions apps/docs/config/routes.json
Original file line number Diff line number Diff line change
Expand Up @@ -179,7 +179,8 @@
"key": "checkbox",
"title": "Checkbox",
"keywords": "checkbox, binary choice, selection control, toggle",
"path": "/docs/components/checkbox.mdx"
"path": "/docs/components/checkbox.mdx",
"updated": true
},
{
"key": "checkbox-group",
Expand Down Expand Up @@ -397,7 +398,8 @@
"key": "tooltip",
"title": "Tooltip",
"keywords": "tooltip, hint, descriptive message, hover info",
"path": "/docs/components/tooltip.mdx"
"path": "/docs/components/tooltip.mdx",
"updated": true
},
{
"key": "user",
Expand Down
19 changes: 9 additions & 10 deletions apps/docs/content/components/checkbox/custom-check-icon.ts
Original file line number Diff line number Diff line change
@@ -1,19 +1,15 @@
const HeartIcon = `export const HeartIcon = ({
filled,
size,
height,
width,
label,
...props
}) => {
const HeartIcon = `export const HeartIcon = ({ size, height, width, ...props }) => {
// avoid passing non-DOM attributes to svg
const {isSelected, isIndeterminate, disableAnimation, ...otherProps} = props;
return (
<svg
width={size || width || 24}
height={size || height || 24}
viewBox="0 0 24 24"
fill='fill'
xmlns="http://www.w3.org/2000/svg"
{...props}
{...otherProps}
>
<path
d="M12.62 20.81c-.34.12-.9.12-1.24 0C8.48 19.82 2 15.69 2 8.69 2 5.6 4.49 3.1 7.56 3.1c1.82 0 3.43.88 4.44 2.24a5.53 5.53 0 0 1 4.44-2.24C19.51 3.1 22 5.6 22 8.69c0 7-6.48 11.13-9.38 12.12Z"
Expand All @@ -25,14 +21,17 @@ const HeartIcon = `export const HeartIcon = ({
`;

const PlusIcon = `export const PlusIcon = ({ size, height, width, ...props }) => {
// avoid passing non-DOM attributes to svg
const {isSelected, isIndeterminate, disableAnimation, ...otherProps} = props;
return (
<svg
width={size || width || 24}
height={size || height || 24}
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
{...props}
{...otherProps}
>
<path
d="M6 12H18"
Expand Down
30 changes: 30 additions & 0 deletions apps/docs/content/components/date-input/error-message-function.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
const App = `import {DateInput} from "@nextui-org/react";
import {CalendarDate, parseDate} from "@internationalized/date";
export default function App() {
return (
<div className="flex w-full flex-wrap md:flex-nowrap gap-4">
<DateInput
label={"Birth date"}
defaultValue={parseDate("2024-04-04")}
placeholderValue={new CalendarDate(1995, 11, 6)}
description={"This is my birth date."}
isInvalid
errorMessage={(value) => {
if (value.isInvalid) {
return "Please enter a valid date.";
}
}}
className="max-w-xs"
/>
</div>
);
}`;

const react = {
"/App.jsx": App,
};

export default {
...react,
};
2 changes: 2 additions & 0 deletions apps/docs/content/components/date-input/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import labelPlacements from "./label-placements";
import description from "./description";
import startEndContent from "./start-end-content";
import errorMessage from "./error-message";
import errorMessageFunction from "./error-message-function";
import controlled from "./controlled";
import timeZones from "./time-zones";
import granularity from "./granularity";
Expand All @@ -25,6 +26,7 @@ export const dateInputContent = {
description,
startEndContent,
errorMessage,
errorMessageFunction,
controlled,
timeZones,
granularity,
Expand Down
26 changes: 26 additions & 0 deletions apps/docs/content/components/date-picker/error-message-function.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
const App = `import {DatePicker} from "@nextui-org/react";
export default function App() {
return (
<div className="flex w-full flex-wrap md:flex-nowrap gap-4">
<DatePicker
label="Birth date"
className="max-w-[284px]"
isInvalid
errorMessage={(value) => {
if (value.isInvalid) {
return "Please enter a valid date.";
}
}}
/>
</div>
);
}`;

const react = {
"/App.jsx": App,
};

export default {
...react,
};
2 changes: 2 additions & 0 deletions apps/docs/content/components/date-picker/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import variants from "./variants";
import labelPlacements from "./label-placements";
import description from "./description";
import errorMessage from "./error-message";
import errorMessageFunction from "./error-message-function";
import withMonthAndYearPickers from "./with-month-and-year-pickers";
import withTimeField from "./with-time-field";
import selectorIcon from "./selector-icon";
Expand All @@ -28,6 +29,7 @@ export const datePickerContent = {
labelPlacements,
description,
errorMessage,
errorMessageFunction,
withMonthAndYearPickers,
withTimeField,
selectorIcon,
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
const App = `import {DateRangePicker} from "@nextui-org/react";
import {parseDate} from "@internationalized/date";
export default function App() {
return (
<DateRangePicker
isInvalid
label="Stay duration"
variant="bordered"
errorMessage={(value) => {
if (value.isInvalid) {
return "Please enter your stay duration";
}
}}
defaultValue={{
start: parseDate("2024-04-01"),
end: parseDate("2024-04-08"),
}}
className="max-w-xs"
/>
);
}`;

const react = {
"/App.jsx": App,
};

export default {
...react,
};
2 changes: 2 additions & 0 deletions apps/docs/content/components/date-range-picker/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import variants from "./variants";
import labelPlacements from "./label-placements";
import description from "./description";
import errorMessage from "./error-message";
import errorMessageFunction from "./error-message-function";
import withTimeField from "./with-time-field";
import selectorIcon from "./selector-icon";
import controlled from "./controlled";
Expand All @@ -28,6 +29,7 @@ export const dateRangePickerContent = {
labelPlacements,
description,
errorMessage,
errorMessageFunction,
withTimeField,
selectorIcon,
controlled,
Expand Down
2 changes: 1 addition & 1 deletion apps/docs/content/components/input/regex-validation.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ const App = `import {Input} from "@nextui-org/react";
export default function App() {
const [value, setValue] = React.useState("junior2nextui.org");
const validateEmail = (value) => value.match(/^[A-Z0-9._%+-]+@[A-Z0-9.-]+.[A-Z]{2,4}$/i);
const validateEmail = (value) => value.match(/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i);
const isInvalid = React.useMemo(() => {
if (value === "") return false;
Expand Down
1 change: 0 additions & 1 deletion apps/docs/content/components/tabs/placement.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ export default function App() {
<RadioGroup
className="mb-4"
label="Placement"
orientation="top"
value={placement}
onValueChange={(value) => setPlacement(value)}
>
Expand Down
23 changes: 23 additions & 0 deletions apps/docs/content/components/time-input/error-message-function.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
const App = `import {TimeInput} from "@nextui-org/react";
export default function App() {
return (
<TimeInput
label="Event Time"
isInvalid
errorMessage={(value) => {
if (value.isInvalid) {
return "Please enter a valid time";
}
}}
/>
);
}`;

const react = {
"/App.jsx": App,
};

export default {
...react,
};
19 changes: 19 additions & 0 deletions apps/docs/content/components/time-input/error-message.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
const App = `import {TimeInput} from "@nextui-org/react";
export default function App() {
return (
<TimeInput
label="Event Time"
isInvalid
errorMessage="Please enter a valid time"
/>
);
}`;

const react = {
"/App.jsx": App,
};

export default {
...react,
};
4 changes: 4 additions & 0 deletions apps/docs/content/components/time-input/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@ import disabled from "./disabled";
import readonly from "./read-only";
import withoutLabel from "./without-label";
import withDescription from "./with-description";
import errorMessage from "./error-message";
import errorMessageFunction from "./error-message-function";
import labelPlacement from "./label-placement";
import startContent from "./start-content";
import endContent from "./end-content";
Expand All @@ -23,6 +25,8 @@ export const timeInputContent = {
readonly,
withoutLabel,
withDescription,
errorMessage,
errorMessageFunction,
labelPlacement,
startContent,
endContent,
Expand Down
2 changes: 1 addition & 1 deletion apps/docs/content/docs/components/autocomplete.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -254,7 +254,7 @@ The following example uses the `defaultFilter` prop to filter the list of option

### Asynchronous Filtering

Autocomplete supports asynchronous filtering, in the example below we are using the [useAyncList](https://react-spectrum.adobe.com/react-stately/useAsyncList.html) function
Autocomplete supports asynchronous filtering, in the example below we are using the [useAsyncList](https://react-spectrum.adobe.com/react-stately/useAsyncList.html) function
from [react-aria](https://react-spectrum.adobe.com) to handle asynchronous loading and filtering of data from a server.

<PackageManagers
Expand Down
4 changes: 2 additions & 2 deletions apps/docs/content/docs/components/checkbox.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,6 @@ Checkboxes allow users to select multiple items from a list of individual items,

---



## Installation

<PackageManagers
Expand Down Expand Up @@ -70,6 +68,8 @@ The `isIndeterminate` prop sets a `Checkbox` to an indeterminate state, overridi

### Custom Check Icon

> By default, `IconProps` will be passed to your icon component. Please make sure that `isSelected`, `isIndeterminate`, and `disableAnimation` are not passed to a DOM element.
<CodeDemo title="Custom Check Icon" files={checkboxContent.customCheckIcon} />

### Controlled
Expand Down
4 changes: 4 additions & 0 deletions apps/docs/content/docs/components/date-input.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,10 @@ You can combine the `isInvalid` and `errorMessage` properties to show an invalid

<CodeDemo title="With Error Message" files={dateInputContent.errorMessage} />

You can also pass an error message as a function. This allows for dynamic error message handling based on the [ValidationResult]((https://github.com/adobe/react-spectrum/blob/1cacbf1d438675feb3859fee54b17e620b458d9c/packages/%40react-types/shared/src/inputs.d.ts#L44-L51)).

<CodeDemo title="With Error Message Function" files={dateInputContent.errorMessageFunction} />

### Controlled

You can use the `value` and `onChange` properties to control the input value.
Expand Down
5 changes: 5 additions & 0 deletions apps/docs/content/docs/components/date-picker.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,10 @@ You can combine the `isInvalid` and `errorMessage` properties to show an invalid

<CodeDemo title="With Error Message" files={datePickerContent.errorMessage} />

You can also pass an error message as a function. This allows for dynamic error message handling based on the [ValidationResult]((https://github.com/adobe/react-spectrum/blob/1cacbf1d438675feb3859fee54b17e620b458d9c/packages/%40react-types/shared/src/inputs.d.ts#L44-L51)).

<CodeDemo title="With Error Message Function" files={datePickerContent.errorMessageFunction} />

### With Month and Year Pickers

<CodeDemo title="With Month and Year Pickers" files={datePickerContent.withMonthAndYearPickers} />
Expand Down Expand Up @@ -342,6 +346,7 @@ import {I18nProvider} from "@react-aria/i18n";
| timeInputProps | `TimeInputProps` | Props to be passed to the time input component. | `{ size: "sm", variant: "light", radius: "full", isIconOnly: true }` |
| disableAnimation | `boolean` | Whether to disable all animations in the date picker. Including the DateInput, Button, Calendar, and Popover. | `false` |
| classNames | `Record<"base" \| "selectorButton" \| "selectorIcon" \| "popoverContent" \| "calendar" \| "calendarContent" \| "timeInputLabel" \| "timeInput", string>` | Allows to set custom class names for the date-picker slots. | - |
| dateInputClassNames | `Record<"base"| "label"| "inputWrapper"| "innerWrapper"| "input"| "helperWrapper"| "description"| "errorMessage", string>` | Allows to set custom class names for the [date input slots](/docs/components/date-input#slots). | - |

### DatePicker Events

Expand Down
4 changes: 4 additions & 0 deletions apps/docs/content/docs/components/date-range-picker.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,10 @@ You can combine the `isInvalid` and `errorMessage` properties to show an invalid

<CodeDemo title="With Error Message" files={dateRangePickerContent.errorMessage} />

You can also pass an error message as a function. This allows for dynamic error message handling based on the [ValidationResult]((https://github.com/adobe/react-spectrum/blob/1cacbf1d438675feb3859fee54b17e620b458d9c/packages/%40react-types/shared/src/inputs.d.ts#L44-L51)).

<CodeDemo title="With Error Message Function" files={dateRangePickerContent.errorMessageFunction} />

### With Time Fields

DateRangePicker automatically includes time fields when a `CalendarDateTime` or `ZonedDateTime` object is provided as the value.
Expand Down
8 changes: 8 additions & 0 deletions apps/docs/content/docs/components/select.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -285,6 +285,14 @@ the popover and listbox components.

- **data-filled**:
Indicates if the select has a value, is focused, has start/end content or is open.
- **data-has-value**:
Indicates if the select has selected item(s).
- **data-has-label**:
Indicates if the select has a label. Based on `label` prop.
- **data-has-helper**:
Indicates if the select has helper text. Based on `errorMessage` or `description` prop.
- **data-invalid**:
Indicates if the select is invalid. Based on `isInvalid` prop.

`Select` has the following attributes on the `trigger` element:

Expand Down
Loading

0 comments on commit 47c6228

Please sign in to comment.