ci(changesets): version packages (#2745)

Co-authored-by: Junior Garcia <jrgarciadev@gmail.com>

apps/docs/content/components/popover/placements.ts

@@ -31,7 +31,7 @@ export default function App() {
         <Popover key={placement} placement={placement} color="secondary">
           <PopoverTrigger>
             <Button color="secondary" variant="flat" className="capitalize">
-              {placement?.replace("-", " ")}
+              {placement.replace("-", " ")}
             </Button>
           </PopoverTrigger>
           {content}

apps/docs/content/docs/components/calendar.mdx

@@ -23,11 +23,10 @@ A calendar consists of a grouping element containing one or more date grids (e.g
     npm: "npm install @nextui-org/calendar",
     yarn: "yarn add @nextui-org/calendar",
     pnpm: "pnpm add @nextui-org/calendar",
-    bun: "bun add @nextui-org/calendar"
+    bun: "bun add @nextui-org/calendar",
   }}
 />
 
-
 ## Import
 
 <ImportTabs
@@ -209,6 +208,7 @@ Here's the example to customize `topContent` and `bottomContent` to have some pr
 | visibleMonths           | `number`                                                                                                                                                                                                                                                                                                                                                                                      | The number of months to display at once. Up to 3 months are supported. Passing a number greater than 1 will disable the `showMonthAndYearPickers` prop                                    | `1`                 |
 | focusedValue            | `DateValue`                                                                                                                                                                                                                                                                                                                                                                                   | Controls the currently focused date within the calendar.                                                                                                                                  | -                   |
 | defaultFocusedValue     | `DateValue`                                                                                                                                                                                                                                                                                                                                                                                   | The date that is focused when the calendar first mounts (uncountrolled).                                                                                                                  | -                   |
+| calendarWidth           | `number` \| `string`                                                                                                                                                                                                                                                                                                                                                                          | The width to be applied to the calendar component. This value is multiplied by the `visibleMonths` number to determine the total width of the calendar.                                   | `256`               |
 | pageBehavior            | `single` \| `visible`                                                                                                                                                                                                                                                                                                                                                                         | Controls the behavior of paging. Pagination either works by advancing the visible page by visibleDuration (default) or one unit of visibleDuration.                                       | `visible`           |
 | weekdayStyle            | `narrow` \|`short` \| `long` \| `undefined`                                                                                                                                                                                                                                                                                                                                                   | The style of weekday names to display in the calendar grid header, e.g. single letter, abbreviation, or full day name.                                                                    | `narrow`            |
 | showMonthAndYearPickers | `boolean`                                                                                                                                                                                                                                                                                                                                                                                     | Whether the label should be crossed out.                                                                                                                                                  | `false`             |

apps/docs/content/docs/components/range-calendar.mdx

@@ -23,7 +23,7 @@ A range calendar consists of a grouping element containing one or more date grid
     npm: "npm install @nextui-org/calendar",
     yarn: "yarn add @nextui-org/calendar",
     pnpm: "pnpm add @nextui-org/calendar",
-    bun: "bun add @nextui-org/calendar"
+    bun: "bun add @nextui-org/calendar",
   }}
 />
 
@@ -210,6 +210,7 @@ Here's the example to customize `topContent` and `bottomContent` to have some pr
 | visibleMonths             | `number`                                                                                                                                                                                                                                                                                                                                                                                      | The number of months to display at once. Up to 3 months are supported. Passing a number greater than 1 will disable the `showMonthAndYearPickers` prop                                    | `1`                               |     |
 | focusedValue              | `DateValue`                                                                                                                                                                                                                                                                                                                                                                                   | Controls the currently focused date within the calendar.                                                                                                                                  | -                                 |     |
 | defaultFocusedValue       | `DateValue`                                                                                                                                                                                                                                                                                                                                                                                   | The date that is focused when the calendar first mounts (uncountrolled).                                                                                                                  | -                                 |     |
+| calendarWidth             | `number` \| `string`                                                                                                                                                                                                                                                                                                                                                                          | The width to be applied to the calendar component. This value is multiplied by the `visibleMonths` number to determine the total width of the calendar.                                   | `256`                             |
 | pageBehavior              | `PageBehavior`                                                                                                                                                                                                                                                                                                                                                                                | Controls the behavior of paging. Pagination either works by advancing the visible page by visibleDuration (default) or one unit of visibleDuration.                                       | `visible`                         |     |
 | weekdayStyle              | `"narrow" \|"short" \| "long" \| undefined`                                                                                                                                                                                                                                                                                                                                                   | The style of weekday names to display in the calendar grid header, e.g. single letter, abbreviation, or full day name.                                                                    | `narrow`                          |     |
 | allowsNonContiguousRanges | `boolean`                                                                                                                                                                                                                                                                                                                                                                                     | When combined with `isDateUnavailable`, determines whether non-contiguous ranges, i.e. ranges containing unavailable dates, may be selected.                                              | `false`                           |     |

packages/components/accordion/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @nextui-org/accordion
 
+## 2.0.30
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/aria-utils@2.0.17
+  - @nextui-org/framer-utils@2.0.17
+  - @nextui-org/divider@2.0.27
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.29
 
 ### Patch Changes

packages/components/accordion/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/accordion",
-  "version": "2.0.29",
+  "version": "2.0.30",
   "description": "Collapse display a list of high-level options that can expand/collapse to reveal more information.",
   "keywords": [
     "react",

packages/components/autocomplete/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/autocomplete
 
+## 2.0.12
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/button@2.0.29
+  - @nextui-org/input@2.1.19
+  - @nextui-org/listbox@2.1.18
+  - @nextui-org/popover@2.1.17
+  - @nextui-org/scroll-shadow@2.1.15
+  - @nextui-org/aria-utils@2.0.17
+  - @nextui-org/spinner@2.0.27
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.11
 
 ### Patch Changes

packages/components/autocomplete/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/autocomplete",
-  "version": "2.0.11",
+  "version": "2.0.12",
   "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"

packages/components/avatar/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/avatar
 
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/avatar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/avatar",
-  "version": "2.0.25",
+  "version": "2.0.26",
   "description": "The Avatar component is used to represent a user, and displays the profile picture, initials or fallback icon.",
   "keywords": [
     "avatar"

packages/components/badge/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/badge
 
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies [[`74eda3128`](https://github.com/nextui-org/nextui/commit/74eda312883b2e17df26f71442aba9fb3cd240be)]:
+  - @nextui-org/system-rsc@2.1.1
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/badge/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/badge",
-  "version": "2.0.25",
+  "version": "2.0.26",
   "description": "Badges are used as a small numerical value or status descriptor for UI elements.",
   "keywords": [
     "badge"

packages/components/breadcrumbs/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/breadcrumbs
 
+## 2.0.6
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.5
 
 ### Patch Changes

packages/components/breadcrumbs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/breadcrumbs",
-  "version": "2.0.5",
+  "version": "2.0.6",
   "description": "Breadcrumbs display a hierarchy of links to the current page or resource in an application.",
   "keywords": [
     "breadcrumbs"

packages/components/button/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @nextui-org/button
 
+## 2.0.29
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/ripple@2.0.26
+  - @nextui-org/spinner@2.0.27
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.28
 
 ### Patch Changes

packages/components/button/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/button",
-  "version": "2.0.28",
+  "version": "2.0.29",
   "description": "Buttons allow users to perform actions and choose with a single tap.",
   "keywords": [
     "button"

packages/components/calendar/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @nextui-org/calendar
 
+## 2.0.2
+
+### Patch Changes
+
+- [#2744](https://github.com/nextui-org/nextui/pull/2744) [`158c2aa00`](https://github.com/nextui-org/nextui/commit/158c2aa004f0080449321f84b0efd37762e8adc0) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Refactor calendar cell tab index, add calendar default width
+
+- Updated dependencies []:
+  - @nextui-org/button@2.0.29
+  - @nextui-org/framer-utils@2.0.17
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.1
 
 ### Patch Changes

packages/components/calendar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/calendar",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "A calendar displays one or more date grids and allows users to select a single date.",
   "keywords": [
     "calendar"

packages/components/calendar/src/calendar-cell.tsx

@@ -69,7 +69,7 @@ export function CalendarCell(originalProps: CalendarCellProps) {
 
   return (
     <td className={slots?.cell({class: classNames?.cell})} data-slot="cell" {...cellProps}>
-      <button
+      <span
         {...mergeProps(buttonProps, hoverProps, focusProps)}
         ref={ref}
         className={slots?.cellButton({class: classNames?.cellButton})}
@@ -88,10 +88,9 @@ export function CalendarCell(originalProps: CalendarCellProps) {
         data-selection-start={dataAttr(isSelectionStart)}
         data-today={dataAttr(isToday(props.date, state.timeZone))}
         data-unavailable={dataAttr(isUnavailable)}
-        tabIndex={isDisabled ? -1 : 0}
       >
         <span>{formattedDate}</span>
-      </button>
+      </span>
     </td>
   );
 }

packages/components/calendar/src/calendar-month.tsx

@@ -63,6 +63,9 @@ export function CalendarMonth(props: CalendarMonthProps) {
       key={weekIndex}
       className={slots?.gridBodyRow({class: classNames?.gridBodyRow})}
       data-slot="grid-body-row"
+      // makes the browser ignore the element and its children when tabbing
+      // @ts-ignore
+      inert={isHeaderExpanded ? true : undefined}
     >
       {state
         .getDatesInWeek(weekIndex, startDate)

packages/components/calendar/src/calendar-picker.tsx

@@ -65,6 +65,9 @@ export function CalendarPicker(props: CalendarPickerProps) {
         class: classNames?.pickerWrapper,
       })}
       data-slot="picker-wrapper"
+      // makes the browser ignore the element and its children when tabbing
+      // @ts-ignore
+      inert={isHeaderExpanded ? true : undefined}
     >
       <div
         ref={highlightRef}

packages/components/calendar/src/use-calendar-base.ts

@@ -16,7 +16,7 @@ import {calendar} from "@nextui-org/theme";
 import {useControlledState} from "@react-stately/utils";
 import {ReactRef, useDOMRef} from "@nextui-org/react-utils";
 import {useLocale} from "@react-aria/i18n";
-import {clamp, objectToDeps} from "@nextui-org/shared-utils";
+import {clamp, dataAttr, objectToDeps} from "@nextui-org/shared-utils";
 import {mergeProps} from "@react-aria/utils";
 import {useProviderContext} from "@nextui-org/system";
 
@@ -42,6 +42,13 @@ interface Props extends NextUIBaseProps {
    * @default 1
    */
   visibleMonths?: number;
+  /**
+   * The width to be applied to the calendar component. This value is multiplied by the number
+   * of visible months to determine the total width of the calendar.
+   *
+   * @default 256
+   */
+  calendarWidth?: number | string;
   /**
    * Props for the navigation button, prev button and next button.
    */
@@ -185,6 +192,7 @@ export function useCalendarBase(originalProps: UseCalendarBasePropsComplete) {
     topContent,
     bottomContent,
     showHelper = true,
+    calendarWidth = 256,
     visibleMonths: visibleMonthsProp = 1,
     weekdayStyle = "narrow",
     navButtonProps = {},
@@ -229,6 +237,7 @@ export function useCalendarBase(originalProps: UseCalendarBasePropsComplete) {
   );
 
   const visibleDuration = useMemo(() => ({months: visibleMonths}), [visibleMonths]);
+  const hasMultipleMonths = visibleMonths > 1;
   const shouldFilterDOMProps = typeof Component === "string";
 
   const {locale} = useLocale();
@@ -256,6 +265,16 @@ export function useCalendarBase(originalProps: UseCalendarBasePropsComplete) {
     ...navButtonProps,
   };
 
+  const baseProps = {
+    "data-slot": "base",
+    "data-has-multiple-months": dataAttr(hasMultipleMonths),
+    style: {
+      // @ts-ignore
+      "--visible-months": visibleMonths,
+      "--calendar-width": calendarWidth,
+    } as React.CSSProperties,
+  };
+
   const getPrevButtonProps = (props = {}) => {
     return {
       "data-slot": "prev-button",
@@ -290,6 +309,7 @@ export function useCalendarBase(originalProps: UseCalendarBasePropsComplete) {
     locale,
     minValue,
     maxValue,
+    baseProps,
     showHelper,
     weekdayStyle,
     visibleMonths,

packages/components/calendar/src/use-calendar.ts

@@ -38,6 +38,7 @@ export function useCalendar<T extends DateValue>({
     showHelper,
     weekdayStyle,
     visibleDuration,
+    baseProps,
     shouldFilterDOMProps,
     isHeaderExpanded,
     visibleMonths,
@@ -81,6 +82,7 @@ export function useCalendar<T extends DateValue>({
 
   const getBaseCalendarProps = (props = {}): CalendarBaseProps => {
     return {
+      ...baseProps,
       Component,
       showHelper,
       topContent,

packages/components/calendar/src/use-range-calendar.ts

@@ -40,6 +40,7 @@ export function useRangeCalendar<T extends DateValue>({
     isHeaderExpanded,
     visibleMonths,
     createCalendar: createCalendarProp,
+    baseProps,
     getPrevButtonProps,
     getNextButtonProps,
     getErrorMessageProps,
@@ -73,6 +74,7 @@ export function useRangeCalendar<T extends DateValue>({
 
   const getBaseCalendarProps = (props = {}): CalendarBaseProps => {
     return {
+      ...baseProps,
       Component,
       showHelper,
       topContent,

packages/components/card/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/card
 
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/ripple@2.0.26
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/card/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/card",
-  "version": "2.0.25",
+  "version": "2.0.26",
   "description": "Card is a container for text, photos, and actions in the context of a single subject.",
   "keywords": [
     "card"

packages/components/checkbox/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @nextui-org/checkbox
 
+## 2.0.27
+
+### Patch Changes
+
+- [#2754](https://github.com/nextui-org/nextui/pull/2754) [`cadbb30cf`](https://github.com/nextui-org/nextui/commit/cadbb30cfb786d2b54e1cb46ea9319d4cb9ce590) Thanks [@wingkwong](https://github.com/wingkwong)! - Fixes checkbox controlled state (#2752)
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/checkbox/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/checkbox",
-  "version": "2.0.26",
+  "version": "2.0.27",
   "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,35 +34,37 @@
     "postpack": "clean-package restore"
   },
   "peerDependencies": {
-    "react": ">=18",
-    "react-dom": ">=18",
+    "@nextui-org/system": ">=2.0.0",
     "@nextui-org/theme": ">=2.1.0",
-    "@nextui-org/system": ">=2.0.0"
+    "react": ">=18",
+    "react-dom": ">=18"
   },
   "dependencies": {
-    "@nextui-org/shared-utils": "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.1",
     "@react-aria/focus": "^3.16.2",
     "@react-aria/interactions": "^3.21.1",
+    "@react-aria/utils": "^3.23.2",
     "@react-aria/visually-hidden": "^3.8.10",
     "@react-stately/checkbox": "^3.6.3",
     "@react-stately/toggle": "^3.7.2",
-    "@react-aria/utils": "^3.23.2",
     "@react-types/checkbox": "^3.7.1",
     "@react-types/shared": "^3.22.1"
   },
   "devDependencies": {
-    "@nextui-org/theme": "workspace:*",
-    "@nextui-org/system": "workspace:*",
-    "@nextui-org/shared-icons": "workspace:*",
     "@nextui-org/chip": "workspace:*",
-    "@nextui-org/user": "workspace:*",
     "@nextui-org/link": "workspace:*",
+    "@nextui-org/shared-icons": "workspace:*",
+    "@nextui-org/system": "workspace:*",
+    "@nextui-org/theme": "workspace:*",
+    "@nextui-org/user": "workspace:*",
     "clean-package": "2.2.0",
     "react": "^18.0.0",
-    "react-dom": "^18.0.0"
+    "react-dom": "^18.0.0",
+    "react-hook-form": "^7.51.3"
   },
   "clean-package": "../../../clean-package.config.json"
 }

packages/components/checkbox/src/use-checkbox.ts

@@ -6,6 +6,7 @@ import {ReactNode, Ref, useCallback, useId, useState} from "react";
 import {useMemo, useRef} from "react";
 import {useToggleState} from "@react-stately/toggle";
 import {checkbox} from "@nextui-org/theme";
+import {useCallbackRef} from "@nextui-org/use-callback-ref";
 import {useHover, usePress} from "@react-aria/interactions";
 import {useFocusRing} from "@react-aria/focus";
 import {mergeProps, chain} from "@react-aria/utils";
@@ -170,6 +171,8 @@ export function useCheckbox(props: UseCheckboxProps = {}) {
     onValueChange,
   ]);
 
+  const toggleState = useToggleState(ariaCheckboxProps);
+
   const {
     inputProps,
     isSelected,
@@ -191,7 +194,7 @@ export function useCheckbox(props: UseCheckboxProps = {}) {
       useReactAriaCheckbox(
         {...ariaCheckboxProps, validationBehavior: "native"},
         // eslint-disable-next-line
-        useToggleState(ariaCheckboxProps),
+        toggleState,
         inputRef,
       );
 
@@ -242,8 +245,6 @@ export function useCheckbox(props: UseCheckboxProps = {}) {
     [color, size, radius, isInvalid, lineThrough, isDisabled, disableAnimation],
   );
 
-  const [isChecked, setIsChecked] = useState(!!defaultSelected || !!isSelected);
-
   // if we use `react-hook-form`, it will set the checkbox value using the ref in register
   // i.e. setting ref.current.checked to true or false which is uncontrolled
   // hence, sync the state with `ref.current.checked`
@@ -251,9 +252,11 @@ export function useCheckbox(props: UseCheckboxProps = {}) {
     if (!inputRef.current) return;
     const isInputRefChecked = !!inputRef.current.checked;
 
-    setIsChecked(isInputRefChecked);
+    toggleState.setSelected(isInputRefChecked);
   }, [inputRef.current]);
 
+  const onChangeProp = useCallbackRef(onChange);
+
   const handleCheckboxChange = useCallback(
     (event: React.ChangeEvent<HTMLInputElement>) => {
       if (isReadOnly || isDisabled) {
@@ -262,9 +265,9 @@ export function useCheckbox(props: UseCheckboxProps = {}) {
         return;
       }
 
-      setIsChecked(!isChecked);
+      onChangeProp?.(event);
     },
-    [isReadOnly, isDisabled, isChecked],
+    [isReadOnly, isDisabled, onChangeProp],
   );
 
   const baseStyles = clsx(classNames?.base, className);
@@ -274,7 +277,7 @@ export function useCheckbox(props: UseCheckboxProps = {}) {
       ref: domRef,
       className: slots.base({class: baseStyles}),
       "data-disabled": dataAttr(isDisabled),
-      "data-selected": dataAttr(isSelected || isIndeterminate || isChecked),
+      "data-selected": dataAttr(isSelected || isIndeterminate),
       "data-invalid": dataAttr(isInvalid),
       "data-hover": dataAttr(isHovered),
       "data-focus": dataAttr(isFocused),
@@ -315,10 +318,10 @@ export function useCheckbox(props: UseCheckboxProps = {}) {
   const getInputProps: PropGetter = useCallback(() => {
     return {
       ref: mergeRefs(inputRef, ref),
-      ...mergeProps(inputProps, focusProps, {checked: isChecked}),
-      onChange: chain(inputProps.onChange, onChange, handleCheckboxChange),
+      ...mergeProps(inputProps, focusProps),
+      onChange: chain(inputProps.onChange, handleCheckboxChange),
     };
-  }, [inputProps, focusProps, onChange, handleCheckboxChange]);
+  }, [inputProps, focusProps, handleCheckboxChange]);
 
   const getLabelProps: PropGetter = useCallback(
     () => ({
@@ -331,12 +334,12 @@ export function useCheckbox(props: UseCheckboxProps = {}) {
   const getIconProps = useCallback(
     () =>
       ({
-        isSelected: isSelected || isChecked,
+        isSelected: isSelected,
         isIndeterminate: !!isIndeterminate,
         disableAnimation: !!disableAnimation,
         className: slots.icon({class: classNames?.icon}),
       } as CheckboxIconProps),
-    [slots, classNames?.icon, isSelected, isIndeterminate, disableAnimation, isChecked],
+    [slots, classNames?.icon, isSelected, isIndeterminate, disableAnimation],
   );
 
   return {

packages/components/checkbox/stories/checkbox-group.stories.tsx

@@ -107,6 +107,28 @@ const FormTemplate = (args: CheckboxGroupProps) => {
   );
 };
 
+const ControlledTemplate = (args: CheckboxGroupProps) => {
+  const [selected, setSelected] = React.useState<string[]>(["buenos-aires"]);
+
+  React.useEffect(() => {
+    // eslint-disable-next-line no-console
+    console.log("Checkbox ", selected);
+  }, [selected]);
+
+  return (
+    <div className="flex flex-col gap-2">
+      <CheckboxGroup {...args} label="Select cities" value={selected} onValueChange={setSelected}>
+        <Checkbox value="buenos-aires">Buenos Aires</Checkbox>
+        <Checkbox value="sydney">Sydney</Checkbox>
+        <Checkbox value="san-francisco">San Francisco</Checkbox>
+        <Checkbox value="london">London</Checkbox>
+        <Checkbox value="tokyo">Tokyo</Checkbox>
+      </CheckboxGroup>
+      <p className="text-default-500">Selected: {selected.join(", ")}</p>
+    </div>
+  );
+};
+
 export const Default = {
   render: Template,
 
@@ -133,6 +155,14 @@ export const DefaultValue = {
   },
 };
 
+export const Controlled = {
+  render: ControlledTemplate,
+
+  args: {
+    ...defaultProps,
+  },
+};
+
 export const Horizontal = {
   render: Template,
 

packages/components/checkbox/stories/checkbox.stories.tsx

@@ -3,6 +3,7 @@ import {Meta} from "@storybook/react";
 import {checkbox} from "@nextui-org/theme";
 import {CloseIcon} from "@nextui-org/shared-icons";
 import {button} from "@nextui-org/theme";
+import {useForm} from "react-hook-form";
 
 import {Checkbox, CheckboxIconProps, CheckboxProps} from "../src";
 
@@ -60,6 +61,7 @@ const ControlledTemplate = (args: CheckboxProps) => {
         Subscribe (controlled)
       </Checkbox>
       <p className="text-default-500">Selected: {selected ? "true" : "false"}</p>
+      <button onClick={() => setSelected(!selected)}>Toggle</button>
     </div>
   );
 };
@@ -83,6 +85,63 @@ const FormTemplate = (args: CheckboxProps) => {
   );
 };
 
+const GroupTemplate = (args: CheckboxProps) => {
+  const items = ["Apple", "Banana", "Orange", "Mango"];
+
+  const [selectedItems, setSelectedItems] = React.useState<string[]>([]);
+
+  const isSelected = (value: string) => {
+    return selectedItems.some((selected) => selected === value);
+  };
+
+  const handleValueChange = (value: string) => {
+    setSelectedItems([value]);
+  };
+
+  return (
+    <div className="text-white flex flex-col gap-2">
+      <h2>List of Fruits</h2>
+
+      {items.map((item, index) => (
+        <Checkbox
+          {...args}
+          key={index}
+          className="text-white"
+          color="primary"
+          isSelected={isSelected(item)}
+          onValueChange={() => handleValueChange(item)}
+        >
+          {item} {isSelected(item) ? "/ state: true" : "/ state: false"}
+        </Checkbox>
+      ))}
+    </div>
+  );
+};
+
+const WithReactHookFormTemplate = (args: CheckboxProps) => {
+  const {
+    register,
+    formState: {errors},
+    handleSubmit,
+  } = useForm();
+
+  const onSubmit = (data: any) => {
+    // eslint-disable-next-line no-console
+    console.log(data);
+    alert("Submitted value: " + data.example);
+  };
+
+  return (
+    <form className="flex flex-col gap-4" onSubmit={handleSubmit(onSubmit)}>
+      <Checkbox {...args} {...register("example", {required: true})} />
+      {errors.example && <span className="text-danger">This field is required</span>}
+      <button className={button({class: "w-fit"})} type="submit">
+        Submit
+      </button>
+    </form>
+  );
+};
+
 export const Default = {
   args: {
     ...defaultProps,
@@ -110,6 +169,22 @@ export const CustomIconNode = {
   },
 };
 
+export const Group = {
+  render: GroupTemplate,
+
+  args: {
+    ...defaultProps,
+  },
+};
+
+export const WithReactHookForm = {
+  render: WithReactHookFormTemplate,
+
+  args: {
+    ...defaultProps,
+  },
+};
+
 export const CustomIconFunction = {
   args: {
     ...defaultProps,

packages/components/chip/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/chip
 
+## 2.0.27
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/chip/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/chip",
-  "version": "2.0.26",
+  "version": "2.0.27",
   "description": "Chips help people enter information, make selections, filter content, or trigger actions.",
   "keywords": [
     "chip"

packages/components/code/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/code
 
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies [[`74eda3128`](https://github.com/nextui-org/nextui/commit/74eda312883b2e17df26f71442aba9fb3cd240be)]:
+  - @nextui-org/system-rsc@2.1.1
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/code/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/code",
-  "version": "2.0.25",
+  "version": "2.0.26",
   "description": "Code is a component used to display inline code.",
   "keywords": [
     "code"

packages/components/date-input/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/date-input
 
+## 2.0.2
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.1
 
 ### Patch Changes

packages/components/date-input/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/date-input",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "A date input allows users to enter and edit date and time values using a keyboard.",
   "keywords": [
     "date-field"

packages/components/date-picker/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @nextui-org/date-picker
 
+## 2.0.3
+
+### Patch Changes
+
+- [#2744](https://github.com/nextui-org/nextui/pull/2744) [`158c2aa00`](https://github.com/nextui-org/nextui/commit/158c2aa004f0080449321f84b0efd37762e8adc0) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Refactor calendar cell tab index, add calendar default width
+
+- Updated dependencies [[`158c2aa00`](https://github.com/nextui-org/nextui/commit/158c2aa004f0080449321f84b0efd37762e8adc0)]:
+  - @nextui-org/calendar@2.0.2
+  - @nextui-org/button@2.0.29
+  - @nextui-org/date-input@2.0.2
+  - @nextui-org/popover@2.1.17
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.2
 
 ### Patch Changes

packages/components/date-picker/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/date-picker",
-  "version": "2.0.2",
+  "version": "2.0.3",
   "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"

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

@@ -12,8 +12,7 @@ import {CalendarBoldIcon} from "@nextui-org/shared-icons";
 
 import {UseDatePickerProps, useDatePicker} from "./use-date-picker";
 
-export interface Props<T extends DateValue>
-  extends Omit<UseDatePickerProps<T>, "hasMultipleMonths"> {}
+export interface Props<T extends DateValue> extends UseDatePickerProps<T> {}
 
 function DatePicker<T extends DateValue>(props: Props<T>, ref: ForwardedRef<HTMLDivElement>) {
   const {

packages/components/date-picker/src/date-range-picker.tsx

@@ -13,8 +13,7 @@ import {CalendarBoldIcon} from "@nextui-org/shared-icons";
 import DateRangePickerField from "./date-range-picker-field";
 import {UseDateRangePickerProps, useDateRangePicker} from "./use-date-range-picker";
 
-export interface Props<T extends DateValue>
-  extends Omit<UseDateRangePickerProps<T>, "hasMultipleMonths"> {}
+export interface Props<T extends DateValue> extends UseDateRangePickerProps<T> {}
 
 function DateRangePicker<T extends DateValue>(props: Props<T>, ref: ForwardedRef<HTMLDivElement>) {
   const {

packages/components/date-picker/src/use-date-picker-base.ts

@@ -236,18 +236,8 @@ export function useDatePickerBase<T extends DateValue>(originalProps: UseDatePic
 
   const calendarProps = {
     ...slotsProps.calendarProps,
+    calendarWidth,
     "data-slot": "calendar",
-    "data-has-multiple-months": dataAttr(hasMultipleMonths),
-    style: mergeProps(
-      hasMultipleMonths
-        ? {
-            // @ts-ignore
-            "--visible-months": visibleMonths,
-          }
-        : {},
-      {"--calendar-width": `${calendarWidth}px`},
-      slotsProps.calendarProps.style,
-    ),
   } as CalendarProps;
 
   const selectorButtonProps = {

packages/components/date-picker/src/use-date-picker.ts

@@ -59,7 +59,6 @@ export function useDatePicker<T extends DateValue>({
     endContent,
     selectorIcon,
     createCalendar,
-    hasMultipleMonths,
     isCalendarHeaderExpanded,
     disableAnimation,
     CalendarTopContent,
@@ -88,10 +87,9 @@ export function useDatePicker<T extends DateValue>({
     () =>
       datePicker({
         ...variantProps,
-        hasMultipleMonths,
         className,
       }),
-    [objectToDeps(variantProps), hasMultipleMonths, className],
+    [objectToDeps(variantProps), className],
   );
 
   let {

packages/components/date-picker/src/use-date-range-picker.ts

@@ -116,10 +116,9 @@ export function useDateRangePicker<T extends DateValue>({
     () =>
       dateRangePicker({
         ...variantProps,
-        hasMultipleMonths,
         className,
       }),
-    [objectToDeps(variantProps), hasMultipleMonths, className],
+    [objectToDeps(variantProps), className],
   );
 
   // Time field values
@@ -258,7 +257,7 @@ export function useDateRangePicker<T extends DateValue>({
         labelPlacement,
         className,
       }),
-    [objectToDeps(variantProps), hasMultipleMonths, className],
+    [objectToDeps(variantProps), className],
   );
 
   const getStartDateInputProps = (props: DOMAttributes = {}) => {

packages/components/divider/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/divider
 
+## 2.0.27
+
+### Patch Changes
+
+- Updated dependencies [[`74eda3128`](https://github.com/nextui-org/nextui/commit/74eda312883b2e17df26f71442aba9fb3cd240be)]:
+  - @nextui-org/system-rsc@2.1.1
+  - @nextui-org/react-rsc-utils@2.0.12
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/divider/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/divider",
-  "version": "2.0.26",
+  "version": "2.0.27",
   "description": ". A separator is a visual divider between two groups of content",
   "keywords": [
     "divider"

packages/components/dropdown/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @nextui-org/dropdown
 
+## 2.1.19
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/menu@2.0.19
+  - @nextui-org/popover@2.1.17
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.1.18
 
 ### Patch Changes

packages/components/dropdown/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/dropdown",
-  "version": "2.1.18",
+  "version": "2.1.19",
   "description": "A dropdown displays a list of actions or options that a user can choose.",
   "keywords": [
     "dropdown"

packages/components/image/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/image
 
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/image/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/image",
-  "version": "2.0.25",
+  "version": "2.0.26",
   "description": "A simple image component",
   "keywords": [
     "image"

packages/components/input/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/input
 
+## 2.1.19
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.1.18
 
 ### Patch Changes

packages/components/input/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/input",
-  "version": "2.1.18",
+  "version": "2.1.19",
   "description": "The input component is designed for capturing user input within a text field.",
   "keywords": [
     "input"

packages/components/kbd/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/kbd
 
+## 2.0.27
+
+### Patch Changes
+
+- Updated dependencies [[`74eda3128`](https://github.com/nextui-org/nextui/commit/74eda312883b2e17df26f71442aba9fb3cd240be)]:
+  - @nextui-org/system-rsc@2.1.1
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/kbd/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/kbd",
-  "version": "2.0.26",
+  "version": "2.0.27",
   "description": "The keyboard key components indicates which key or set of keys used to execute a specificv  action",
   "keywords": [
     "kbd"

packages/components/link/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/link
 
+## 2.0.28
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.27
 
 ### Patch Changes

packages/components/link/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/link",
-  "version": "2.0.27",
+  "version": "2.0.28",
   "description": "Links allow users to click their way from page to page. This component is styled to resemble a hyperlink and semantically renders an <a>",
   "keywords": [
     "link"

packages/components/listbox/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @nextui-org/listbox
 
+## 2.1.18
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/aria-utils@2.0.17
+  - @nextui-org/divider@2.0.27
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.1.17
 
 ### Patch Changes

packages/components/listbox/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/listbox",
-  "version": "2.1.17",
+  "version": "2.1.18",
   "description": "A listbox displays a list of options and allows a user to select one or more of them.",
   "keywords": [
     "listbox"

packages/components/menu/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @nextui-org/menu
 
+## 2.0.19
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/aria-utils@2.0.17
+  - @nextui-org/divider@2.0.27
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.18
 
 ### Patch Changes

packages/components/menu/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/menu",
-  "version": "2.0.18",
+  "version": "2.0.19",
   "description": "A menu displays a list of options and allows a user to select one or more of them.",
   "keywords": [
     "menu"

packages/components/modal/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/modal
 
+## 2.0.32
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/framer-utils@2.0.17
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.31
 
 ### Patch Changes

packages/components/modal/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/modal",
-  "version": "2.0.31",
+  "version": "2.0.32",
   "description": "Displays a dialog with a custom content that requires attention or provides additional information.",
   "keywords": [
     "modal"

packages/components/navbar/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/navbar
 
+## 2.0.29
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/framer-utils@2.0.17
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.28
 
 ### Patch Changes

packages/components/navbar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/navbar",
-  "version": "2.0.28",
+  "version": "2.0.29",
   "description": "A responsive navigation header positioned on top side of your page that includes support for branding, links, navigation, collapse and more.",
   "keywords": [
     "navbar"

packages/components/pagination/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/pagination
 
+## 2.0.29
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.28
 
 ### Patch Changes

packages/components/pagination/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/pagination",
-  "version": "2.0.28",
+  "version": "2.0.29",
   "description": "The Pagination component allows you to display active page and navigate between multiple pages.",
   "keywords": [
     "pagination"

packages/components/popover/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @nextui-org/popover
 
+## 2.1.17
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/button@2.0.29
+  - @nextui-org/aria-utils@2.0.17
+  - @nextui-org/framer-utils@2.0.17
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.1.16
 
 ### Patch Changes

packages/components/popover/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/popover",
-  "version": "2.1.16",
+  "version": "2.1.17",
   "description": "A popover is an overlay element positioned relative to a trigger.",
   "keywords": [
     "popover"

packages/components/progress/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/progress
 
+## 2.0.27
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/progress/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/progress",
-  "version": "2.0.26",
+  "version": "2.0.27",
   "description": "Progress bars show either determinate or indeterminate progress of an operation over time.",
   "keywords": [
     "progress"

packages/components/radio/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @nextui-org/radio
 
+## 2.0.27
+
+### Patch Changes
+
+- [#2761](https://github.com/nextui-org/nextui/pull/2761) [`f728c0542`](https://github.com/nextui-org/nextui/commit/f728c0542c1f63398aa2fee4c7f2dedaf16ca185) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #2759 non-react props omitted from radio group component
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/radio/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/radio",
-  "version": "2.0.26",
+  "version": "2.0.27",
   "description": "Radios allow users to select a single option from a list of mutually exclusive options.",
   "keywords": [
     "radio"

packages/components/radio/src/use-radio-group.ts

@@ -8,7 +8,7 @@ import {useCallback, useMemo} from "react";
 import {RadioGroupState, useRadioGroupState} from "@react-stately/radio";
 import {useRadioGroup as useReactAriaRadioGroup} from "@react-aria/radio";
 import {HTMLNextUIProps, PropGetter} from "@nextui-org/system";
-import {useDOMRef} from "@nextui-org/react-utils";
+import {filterDOMProps, useDOMRef} from "@nextui-org/react-utils";
 import {clsx, safeAriaLabel} from "@nextui-org/shared-utils";
 import {mergeProps} from "@react-aria/utils";
 
@@ -70,6 +70,8 @@ export function useRadioGroup(props: UseRadioGroupProps) {
     label,
     value,
     name,
+    isInvalid: isInvalidProp,
+    validationState,
     size = "md",
     color = "primary",
     isDisabled = false,
@@ -86,6 +88,7 @@ export function useRadioGroup(props: UseRadioGroupProps) {
   } = props;
 
   const Component = as || "div";
+  const shouldFilterDOMProps = typeof Component === "string";
 
   const domRef = useDOMRef(ref);
 
@@ -97,7 +100,7 @@ export function useRadioGroup(props: UseRadioGroupProps) {
       "aria-label": safeAriaLabel(otherProps["aria-label"], label),
       isRequired,
       isReadOnly,
-      isInvalid: props.validationState === "invalid" || props.isInvalid,
+      isInvalid: validationState === "invalid" || isInvalidProp,
       orientation,
       validationBehavior: "native",
       onChange: onValueChange,
@@ -109,8 +112,8 @@ export function useRadioGroup(props: UseRadioGroupProps) {
     label,
     isRequired,
     isReadOnly,
-    props.isInvalid,
-    props.validationState,
+    isInvalidProp,
+    validationState,
     orientation,
     onValueChange,
   ]);
@@ -127,7 +130,7 @@ export function useRadioGroup(props: UseRadioGroupProps) {
     validationDetails,
   } = useReactAriaRadioGroup(otherPropsWithOrientation, groupState);
 
-  const isInvalid = props.validationState === "invalid" || props.isInvalid || isAriaInvalid;
+  const isInvalid = otherPropsWithOrientation.isInvalid || isAriaInvalid;
 
   const context: ContextType = useMemo(
     () => ({
@@ -168,7 +171,12 @@ export function useRadioGroup(props: UseRadioGroupProps) {
     return {
       ref: domRef,
       className: slots.base({class: baseStyles}),
-      ...mergeProps(groupProps, otherProps),
+      ...mergeProps(
+        groupProps,
+        filterDOMProps(otherProps, {
+          enabled: shouldFilterDOMProps,
+        }),
+      ),
     };
   }, [domRef, slots, baseStyles, groupProps, otherProps]);
 

packages/components/ripple/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/ripple
 
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/ripple/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/ripple",
-  "version": "2.0.25",
+  "version": "2.0.26",
   "description": "A simple implementation to display a ripple animation when the source component is clicked",
   "keywords": [
     "ripple"

packages/components/scroll-shadow/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/scroll-shadow
 
+## 2.1.15
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.1.14
 
 ### Patch Changes

packages/components/scroll-shadow/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/scroll-shadow",
-  "version": "2.1.14",
+  "version": "2.1.15",
   "description": "A component that applies top and bottom shadows when content overflows on scroll.",
   "keywords": [
     "scroll-shadow"

packages/components/select/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @nextui-org/select
 
+## 2.1.23
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/listbox@2.1.18
+  - @nextui-org/popover@2.1.17
+  - @nextui-org/scroll-shadow@2.1.15
+  - @nextui-org/aria-utils@2.0.17
+  - @nextui-org/spinner@2.0.27
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.1.22
 
 ### Patch Changes

packages/components/select/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/select",
-  "version": "2.1.22",
+  "version": "2.1.23",
   "description": "A select displays a collapsible list of options and allows a user to select one of them.",
   "keywords": [
     "select"

packages/components/skeleton/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/skeleton
 
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies [[`74eda3128`](https://github.com/nextui-org/nextui/commit/74eda312883b2e17df26f71442aba9fb3cd240be)]:
+  - @nextui-org/system-rsc@2.1.1
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/skeleton/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/skeleton",
-  "version": "2.0.25",
+  "version": "2.0.26",
   "description": "Skeleton is used to display the loading state of some component.",
   "keywords": [
     "skeleton"

packages/components/slider/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/slider
 
+## 2.2.8
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/tooltip@2.0.32
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.2.7
 
 ### Patch Changes

packages/components/slider/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/slider",
-  "version": "2.2.7",
+  "version": "2.2.8",
   "description": "A slider allows a user to select one or more values within a range.",
   "keywords": [
     "slider"

packages/components/snippet/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @nextui-org/snippet
 
+## 2.0.33
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/button@2.0.29
+  - @nextui-org/tooltip@2.0.32
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.32
 
 ### Patch Changes

packages/components/snippet/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/snippet",
-  "version": "2.0.32",
+  "version": "2.0.33",
   "description": "Display a snippet of copyable code for the command line.",
   "keywords": [
     "snippet"

packages/components/spacer/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/spacer
 
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies [[`74eda3128`](https://github.com/nextui-org/nextui/commit/74eda312883b2e17df26f71442aba9fb3cd240be)]:
+  - @nextui-org/system-rsc@2.1.1
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/spacer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/spacer",
-  "version": "2.0.25",
+  "version": "2.0.26",
   "description": "A flexible spacer component designed to create consistent spacing and maintain alignment in your layout.",
   "keywords": [
     "spacer"

packages/components/spinner/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/spinner
 
+## 2.0.27
+
+### Patch Changes
+
+- Updated dependencies [[`74eda3128`](https://github.com/nextui-org/nextui/commit/74eda312883b2e17df26f71442aba9fb3cd240be)]:
+  - @nextui-org/system-rsc@2.1.1
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/spinner/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/spinner",
-  "version": "2.0.26",
+  "version": "2.0.27",
   "description": "Loaders express an unspecified wait time or display the length of a process.",
   "keywords": [
     "loading",

packages/components/switch/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/switch
 
+## 2.0.27
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/switch/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/switch",
-  "version": "2.0.26",
+  "version": "2.0.27",
   "description": "A switch is similar to a checkbox, but represents on/off values as opposed to selection.",
   "keywords": [
     "switch"

packages/components/table/CHANGELOG.md

@@ -1,5 +1,16 @@
 # @nextui-org/table
 
+## 2.0.30
+
+### Patch Changes
+
+- [#2747](https://github.com/nextui-org/nextui/pull/2747) [`2126ea186`](https://github.com/nextui-org/nextui/commit/2126ea186317e855bfb8f4a5ad326b4e65293466) Thanks [@ShrinidhiUpadhyaya](https://github.com/ShrinidhiUpadhyaya)! - Fixes adding of empty content at the bottom of the table when rows present in Table (#2742)
+
+- Updated dependencies [[`cadbb30cf`](https://github.com/nextui-org/nextui/commit/cadbb30cfb786d2b54e1cb46ea9319d4cb9ce590)]:
+  - @nextui-org/checkbox@2.0.27
+  - @nextui-org/spacer@2.0.26
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.29
 
 ### Patch Changes

packages/components/table/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/table",
-  "version": "2.0.29",
+  "version": "2.0.30",
   "description": "Tables are used to display tabular data using rows and columns. ",
   "keywords": [
     "table"

packages/components/table/src/table-body.tsx

@@ -121,7 +121,9 @@ const TableBody = forwardRef<"tbody", TableBodyProps>((props, ref) => {
         >
           {bodyProps.loadingContent}
         </td>
-        {!emptyContent && <td className={slots?.emptyWrapper({class: classNames?.emptyWrapper})} />}
+        {!emptyContent && collection.size === 0 ? (
+          <td className={slots?.emptyWrapper({class: classNames?.emptyWrapper})} />
+        ) : null}
       </tr>
     );
   }

packages/components/tabs/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @nextui-org/tabs
 
+## 2.0.28
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/aria-utils@2.0.17
+  - @nextui-org/framer-utils@2.0.17
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.27
 
 ### Patch Changes

packages/components/tabs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/tabs",
-  "version": "2.0.27",
+  "version": "2.0.28",
   "description": "Tabs organize content into multiple sections and allow users to navigate between them.",
   "keywords": [
     "tabs"

packages/components/tooltip/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @nextui-org/tooltip
 
+## 2.0.32
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/aria-utils@2.0.17
+  - @nextui-org/framer-utils@2.0.17
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.31
 
 ### Patch Changes

packages/components/tooltip/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/tooltip",
-  "version": "2.0.31",
+  "version": "2.0.32",
   "description": "A React Component for rendering dynamically positioned Tooltips",
   "keywords": [
     "tooltip"

packages/components/user/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @nextui-org/user
 
+## 2.0.27
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/avatar@2.0.26
+  - @nextui-org/react-utils@2.0.12
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/user/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/user",
-  "version": "2.0.26",
+  "version": "2.0.27",
   "description": "Flexible User Profile Component.",
   "keywords": [
     "user"

packages/core/react/CHANGELOG.md

@@ -1,5 +1,56 @@
 # @nextui-org/react
 
+## 2.3.2
+
+### Patch Changes
+
+- [#2758](https://github.com/nextui-org/nextui/pull/2758) [`74eda3128`](https://github.com/nextui-org/nextui/commit/74eda312883b2e17df26f71442aba9fb3cd240be) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Named exports for rsc packages, "use client;" directive added to "@nextui-org/react" package
+
+- Updated dependencies [[`74eda3128`](https://github.com/nextui-org/nextui/commit/74eda312883b2e17df26f71442aba9fb3cd240be), [`2126ea186`](https://github.com/nextui-org/nextui/commit/2126ea186317e855bfb8f4a5ad326b4e65293466), [`158c2aa00`](https://github.com/nextui-org/nextui/commit/158c2aa004f0080449321f84b0efd37762e8adc0), [`f728c0542`](https://github.com/nextui-org/nextui/commit/f728c0542c1f63398aa2fee4c7f2dedaf16ca185), [`cadbb30cf`](https://github.com/nextui-org/nextui/commit/cadbb30cfb786d2b54e1cb46ea9319d4cb9ce590)]:
+  - @nextui-org/system@2.1.1
+  - @nextui-org/table@2.0.30
+  - @nextui-org/calendar@2.0.2
+  - @nextui-org/date-picker@2.0.3
+  - @nextui-org/theme@2.2.1
+  - @nextui-org/radio@2.0.27
+  - @nextui-org/checkbox@2.0.27
+  - @nextui-org/accordion@2.0.30
+  - @nextui-org/autocomplete@2.0.12
+  - @nextui-org/avatar@2.0.26
+  - @nextui-org/breadcrumbs@2.0.6
+  - @nextui-org/button@2.0.29
+  - @nextui-org/card@2.0.26
+  - @nextui-org/chip@2.0.27
+  - @nextui-org/date-input@2.0.2
+  - @nextui-org/dropdown@2.1.19
+  - @nextui-org/image@2.0.26
+  - @nextui-org/input@2.1.19
+  - @nextui-org/link@2.0.28
+  - @nextui-org/listbox@2.1.18
+  - @nextui-org/menu@2.0.19
+  - @nextui-org/modal@2.0.32
+  - @nextui-org/navbar@2.0.29
+  - @nextui-org/pagination@2.0.29
+  - @nextui-org/popover@2.1.17
+  - @nextui-org/progress@2.0.27
+  - @nextui-org/ripple@2.0.26
+  - @nextui-org/scroll-shadow@2.1.15
+  - @nextui-org/select@2.1.23
+  - @nextui-org/slider@2.2.8
+  - @nextui-org/snippet@2.0.33
+  - @nextui-org/switch@2.0.27
+  - @nextui-org/tabs@2.0.28
+  - @nextui-org/tooltip@2.0.32
+  - @nextui-org/user@2.0.27
+  - @nextui-org/framer-utils@2.0.17
+  - @nextui-org/badge@2.0.26
+  - @nextui-org/code@2.0.26
+  - @nextui-org/divider@2.0.27
+  - @nextui-org/kbd@2.0.27
+  - @nextui-org/skeleton@2.0.26
+  - @nextui-org/spacer@2.0.26
+  - @nextui-org/spinner@2.0.27
+
 ## 2.3.1
 
 ### Patch Changes