ci(changesets): version packages (#1940)

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

apps/docs/app/examples/perf/page.tsx

@@ -182,7 +182,9 @@ const MyButton2 = extendVariants(Button, {
       xl: "px-12 py-6 text-xl",
     },
   },
-  defaultVariants: {},
+  defaultVariants: {
+    color: "foreground",
+  },
 });
 
 const usersData = [
@@ -544,7 +546,7 @@ export default function NextUIPerf() {
 
       <Button>Click Me!</Button>
 
-      <MyButton2 color="foreground">Press Me!</MyButton2>
+      <MyButton2 color="primary">Press Me!</MyButton2>
 
       <Pagination
         showControls

apps/docs/content/components/textarea/disable-autosize.ts

@@ -0,0 +1,25 @@
+const App = `import {Textarea} from "@nextui-org/react";
+
+export default function App() {
+  return (
+    <Textarea
+      label="Description"
+      variant="bordered"
+      placeholder="Enter your description"
+      disableAnimation
+      disableAutosize
+      classNames={{
+        base: "max-w-xs",
+        input: "resize-y min-h-[40px]",
+      }}
+    />
+  );
+}`;
+
+const react = {
+  "/App.jsx": App,
+};
+
+export default {
+  ...react,
+};

apps/docs/content/components/textarea/index.ts

@@ -7,6 +7,7 @@ import variants from "./variants";
 import errorMessage from "./error-message";
 import description from "./description";
 import controlled from "./controlled";
+import disableAutosize from "./disable-autosize";
 
 export const textareaContent = {
   usage,
@@ -18,4 +19,5 @@ export const textareaContent = {
   errorMessage,
   description,
   controlled,
+  disableAutosize,
 };

apps/docs/content/docs/components/autocomplete.mdx

@@ -426,7 +426,8 @@ properties to customize the popover, listbox and input components.
 | scrollShadowProps           | [ScrollShadowProps](/docs/components/scroll-shadow#api)                                                                               | Props to be passed to the ScrollShadow component.                                                                                                             | -                        |
 | selectorButtonProps         | [ButtonProps](/docs/components/button#api)                                                                                            | Props to be passed to the selector button.                                                                                                                    | -                        |
 | clearButtonProps            | [ButtonProps](/docs/components/button#api)                                                                                            | Props to be passed to the clear button.                                                                                                                       | -                        |
-| disableClearable            | `boolean`                                                                                                                             | Whether the clear button should be hidden.                                                                                                                    | `false`                  |
+| isClearable                 | `boolean`                                                                                                                             | Whether the clear button should be shown.                                                                                                                     | `true`                   |
+| disableClearable            | `boolean`                                                                                                                             | Whether the clear button should be hidden. (**Deprecated**) Use `isClearable` instead.                                                                        | `false`                  |
 | disableAnimation            | `boolean`                                                                                                                             | Whether the Autocomplete should be animated.                                                                                                                  | `true`                   |
 | disableSelectorIconRotation | `boolean`                                                                                                                             | Whether the select should disable the rotation of the selector icon.                                                                                          | `false`                  |
 | classNames                  | `Record<"base"｜ "listboxWrapper"｜ "listbox"｜ "popoverContent" ｜ "endContentWrapper"｜ "clearButton" ｜ "selectorButton", string>` | Allows to set custom class names for the Autocomplete slots.                                                                                                  | -                        |

apps/docs/content/docs/components/breadcrumbs.mdx

@@ -20,7 +20,7 @@ Breadcrumbs display a hierarchy of links to the current page or resource in an a
 NextUI exports 2 breadcrumb-related components:
 
 - **Breadcumbs**: The main component, which is a wrapper for the other components.
-- **BreadcrumItem**: The component that represents a breadcrumb item.
+- **BreadcrumbItem**: The component that represents a breadcrumb item.
 
 <ImportTabs
   commands={{

apps/docs/content/docs/components/dropdown.mdx

@@ -336,15 +336,16 @@ you to customize each item individually.
 
 ### DropdownSection Props
 
-| Attribute    | Type                                                                                                   | Description                                                                                 | Default |
-| ------------ | ------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------- | ------- |
-| children\*   | `ReactNode`                                                                                            | The contents of the dropdown section. Usually a list of `DropdownItem` components. (static) | -       |
-| title        | `string`                                                                                               | The title of the dropdown section.                                                          | -       |
-| items        | [`Iterable<T>`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols) | Item objects in the collection. (dynamic)                                                   | -       |
-| showDivider  | `boolean`                                                                                              | Whether to show the divider between the groups.                                             | `false` |
-| DividerProps | [DividerProps](/docs/components/divider)                                                               | The divider component props.                                                                | -       |
-| classNames   | `Record<"base"｜ "heading"｜ "group"｜ "divider", string>`                                             | Allows to set custom class names for the dropdown section slots.                            | -       |
-| itemClasses  | `Record<"base"｜ "wrapper"｜ "title"｜ "description"｜ "shortcut" ｜ "selectedIcon", string>`          | Allows to set custom class names for the dropdown item slots.                               | -       |
+| Attribute        | Type                                                                                                   | Description                                                                                 | Default |
+| ---------------- | ------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------- | ------- |
+| children\*       | `ReactNode`                                                                                            | The contents of the dropdown section. Usually a list of `DropdownItem` components. (static) | -       |
+| title            | `string`                                                                                               | The title of the dropdown section.                                                          | -       |
+| items            | [`Iterable<T>`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols) | Item objects in the collection. (dynamic)                                                   | -       |
+| hideSelectedIcon | `boolean`                                                                                              | Whether to hide the check icon when the items are selected.                                 | `false` |
+| showDivider      | `boolean`                                                                                              | Whether to show the divider between the groups.                                             | `false` |
+| DividerProps     | [DividerProps](/docs/components/divider)                                                               | The divider component props.                                                                | -       |
+| classNames       | `Record<"base"｜ "heading"｜ "group"｜ "divider", string>`                                             | Allows to set custom class names for the dropdown section slots.                            | -       |
+| itemClasses      | `Record<"base"｜ "wrapper"｜ "title"｜ "description"｜ "shortcut" ｜ "selectedIcon", string>`          | Allows to set custom class names for the dropdown item slots.                               | -       |
 
 ---
 

apps/docs/content/docs/components/listbox.mdx

@@ -262,15 +262,16 @@ You can customize the `Listbox` items style by using the `itemClasses` prop and
 
 ### ListboxSection Props
 
-| Attribute    | Type                                                                                                   | Description                                                                               | Default |
-| ------------ | ------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------- | ------- |
-| children\*   | `ReactNode`                                                                                            | The contents of the listbox section. Usually a list of `ListboxItem` components. (static) | -       |
-| title        | `string`                                                                                               | The title of the listbox section.                                                         | -       |
-| items        | [`Iterable<T>`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols) | Item objects in the collection. (dynamic)                                                 | -       |
-| showDivider  | `boolean`                                                                                              | Whether to show the divider between the groups.                                           | `false` |
-| DividerProps | [DividerProps](/docs/components/divider)                                                               | The divider component props.                                                              | -       |
-| classNames   | `Record<"base"｜ "heading"｜ "group"｜ "divider", string>`                                             | Allows to set custom class names for the listbox section slots.                           | -       |
-| itemClasses  | `Record<"base"｜ "wrapper"｜ "title"｜ "description"｜ "shortcut" ｜ "selectedIcon", string>`          | Allows to set custom class names for the listbox item slots.                              | -       |
+| Attribute        | Type                                                                                                   | Description                                                                               | Default |
+| ---------------- | ------------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------- | ------- |
+| children\*       | `ReactNode`                                                                                            | The contents of the listbox section. Usually a list of `ListboxItem` components. (static) | -       |
+| title            | `string`                                                                                               | The title of the listbox section.                                                         | -       |
+| items            | [`Iterable<T>`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Iteration_protocols) | Item objects in the collection. (dynamic)                                                 | -       |
+| hideSelectedIcon | `boolean`                                                                                              | Whether to hide the check icon when the items are selected.                               | `false` |
+| showDivider      | `boolean`                                                                                              | Whether to show the divider between the groups.                                           | `false` |
+| DividerProps     | [DividerProps](/docs/components/divider)                                                               | The divider component props.                                                              | -       |
+| classNames       | `Record<"base"｜ "heading"｜ "group"｜ "divider", string>`                                             | Allows to set custom class names for the listbox section slots.                           | -       |
+| itemClasses      | `Record<"base"｜ "wrapper"｜ "title"｜ "description"｜ "shortcut" ｜ "selectedIcon", string>`          | Allows to set custom class names for the listbox item slots.                              | -       |
 
 ---
 

apps/docs/content/docs/components/textarea.mdx

@@ -50,6 +50,12 @@ it using the `minRows` and `maxRows` properties. It is based on [react-textarea-
 
 <CodeDemo title="Autosize" files={textareaContent.autosize} />
 
+### Without Autosize
+
+In case you want to disable the autosize feature, you can use the `disableAutosize` property.
+
+<CodeDemo title="Without Autosize" files={textareaContent.disableAutosize} />
+
 ### Variants
 
 <CodeDemo title="Variants" files={textareaContent.variants} />
@@ -119,38 +125,40 @@ You can use the `value` and `onValueChange` properties to control the input valu
 
 ### Textarea Props
 
-| Attribute         | Type                                                                                             | Description                                                                                                              | Default   |
-| ----------------- | ------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------ | --------- |
-| children          | `ReactNode`                                                                                      | The content of the textarea.                                                                                             | -         |
-| minRows           | `number`                                                                                         | The minimum number of rows to display.                                                                                   | `3`       |
-| maxRows           | `number`                                                                                         | Maximum number of rows up to which the textarea can grow.                                                                | `8`       |
-| cacheMeasurements | `boolean`                                                                                        | Reuse previously computed measurements when computing height of textarea.                                                | `false`   |
-| variant           | `flat` \| `bordered` \| `faded` \| `underlined`                                                  | The variant of the textarea.                                                                                             | `flat`    |
-| color             | `default` \| `primary` \| `secondary` \| `success` \| `warning` \| `danger`                      | The color of the textarea.                                                                                               | `default` |
-| size              | `sm`\|`md`\|`lg`                                                                                 | The size of the textarea.                                                                                                | `md`      |
-| radius            | `none` \| `sm` \| `md` \| `lg` \| `full`                                                         | The radius of the textarea.                                                                                              | -         |
-| label             | `ReactNode`                                                                                      | The content to display as the label.                                                                                     | -         |
-| value             | `string`                                                                                         | The current value of the textarea (controlled).                                                                          | -         |
-| defaultValue      | `string`                                                                                         | The default value of the textarea (uncontrolled).                                                                        | -         |
-| placeholder       | `string`                                                                                         | The placeholder of the textarea.                                                                                         | -         |
-| description       | `ReactNode`                                                                                      | A description for the textarea. Provides a hint such as specific requirements for what to choose.                        | -         |
-| errorMessage      | `ReactNode`                                                                                      | An error message for the textarea.                                                                                       | -         |
-| labelPlacement    | `inside` \| `outside` \| `outside-left`                                                          | The position of the label.                                                                                               | `inside`  |
-| fullWidth         | `boolean`                                                                                        | Whether the textarea should take up the width of its parent.                                                             | `true`    |
-| isRequired        | `boolean`                                                                                        | Whether user input is required on the textarea before form submission.                                                   | `false`   |
-| isReadOnly        | `boolean`                                                                                        | Whether the textarea can be selected but not changed by the user.                                                        |           |
-| isDisabled        | `boolean`                                                                                        | Whether the textarea is disabled.                                                                                        | `false`   |
-| isInvalid         | `boolean`                                                                                        | Whether the textarea is invalid.                                                                                         | `false`   |
-| validationState   | `valid` \| `invalid`                                                                             | Whether the textarea should display its "valid" or "invalid" visual styling. (**Deprecated**) use **isInvalid** instead. | -         |
-| disableAutosize   | `boolean`                                                                                        | Whether the textarea auto vertically resize should be disabled.                                                          | `false`   |
-| disableAnimation  | `boolean`                                                                                        | Whether the textarea should be animated.                                                                                 | `false`   |
-| classNames        | `Record<"base"｜ "label"｜ "inputWrapper"｜ "input" ｜ "description" ｜ "errorMessage", string>` | Allows to set custom class names for the checkbox slots.                                                                 | -         |
+| Attribute         | Type                                                                                                               | Description                                                                                                              | Default   |
+| ----------------- | ------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------ | --------- |
+| children          | `ReactNode`                                                                                                        | The content of the textarea.                                                                                             | -         |
+| minRows           | `number`                                                                                                           | The minimum number of rows to display.                                                                                   | `3`       |
+| maxRows           | `number`                                                                                                           | Maximum number of rows up to which the textarea can grow.                                                                | `8`       |
+| cacheMeasurements | `boolean`                                                                                                          | Reuse previously computed measurements when computing height of textarea.                                                | `false`   |
+| variant           | `flat` \| `bordered` \| `faded` \| `underlined`                                                                    | The variant of the textarea.                                                                                             | `flat`    |
+| color             | `default` \| `primary` \| `secondary` \| `success` \| `warning` \| `danger`                                        | The color of the textarea.                                                                                               | `default` |
+| size              | `sm`\|`md`\|`lg`                                                                                                   | The size of the textarea.                                                                                                | `md`      |
+| radius            | `none` \| `sm` \| `md` \| `lg` \| `full`                                                                           | The radius of the textarea.                                                                                              | -         |
+| label             | `ReactNode`                                                                                                        | The content to display as the label.                                                                                     | -         |
+| value             | `string`                                                                                                           | The current value of the textarea (controlled).                                                                          | -         |
+| defaultValue      | `string`                                                                                                           | The default value of the textarea (uncontrolled).                                                                        | -         |
+| placeholder       | `string`                                                                                                           | The placeholder of the textarea.                                                                                         | -         |
+| startContent      | `ReactNode`                                                                                                        | Element to be rendered in the left side of the input.                                                                    | -         |
+| endContent        | `ReactNode`                                                                                                        | Element to be rendered in the right side of the input.                                                                   | -         |
+| description       | `ReactNode`                                                                                                        | A description for the textarea. Provides a hint such as specific requirements for what to choose.                        | -         |
+| errorMessage      | `ReactNode`                                                                                                        | An error message for the textarea.                                                                                       | -         |
+| labelPlacement    | `inside` \| `outside` \| `outside-left`                                                                            | The position of the label.                                                                                               | `inside`  |
+| fullWidth         | `boolean`                                                                                                          | Whether the textarea should take up the width of its parent.                                                             | `true`    |
+| isRequired        | `boolean`                                                                                                          | Whether user input is required on the textarea before form submission.                                                   | `false`   |
+| isReadOnly        | `boolean`                                                                                                          | Whether the textarea can be selected but not changed by the user.                                                        |           |
+| isDisabled        | `boolean`                                                                                                          | Whether the textarea is disabled.                                                                                        | `false`   |
+| isInvalid         | `boolean`                                                                                                          | Whether the textarea is invalid.                                                                                         | `false`   |
+| validationState   | `valid` \| `invalid`                                                                                               | Whether the textarea should display its "valid" or "invalid" visual styling. (**Deprecated**) use **isInvalid** instead. | -         |
+| disableAutosize   | `boolean`                                                                                                          | Whether the textarea auto vertically resize should be disabled.                                                          | `false`   |
+| disableAnimation  | `boolean`                                                                                                          | Whether the textarea should be animated.                                                                                 | `false`   |
+| classNames        | `Record<"base"｜ "label"｜ "inputWrapper"｜ "innerWrapper" ｜ "input" ｜ "description" ｜ "errorMessage", string>` | Allows to set custom class names for the checkbox slots.                                                                 | -         |
 
 ### Input Events
 
-| Attribute      | Type                                   | Description                                                                                                                         |
-| -------------- | -------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- |
-| onChange       | `React.ChangeEvent <HTMLInputElement>` | Handler that is called when the element's value changes. You can pull out the new value by accessing `event.target.value` (string). |
-| onValueChange  | `(value: string) => void`              | Handler that is called when the element's value changes.                                                                            |
-| onClear        | `() => void`                           | Handler that is called when the clear button is clicked.                                                                            |
-| onHeightChange | `(height: number) => void`             | Handler that is called when the height of the textarea changes.                                                                     |
+| Attribute      | Type                                                    | Description                                                                                                                         |
+| -------------- | ------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- |
+| onChange       | `React.ChangeEvent <HTMLInputElement>`                  | Handler that is called when the element's value changes. You can pull out the new value by accessing `event.target.value` (string). |
+| onValueChange  | `(value: string) => void`                               | Handler that is called when the element's value changes.                                                                            |
+| onClear        | `() => void`                                            | Handler that is called when the clear button is clicked.                                                                            |
+| onHeightChange | `(height: number, meta: { rowHeight: number }) => void` | Handler that is called when the height of the textarea changes.                                                                     |

packages/components/accordion/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @nextui-org/accordion
 
+## 2.0.28
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/divider@2.0.25
+  - @nextui-org/aria-utils@2.0.15
+  - @nextui-org/framer-transitions@2.0.15
+
+## 2.0.27
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+  - @nextui-org/divider@2.0.24
+  - @nextui-org/aria-utils@2.0.14
+  - @nextui-org/framer-transitions@2.0.14
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/accordion/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/accordion",
-  "version": "2.0.26",
+  "version": "2.0.28",
   "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,68 @@
 # @nextui-org/autocomplete
 
+## 2.0.9
+
+### Patch Changes
+
+- [#1948](https://github.com/nextui-org/nextui/pull/1948) [`aab1dbf77`](https://github.com/nextui-org/nextui/commit/aab1dbf77cee29375bf958e44bdf1d6da037cf1f) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Autocomplete Reference aims to input instead of aiming to the wrapper element
+
+- Updated dependencies []:
+  - @nextui-org/button@2.0.26
+  - @nextui-org/input@2.1.16
+  - @nextui-org/listbox@2.1.16
+  - @nextui-org/popover@2.1.14
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/spinner@2.0.24
+  - @nextui-org/aria-utils@2.0.15
+
+## 2.0.8
+
+### Patch Changes
+
+- Updated dependencies [[`d2bd008ba`](https://github.com/nextui-org/nextui/commit/d2bd008ba3d4de73f4405f1997b15466efd19a81)]:
+  - @nextui-org/input@2.1.16
+  - @nextui-org/popover@2.1.13
+
+## 2.0.7
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+  - @nextui-org/input@2.1.15
+  - @nextui-org/button@2.0.25
+  - @nextui-org/listbox@2.1.15
+  - @nextui-org/popover@2.1.13
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/spinner@2.0.23
+  - @nextui-org/aria-utils@2.0.14
+
+## 2.0.6
+
+### Patch Changes
+
+- Updated dependencies [[`135cc21e6`](https://github.com/nextui-org/nextui/commit/135cc21e6f0f2bee1f19e7e5799b6cea8179b7f5)]:
+  - @nextui-org/listbox@2.1.14
+  - @nextui-org/button@2.0.24
+  - @nextui-org/input@2.1.14
+  - @nextui-org/popover@2.1.12
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/spinner@2.0.22
+
+## 2.0.5
+
+### Patch Changes
+
+- [#1902](https://github.com/nextui-org/nextui/pull/1902) [`85a820eef`](https://github.com/nextui-org/nextui/commit/85a820eeffe5df87e7622b0983788eb50adafe20) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1893, `endContent` prop fixed.
+
+- Updated dependencies [[`6a6d426b1`](https://github.com/nextui-org/nextui/commit/6a6d426b10fa7f92dfb20611e261347027393193)]:
+  - @nextui-org/input@2.1.14
+  - @nextui-org/popover@2.1.12
+  - @nextui-org/button@2.0.24
+  - @nextui-org/listbox@2.1.13
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/spinner@2.0.22
+
 ## 2.0.4
 
 ### Patch Changes

packages/components/autocomplete/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/autocomplete",
-  "version": "2.0.4",
+  "version": "2.0.9",
   "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/autocomplete/src/autocomplete.tsx

@@ -20,6 +20,7 @@ function Autocomplete<T extends object>(props: Props<T>, ref: ForwardedRef<HTMLI
     disableAnimation,
     selectorIcon = <ChevronDownIcon />,
     clearIcon = <CloseIcon />,
+    endContent,
     getBaseProps,
     getSelectorButtonProps,
     getInputProps,
@@ -44,7 +45,7 @@ function Autocomplete<T extends object>(props: Props<T>, ref: ForwardedRef<HTMLI
         {...getInputProps()}
         endContent={
           <div {...getEndContentWrapperProps()}>
-            <Button {...getClearButtonProps()}>{clearIcon}</Button>
+            {endContent || <Button {...getClearButtonProps()}>{clearIcon}</Button>}
             <Button {...getSelectorButtonProps()}>{selectorIcon}</Button>
           </div>
         }

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

@@ -64,6 +64,12 @@ interface Props<T> extends Omit<HTMLNextUIProps<"input">, keyof ComboBoxProps<T>
    * @default { disableAnimation: false }
    */
   inputProps?: Partial<InputProps>;
+  /**
+   * Whether the clear button should be hidden.
+   * @default false
+   * @deprecated Use `isClearable` instead.
+   */
+  disableClearable?: boolean;
   /**
    * Props to be passed to the selector button component.
    * @default { size: "sm", variant: "light", radius: "full", isIconOnly: true }
@@ -104,7 +110,7 @@ interface Props<T> extends Omit<HTMLNextUIProps<"input">, keyof ComboBoxProps<T>
 }
 
 export type UseAutocompleteProps<T> = Props<T> &
-  Omit<InputProps, "children" | "value" | "defaultValue" | "classNames"> &
+  Omit<InputProps, "children" | "value" | "isClearable" | "defaultValue" | "classNames"> &
   ComboBoxProps<T> &
   AsyncLoadable &
   AutocompleteVariantProps;
@@ -113,6 +119,12 @@ export function useAutocomplete<T extends object>(originalProps: UseAutocomplete
   const [props, variantProps] = mapPropsVariants(originalProps, autocomplete.variantKeys);
   const disableAnimation = originalProps.disableAnimation ?? false;
 
+  // TODO: Remove disableClearable prop in the next minor release.
+  const isClearable =
+    originalProps.disableClearable !== undefined
+      ? !originalProps.disableClearable
+      : originalProps.isClearable;
+
   const {
     ref,
     as,
@@ -127,6 +139,7 @@ export function useAutocomplete<T extends object>(originalProps: UseAutocomplete
     clearIcon,
     scrollRef: scrollRefProp,
     defaultFilter,
+    endContent,
     allowsEmptyCollection = true,
     shouldCloseOnBlur = true,
     popoverProps = {},
@@ -164,10 +177,10 @@ export function useAutocomplete<T extends object>(originalProps: UseAutocomplete
 
   // Setup refs and get props for child elements.
   const buttonRef = useRef<HTMLButtonElement>(null);
-  const inputRef = useRef<HTMLInputElement>(null);
   const inputWrapperRef = useRef<HTMLDivElement>(null);
   const listBoxRef = useRef<HTMLUListElement>(null);
   const popoverRef = useRef<HTMLDivElement>(null);
+  const inputRef = useDOMRef<HTMLInputElement>(ref);
   const scrollShadowRef = useDOMRef<HTMLElement>(scrollRefProp);
 
   const slotsProps: {
@@ -280,16 +293,15 @@ export function useAutocomplete<T extends object>(originalProps: UseAutocomplete
 
   const Component = as || "div";
 
-  const domRef = useDOMRef(ref);
-
   const slots = useMemo(
     () =>
       autocomplete({
         ...variantProps,
+        isClearable,
         disableAnimation,
         className,
       }),
-    [...Object.values(variantProps), disableAnimation, className],
+    [...Object.values(variantProps), isClearable, disableAnimation, className],
   );
 
   const onClear = useCallback(() => {
@@ -306,7 +318,6 @@ export function useAutocomplete<T extends object>(originalProps: UseAutocomplete
   );
 
   const getBaseProps: PropGetter = () => ({
-    ref: domRef,
     "data-invalid": dataAttr(originalProps?.isInvalid),
     "data-open": dataAttr(state.isOpen),
     className: slots.base({class: baseStyles}),
@@ -405,7 +416,7 @@ export function useAutocomplete<T extends object>(originalProps: UseAutocomplete
 
   return {
     Component,
-    domRef,
+    inputRef,
     label,
     state,
     slots,
@@ -413,6 +424,8 @@ export function useAutocomplete<T extends object>(originalProps: UseAutocomplete
     isLoading,
     clearIcon,
     isOpen,
+    endContent,
+    isClearable,
     disableAnimation,
     allowsCustomValue,
     selectorIcon,

packages/components/autocomplete/stories/autocomplete.stories.tsx

@@ -277,6 +277,20 @@ const StartContentTemplate = ({color, variant, ...args}: AutocompleteProps) => (
   </Autocomplete>
 );
 
+const EndContentTemplate = ({color, variant, ...args}: AutocompleteProps) => (
+  <Autocomplete
+    className="max-w-xs"
+    color={color}
+    defaultSelectedKey={"cat"}
+    endContent={<PetBoldIcon className="text-xl" />}
+    label="Favorite Animal"
+    variant={variant}
+    {...args}
+  >
+    {items}
+  </Autocomplete>
+);
+
 const DynamicTemplateWithDescriptions = ({color, variant, ...args}: AutocompleteProps<Animal>) => (
   <Autocomplete
     className="max-w-xs"
@@ -693,6 +707,14 @@ export const StartContent = {
   },
 };
 
+export const EndContent = {
+  render: EndContentTemplate,
+
+  args: {
+    ...defaultProps,
+  },
+};
+
 export const WithoutScrollShadow = {
   render: Template,
 

packages/components/badge/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/badge
 
+## 2.0.24
+
+### Patch Changes
+
+- Updated dependencies [[`a978687b0`](https://github.com/nextui-org/nextui/commit/a978687b0736d1e15943ef46628fc4fa0723ddc7)]:
+  - @nextui-org/system-rsc@2.0.11
+
+## 2.0.23
+
+### Patch Changes
+
+- Updated dependencies [[`6ecdc278a`](https://github.com/nextui-org/nextui/commit/6ecdc278aba927ee38a799679b8eb99cba99cab9)]:
+  - @nextui-org/system-rsc@2.0.10
+
 ## 2.0.22
 
 ### Patch Changes

packages/components/badge/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/badge",
-  "version": "2.0.22",
+  "version": "2.0.24",
   "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.4
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+
 ## 2.0.3
 
 ### Patch Changes

packages/components/breadcrumbs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/breadcrumbs",
-  "version": "2.0.3",
+  "version": "2.0.4",
   "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,21 @@
 # @nextui-org/button
 
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/ripple@2.0.24
+  - @nextui-org/spinner@2.0.24
+
+## 2.0.25
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/ripple@2.0.24
+  - @nextui-org/spinner@2.0.23
+
 ## 2.0.24
 
 ### Patch Changes

packages/components/button/package.json

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

packages/components/chip/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/chip
 
+## 2.0.25
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+
 ## 2.0.24
 
 ### Patch Changes

packages/components/chip/package.json

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

packages/components/code/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/code
 
+## 2.0.24
+
+### Patch Changes
+
+- Updated dependencies [[`a978687b0`](https://github.com/nextui-org/nextui/commit/a978687b0736d1e15943ef46628fc4fa0723ddc7)]:
+  - @nextui-org/system-rsc@2.0.11
+
+## 2.0.23
+
+### Patch Changes
+
+- Updated dependencies [[`6ecdc278a`](https://github.com/nextui-org/nextui/commit/6ecdc278aba927ee38a799679b8eb99cba99cab9)]:
+  - @nextui-org/system-rsc@2.0.10
+
 ## 2.0.22
 
 ### Patch Changes

packages/components/code/package.json

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

packages/components/divider/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/divider
 
+## 2.0.25
+
+### Patch Changes
+
+- Updated dependencies [[`a978687b0`](https://github.com/nextui-org/nextui/commit/a978687b0736d1e15943ef46628fc4fa0723ddc7)]:
+  - @nextui-org/system-rsc@2.0.11
+
+## 2.0.24
+
+### Patch Changes
+
+- Updated dependencies [[`6ecdc278a`](https://github.com/nextui-org/nextui/commit/6ecdc278aba927ee38a799679b8eb99cba99cab9)]:
+  - @nextui-org/system-rsc@2.0.10
+
 ## 2.0.23
 
 ### Patch Changes

packages/components/divider/package.json

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

packages/components/dropdown/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @nextui-org/dropdown
 
+## 2.1.16
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/menu@2.0.17
+  - @nextui-org/popover@2.1.14
+
+## 2.1.15
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/menu@2.0.16
+  - @nextui-org/popover@2.1.13
+
+## 2.1.14
+
+### Patch Changes
+
+- Updated dependencies [[`135cc21e6`](https://github.com/nextui-org/nextui/commit/135cc21e6f0f2bee1f19e7e5799b6cea8179b7f5)]:
+  - @nextui-org/menu@2.0.15
+  - @nextui-org/popover@2.1.12
+
 ## 2.1.13
 
 ### Patch Changes

packages/components/dropdown/package.json

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

packages/components/input/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @nextui-org/input
 
+## 2.1.16
+
+### Patch Changes
+
+- [#1928](https://github.com/nextui-org/nextui/pull/1928) [`d2bd008ba`](https://github.com/nextui-org/nextui/commit/d2bd008ba3d4de73f4405f1997b15466efd19a81) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Texarea label validation added to avoid rendering the element when there is no label.
+
+## 2.1.15
+
+### Patch Changes
+
+- [#1923](https://github.com/nextui-org/nextui/pull/1923) [`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Textarea style rounded full styles issues fixed, start and end content props added
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+
+## 2.1.14
+
+### Patch Changes
+
+- [#1901](https://github.com/nextui-org/nextui/pull/1901) [`6a6d426b1`](https://github.com/nextui-org/nextui/commit/6a6d426b10fa7f92dfb20611e261347027393193) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - - Label position changed for Select and Input, this avoids to break the layout when having long descriptions and no placeholder
+  - Input/Select styles improved, label opacity removed
+
 ## 2.1.13
 
 ### Patch Changes

packages/components/input/package.json

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

packages/components/input/src/input.tsx

@@ -16,8 +16,7 @@ const Input = forwardRef<"input", InputProps>((props, ref) => {
     endContent,
     labelPlacement,
     hasHelper,
-    isLabelOutside,
-    isLabelOutsideAsPlaceholder,
+    isOutsideLeft,
     shouldLabelBeOutside,
     errorMessage,
     getBaseProps,
@@ -86,7 +85,7 @@ const Input = forwardRef<"input", InputProps>((props, ref) => {
       return (
         <div {...getMainWrapperProps()}>
           <div {...getInputWrapperProps()}>
-            {isLabelOutsideAsPlaceholder ? labelContent : null}
+            {!isOutsideLeft ? labelContent : null}
             {innerWrapper}
           </div>
           {helperWrapper}
@@ -107,7 +106,6 @@ const Input = forwardRef<"input", InputProps>((props, ref) => {
     labelPlacement,
     helperWrapper,
     shouldLabelBeOutside,
-    isLabelOutsideAsPlaceholder,
     labelContent,
     innerWrapper,
     errorMessage,
@@ -120,7 +118,7 @@ const Input = forwardRef<"input", InputProps>((props, ref) => {
 
   return (
     <Component {...getBaseProps()}>
-      {isLabelOutside ? labelContent : null}
+      {isOutsideLeft ? labelContent : null}
       {mainWrapper}
     </Component>
   );

packages/components/input/src/textarea.tsx

@@ -1,7 +1,7 @@
 import {dataAttr} from "@nextui-org/shared-utils";
 import {forwardRef} from "@nextui-org/system";
 import {mergeProps} from "@react-aria/utils";
-import {useState} from "react";
+import {useMemo, useState} from "react";
 import TextareaAutosize from "react-textarea-autosize";
 
 import {UseInputProps, useInput} from "./use-input";
@@ -18,15 +18,13 @@ type OmittedInputProps =
   | "isClearButtonFocusVisible"
   | "isLabelPlaceholder"
   | "isClearable"
-  | "isTextarea"
-  | "startContent"
-  | "endContent";
+  | "isTextarea";
 
 export type TextareaHeightChangeMeta = {
   rowHeight: number;
 };
 
-export interface TextAreaProps extends Omit<UseInputProps, OmittedInputProps> {
+export interface TextAreaProps extends Omit<UseInputProps<HTMLTextAreaElement>, OmittedInputProps> {
   /**
    * Whether the textarea should automatically grow vertically to accomodate content.
    * @default false
@@ -75,23 +73,31 @@ const Textarea = forwardRef<"textarea", TextAreaProps>(
       Component,
       label,
       description,
+      startContent,
+      endContent,
+      hasHelper,
       shouldLabelBeOutside,
       shouldLabelBeInside,
       errorMessage,
       getBaseProps,
       getLabelProps,
       getInputProps,
+      getInnerWrapperProps,
       getInputWrapperProps,
       getHelperWrapperProps,
       getDescriptionProps,
       getErrorMessageProps,
     } = useInput<HTMLTextAreaElement>({...otherProps, ref, isMultiline: true});
 
+    const [hasMultipleRows, setIsHasMultipleRows] = useState(minRows > 1);
     const [isLimitReached, setIsLimitReached] = useState(false);
-    const labelContent = <label {...getLabelProps()}>{label}</label>;
+    const labelContent = label ? <label {...getLabelProps()}>{label}</label> : null;
     const inputProps = getInputProps();
 
     const handleHeightChange = (height: number, meta: TextareaHeightChangeMeta) => {
+      if (minRows === 1) {
+        setIsHasMultipleRows(height >= meta.rowHeight * 2);
+      }
       if (maxRows > minRows) {
         const limitReached = height >= maxRows * meta.rowHeight;
 
@@ -115,20 +121,36 @@ const Textarea = forwardRef<"textarea", TextAreaProps>(
       />
     );
 
+    const innerWrapper = useMemo(() => {
+      if (startContent || endContent) {
+        return (
+          <div {...getInnerWrapperProps()}>
+            {startContent}
+            {content}
+            {endContent}
+          </div>
+        );
+      }
+
+      return <div {...getInnerWrapperProps()}>{content}</div>;
+    }, [startContent, inputProps, endContent, getInnerWrapperProps]);
+
     return (
       <Component {...getBaseProps()}>
         {shouldLabelBeOutside ? labelContent : null}
-        <div {...getInputWrapperProps()}>
+        <div {...getInputWrapperProps()} data-has-multiple-rows={dataAttr(hasMultipleRows)}>
           {shouldLabelBeInside ? labelContent : null}
-          {content}
-        </div>
-        <div {...getHelperWrapperProps()}>
-          {errorMessage ? (
-            <div {...getErrorMessageProps()}>{errorMessage}</div>
-          ) : description ? (
-            <div {...getDescriptionProps()}>{description}</div>
-          ) : null}
+          {innerWrapper}
         </div>
+        {hasHelper ? (
+          <div {...getHelperWrapperProps()}>
+            {errorMessage ? (
+              <div {...getErrorMessageProps()}>{errorMessage}</div>
+            ) : description ? (
+              <div {...getDescriptionProps()}>{description}</div>
+            ) : null}
+          </div>
+        ) : null}
       </Component>
     );
   },

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

@@ -195,6 +195,7 @@ export function useInput<T extends HTMLInputElement | HTMLTextAreaElement = HTML
     ? (!domRef.current.value || domRef.current.value === "" || !inputValue || inputValue === "") &&
       hasPlaceholder
     : false;
+  const isOutsideLeft = labelPlacement === "outside-left";
 
   const hasStartContent = !!startContent;
   const isLabelOutside = shouldLabelBeOutside
@@ -445,6 +446,7 @@ export function useInput<T extends HTMLInputElement | HTMLTextAreaElement = HTML
     hasHelper,
     hasStartContent,
     isLabelOutside,
+    isOutsideLeft,
     isLabelOutsideAsPlaceholder,
     shouldLabelBeOutside,
     shouldLabelBeInside,

packages/components/input/stories/input.stories.tsx

@@ -150,17 +150,27 @@ const LabelPlacementTemplate = (args) => (
     <div className="flex flex-col gap-3">
       <h3>Without placeholder</h3>
       <div className="w-full max-w-xl flex flex-row items-end gap-4">
-        <Input {...args} />
-        <Input {...args} labelPlacement="outside" />
-        <Input {...args} labelPlacement="outside-left" />
+        <Input {...args} description="inside" />
+        <Input {...args} description="outside" labelPlacement="outside" />
+        <Input {...args} description="outside-left" labelPlacement="outside-left" />
       </div>
     </div>
     <div className="flex flex-col gap-3">
       <h3>With placeholder</h3>
       <div className="w-full max-w-xl flex flex-row items-end gap-4">
-        <Input {...args} placeholder="Enter your email" />
-        <Input {...args} labelPlacement="outside" placeholder="Enter your email" />
-        <Input {...args} labelPlacement="outside-left" placeholder="Enter your email" />
+        <Input {...args} description="inside" placeholder="Enter your email" />
+        <Input
+          {...args}
+          description="outside"
+          labelPlacement="outside"
+          placeholder="Enter your email"
+        />
+        <Input
+          {...args}
+          description="outside-left"
+          labelPlacement="outside-left"
+          placeholder="Enter your email"
+        />
       </div>
     </div>
   </div>

packages/components/input/stories/textarea.stories.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 import {Meta} from "@storybook/react";
 import {input} from "@nextui-org/theme";
+import {SendFilledIcon, PlusFilledIcon} from "@nextui-org/shared-icons";
 
 import {Textarea, TextAreaProps} from "../src";
 
@@ -71,6 +72,17 @@ const Template = (args: TextAreaProps) => (
   </div>
 );
 
+const ControlledTemplate = (args: TextAreaProps) => {
+  const [value, setValue] = React.useState("");
+
+  return (
+    <div className="w-full  flex-col gap-2 max-w-[440px]">
+      <Textarea {...args} value={value} onValueChange={setValue} />
+      <p className="text-default-500 text-small">Textarea value: {value}</p>
+    </div>
+  );
+};
+
 const MinRowsTemplate = (args: TextAreaProps) => (
   <div className="w-full max-w-xl flex flex-row gap-4">
     <Textarea {...args} description="Default minRows is 3" />
@@ -95,6 +107,23 @@ export const Default = {
   },
 };
 
+export const FullRounded = {
+  render: Template,
+
+  args: {
+    ...defaultProps,
+    minRows: 1,
+    label: null,
+    classNames: {
+      input: "py-1",
+    },
+    "aria-label": "Description",
+    placeholder: "Enter your description",
+    variant: "bordered",
+    radius: "full",
+  },
+};
+
 export const Required = {
   render: Template,
 
@@ -126,6 +155,45 @@ export const ReadOnly = {
   },
 };
 
+export const WithStartContent = {
+  render: Template,
+
+  args: {
+    ...defaultProps,
+    startContent: <PlusFilledIcon className="text-xl" />,
+  },
+};
+
+export const WithEndContent = {
+  render: Template,
+
+  args: {
+    ...defaultProps,
+    minRows: 1,
+    label: null,
+    endContent: (
+      <div className="p-1">
+        <SendFilledIcon className="text-xl" />
+      </div>
+    ),
+    classNames: {
+      input: "py-1",
+    },
+    "aria-label": "Description",
+    placeholder: "Enter your description",
+    variant: "bordered",
+    radius: "full",
+  },
+};
+
+export const Controlled = {
+  render: ControlledTemplate,
+
+  args: {
+    ...defaultProps,
+  },
+};
+
 export const MinRows = {
   render: MinRowsTemplate,
 

packages/components/kbd/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/kbd
 
+## 2.0.25
+
+### Patch Changes
+
+- Updated dependencies [[`a978687b0`](https://github.com/nextui-org/nextui/commit/a978687b0736d1e15943ef46628fc4fa0723ddc7)]:
+  - @nextui-org/system-rsc@2.0.11
+
+## 2.0.24
+
+### Patch Changes
+
+- Updated dependencies [[`6ecdc278a`](https://github.com/nextui-org/nextui/commit/6ecdc278aba927ee38a799679b8eb99cba99cab9)]:
+  - @nextui-org/system-rsc@2.0.10
+
 ## 2.0.23
 
 ### Patch Changes

packages/components/kbd/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/kbd",
-  "version": "2.0.23",
+  "version": "2.0.25",
   "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.26
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/link/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/link",
-  "version": "2.0.25",
+  "version": "2.0.26",
   "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,30 @@
 # @nextui-org/listbox
 
+## 2.1.16
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/divider@2.0.25
+  - @nextui-org/aria-utils@2.0.15
+
+## 2.1.15
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/divider@2.0.24
+  - @nextui-org/aria-utils@2.0.14
+
+## 2.1.14
+
+### Patch Changes
+
+- [#1915](https://github.com/nextui-org/nextui/pull/1915) [`135cc21e6`](https://github.com/nextui-org/nextui/commit/135cc21e6f0f2bee1f19e7e5799b6cea8179b7f5) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1888 `hideSelectedIcon` added to menu and listbox sections.
+
+- Updated dependencies []:
+  - @nextui-org/divider@2.0.23
+
 ## 2.1.13
 
 ### Patch Changes

packages/components/listbox/package.json

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

packages/components/listbox/src/base/listbox-section-base.tsx

@@ -14,6 +14,11 @@ export interface ListboxSectionBaseProps<T extends object = {}> extends SectionP
    * The listbox items classNames.
    */
   itemClasses?: ListboxItemProps["classNames"];
+  /**
+   * Whether to hide the check icon when the items are selected.
+   * @default false
+   */
+  hideSelectedIcon?: boolean;
   /**
    * Shows a divider between sections
    * @default false

packages/components/listbox/src/listbox-section.tsx

@@ -43,6 +43,7 @@ const ListboxSection = forwardRef<"li", ListboxSectionProps>(
       disableAnimation,
       className,
       classNames,
+      hideSelectedIcon,
       showDivider = false,
       dividerProps = {},
       itemClasses,
@@ -97,6 +98,7 @@ const ListboxSection = forwardRef<"li", ListboxSectionProps>(
                 classNames={itemClasses}
                 color={color}
                 disableAnimation={disableAnimation}
+                hideSelectedIcon={hideSelectedIcon}
                 item={node}
                 state={state}
                 variant={variant}

packages/components/menu/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @nextui-org/menu
 
+## 2.0.17
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/divider@2.0.25
+  - @nextui-org/aria-utils@2.0.15
+
+## 2.0.16
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/divider@2.0.24
+  - @nextui-org/aria-utils@2.0.14
+
+## 2.0.15
+
+### Patch Changes
+
+- [#1915](https://github.com/nextui-org/nextui/pull/1915) [`135cc21e6`](https://github.com/nextui-org/nextui/commit/135cc21e6f0f2bee1f19e7e5799b6cea8179b7f5) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1888 `hideSelectedIcon` added to menu and listbox sections.
+
+- Updated dependencies []:
+  - @nextui-org/divider@2.0.23
+
 ## 2.0.14
 
 ### Patch Changes

packages/components/menu/package.json

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

packages/components/menu/src/base/menu-section-base.tsx

@@ -19,6 +19,11 @@ export interface MenuSectionBaseProps<T extends object = {}> extends SectionProp
    * @default false
    */
   showDivider?: boolean;
+  /**
+   * Whether to hide the check icon when the items are selected.
+   * @default false
+   */
+  hideSelectedIcon?: boolean;
   /**
    * The divider props
    */

packages/components/menu/src/menu-section.tsx

@@ -55,6 +55,7 @@ const MenuSection = forwardRef<"li", MenuSectionProps>(
       className,
       classNames,
       showDivider = false,
+      hideSelectedIcon,
       dividerProps = {},
       itemClasses,
       // removed title from props to avoid browsers showing a tooltip on hover
@@ -108,6 +109,7 @@ const MenuSection = forwardRef<"li", MenuSectionProps>(
                 closeOnSelect={closeOnSelect}
                 color={color}
                 disableAnimation={disableAnimation}
+                hideSelectedIcon={hideSelectedIcon}
                 item={node}
                 state={state}
                 variant={variant}

packages/components/modal/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @nextui-org/modal
 
+## 2.0.28
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/framer-transitions@2.0.15
+
+## 2.0.27
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+  - @nextui-org/framer-transitions@2.0.14
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/modal/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/modal",
-  "version": "2.0.26",
+  "version": "2.0.28",
   "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,21 @@
 # @nextui-org/navbar
 
+## 2.0.27
+
+### Patch Changes
+
+- [#1946](https://github.com/nextui-org/nextui/pull/1946) [`36775dcee`](https://github.com/nextui-org/nextui/commit/36775dceee18e4b69684bab4cbdd122a6034c91f) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1941 style prop added to the base navbar element.
+
+- Updated dependencies []:
+  - @nextui-org/framer-transitions@2.0.15
+
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/framer-transitions@2.0.14
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/navbar/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/navbar",
-  "version": "2.0.25",
+  "version": "2.0.27",
   "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/navbar/src/use-navbar.ts

@@ -189,6 +189,7 @@ export function useNavbar(originalProps: UseNavbarProps) {
     className: slots.base({class: clsx(baseStyles, props?.className)}),
     style: {
       "--navbar-height": height,
+      ...otherProps?.style,
       ...props?.style,
     },
   });

packages/components/pagination/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @nextui-org/pagination
 
+## 2.0.26
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+
 ## 2.0.25
 
 ### Patch Changes

packages/components/pagination/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/pagination",
-  "version": "2.0.25",
+  "version": "2.0.26",
   "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,23 @@
 # @nextui-org/popover
 
+## 2.1.14
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/button@2.0.26
+  - @nextui-org/aria-utils@2.0.15
+  - @nextui-org/framer-transitions@2.0.15
+
+## 2.1.13
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/button@2.0.25
+  - @nextui-org/aria-utils@2.0.14
+  - @nextui-org/framer-transitions@2.0.14
+
 ## 2.1.12
 
 ### Patch Changes

packages/components/popover/package.json

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

packages/components/select/CHANGELOG.md

@@ -1,5 +1,52 @@
 # @nextui-org/select
 
+## 2.1.20
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/listbox@2.1.16
+  - @nextui-org/popover@2.1.14
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/spinner@2.0.24
+  - @nextui-org/aria-utils@2.0.15
+
+## 2.1.19
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+  - @nextui-org/listbox@2.1.15
+  - @nextui-org/popover@2.1.13
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/spinner@2.0.23
+  - @nextui-org/aria-utils@2.0.14
+
+## 2.1.18
+
+### Patch Changes
+
+- [#1914](https://github.com/nextui-org/nextui/pull/1914) [`7f6218b97`](https://github.com/nextui-org/nextui/commit/7f6218b97860d267f5208134948dfeadd04505d1) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1910 multiline select fixed, style improved.
+
+- Updated dependencies [[`135cc21e6`](https://github.com/nextui-org/nextui/commit/135cc21e6f0f2bee1f19e7e5799b6cea8179b7f5)]:
+  - @nextui-org/listbox@2.1.14
+  - @nextui-org/popover@2.1.12
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/spinner@2.0.22
+
+## 2.1.17
+
+### Patch Changes
+
+- [#1901](https://github.com/nextui-org/nextui/pull/1901) [`6a6d426b1`](https://github.com/nextui-org/nextui/commit/6a6d426b10fa7f92dfb20611e261347027393193) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - - Label position changed for Select and Input, this avoids to break the layout when having long descriptions and no placeholder
+  - Input/Select styles improved, label opacity removed
+- Updated dependencies []:
+  - @nextui-org/popover@2.1.12
+  - @nextui-org/listbox@2.1.13
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/spinner@2.0.22
+
 ## 2.1.16
 
 ### Patch Changes

packages/components/select/package.json

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

packages/components/select/src/select.tsx

@@ -28,6 +28,7 @@ function Select<T extends object>(props: Props<T>, ref: ForwardedRef<HTMLSelectE
     endContent,
     placeholder,
     renderValue,
+    shouldLabelBeOutside,
     disableAnimation,
     getBaseProps,
     getLabelProps,
@@ -37,7 +38,6 @@ function Select<T extends object>(props: Props<T>, ref: ForwardedRef<HTMLSelectE
     getPopoverProps,
     getSpinnerProps,
     getMainWrapperProps,
-    shouldLabelBeOutside,
     getInnerWrapperProps,
     getHiddenSelectProps,
     getHelperWrapperProps,

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

@@ -262,6 +262,7 @@ export function useSelect<T extends object>(originalProps: UseSelectProps<T>) {
     labelPlacement === "outside-left" ||
     (labelPlacement === "outside" && (hasPlaceholder || !!originalProps.isMultiline));
   const shouldLabelBeInside = labelPlacement === "inside";
+
   const isFilled =
     state.isOpen ||
     hasPlaceholder ||

packages/components/select/stories/select.stories.tsx

@@ -799,8 +799,10 @@ export const WithChips = {
     variant: "bordered",
     selectionMode: "multiple",
     isMultiline: true,
+    labelPlacement: "outside",
     classNames: {
-      trigger: "py-2",
+      base: "max-w-xs",
+      trigger: "min-h-unit-12 py-2",
     },
     renderValue: (items: SelectedItems<User>) => {
       return (

packages/components/skeleton/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/skeleton
 
+## 2.0.24
+
+### Patch Changes
+
+- Updated dependencies [[`a978687b0`](https://github.com/nextui-org/nextui/commit/a978687b0736d1e15943ef46628fc4fa0723ddc7)]:
+  - @nextui-org/system-rsc@2.0.11
+
+## 2.0.23
+
+### Patch Changes
+
+- Updated dependencies [[`6ecdc278a`](https://github.com/nextui-org/nextui/commit/6ecdc278aba927ee38a799679b8eb99cba99cab9)]:
+  - @nextui-org/system-rsc@2.0.10
+
 ## 2.0.22
 
 ### Patch Changes

packages/components/skeleton/package.json

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

packages/components/slider/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/slider
 
+## 2.2.5
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/tooltip@2.0.29
+
+## 2.2.4
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/tooltip@2.0.28
+
 ## 2.2.3
 
 ### Patch Changes

packages/components/slider/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/slider",
-  "version": "2.2.3",
+  "version": "2.2.5",
   "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,22 @@
 # @nextui-org/snippet
 
+## 2.0.30
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/button@2.0.26
+  - @nextui-org/tooltip@2.0.29
+
+## 2.0.29
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+  - @nextui-org/button@2.0.25
+  - @nextui-org/tooltip@2.0.28
+
 ## 2.0.28
 
 ### Patch Changes

packages/components/snippet/package.json

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

packages/components/spacer/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/spacer
 
+## 2.0.24
+
+### Patch Changes
+
+- Updated dependencies [[`a978687b0`](https://github.com/nextui-org/nextui/commit/a978687b0736d1e15943ef46628fc4fa0723ddc7)]:
+  - @nextui-org/system-rsc@2.0.11
+
+## 2.0.23
+
+### Patch Changes
+
+- Updated dependencies [[`6ecdc278a`](https://github.com/nextui-org/nextui/commit/6ecdc278aba927ee38a799679b8eb99cba99cab9)]:
+  - @nextui-org/system-rsc@2.0.10
+
 ## 2.0.22
 
 ### Patch Changes

packages/components/spacer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/spacer",
-  "version": "2.0.22",
+  "version": "2.0.24",
   "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,19 @@
 # @nextui-org/spinner
 
+## 2.0.24
+
+### Patch Changes
+
+- Updated dependencies [[`a978687b0`](https://github.com/nextui-org/nextui/commit/a978687b0736d1e15943ef46628fc4fa0723ddc7)]:
+  - @nextui-org/system-rsc@2.0.11
+
+## 2.0.23
+
+### Patch Changes
+
+- Updated dependencies [[`6ecdc278a`](https://github.com/nextui-org/nextui/commit/6ecdc278aba927ee38a799679b8eb99cba99cab9)]:
+  - @nextui-org/system-rsc@2.0.10
+
 ## 2.0.22
 
 ### Patch Changes

packages/components/spinner/package.json

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

packages/components/switch/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @nextui-org/switch
 
+## 2.0.25
+
+### Patch Changes
+
+- [#1949](https://github.com/nextui-org/nextui/pull/1949) [`467383b8a`](https://github.com/nextui-org/nextui/commit/467383b8a2ad42bd22fabe1f70ea17c95bede53b) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix switch base element type it is an input now.
+
 ## 2.0.24
 
 ### Patch Changes

packages/components/switch/package.json

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

packages/components/switch/src/switch.tsx

@@ -6,7 +6,7 @@ import {UseSwitchProps, useSwitch} from "./use-switch";
 
 export interface SwitchProps extends UseSwitchProps {}
 
-const Switch = forwardRef<"label", SwitchProps>((props, ref) => {
+const Switch = forwardRef<"input", SwitchProps>((props, ref) => {
   const {
     Component,
     children,

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

@@ -23,7 +23,7 @@ export type SwitchThumbIconProps = {
   isSelected: boolean;
   className: string;
 };
-interface Props extends HTMLNextUIProps<"label"> {
+interface Props extends HTMLNextUIProps<"input"> {
   /**
    * Ref to the DOM node.
    */

packages/components/switch/stories/switch.stories.tsx

@@ -159,7 +159,7 @@ export const DisableAnimation = {
   },
 };
 
-export const WiththumbIcon = {
+export const WithThumbIcon = {
   args: {
     ...defaultProps,
     size: "xl",

packages/components/table/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @nextui-org/table
 
+## 2.0.28
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/checkbox@2.0.25
+  - @nextui-org/spacer@2.0.24
+
+## 2.0.27
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/shared-icons@2.0.6
+  - @nextui-org/checkbox@2.0.25
+  - @nextui-org/spacer@2.0.23
+
 ## 2.0.26
 
 ### Patch Changes

packages/components/table/package.json

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

packages/components/tabs/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @nextui-org/tabs
 
+## 2.0.26
+
+### Patch Changes
+
+- [#1948](https://github.com/nextui-org/nextui/pull/1948) [`aab1dbf77`](https://github.com/nextui-org/nextui/commit/aab1dbf77cee29375bf958e44bdf1d6da037cf1f) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1938 selectedKey duplicated declaration
+
+- Updated dependencies []:
+  - @nextui-org/aria-utils@2.0.15
+  - @nextui-org/framer-transitions@2.0.15
+
+## 2.0.25
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/aria-utils@2.0.14
+  - @nextui-org/framer-transitions@2.0.14
+
 ## 2.0.24
 
 ### Patch Changes

packages/components/tabs/package.json

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

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

@@ -51,7 +51,7 @@ export interface Props extends Omit<HTMLNextUIProps, "children"> {
 
 export type UseTabsProps<T> = Props &
   TabsVariantProps &
-  Omit<TabListStateOptions<T>, "children"> &
+  Omit<TabListStateOptions<T>, "children" | keyof AriaTabListProps<T>> &
   Omit<AriaTabListProps<T>, "children" | "orientation"> &
   CollectionProps<T>;
 

packages/components/tooltip/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @nextui-org/tooltip
 
+## 2.0.29
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/aria-utils@2.0.15
+  - @nextui-org/framer-transitions@2.0.15
+
+## 2.0.28
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/aria-utils@2.0.14
+  - @nextui-org/framer-transitions@2.0.14
+
 ## 2.0.27
 
 ### Patch Changes

packages/components/tooltip/package.json

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

packages/core/react/CHANGELOG.md

@@ -1,5 +1,197 @@
 # @nextui-org/react
 
+## 2.2.9
+
+### Patch Changes
+
+- Updated dependencies [[`0f5cce5d6`](https://github.com/nextui-org/nextui/commit/0f5cce5d62713c59973b4330607cdcd3fd95d41a), [`36775dcee`](https://github.com/nextui-org/nextui/commit/36775dceee18e4b69684bab4cbdd122a6034c91f), [`aab1dbf77`](https://github.com/nextui-org/nextui/commit/aab1dbf77cee29375bf958e44bdf1d6da037cf1f), [`aab1dbf77`](https://github.com/nextui-org/nextui/commit/aab1dbf77cee29375bf958e44bdf1d6da037cf1f), [`467383b8a`](https://github.com/nextui-org/nextui/commit/467383b8a2ad42bd22fabe1f70ea17c95bede53b)]:
+  - @nextui-org/theme@2.1.17
+  - @nextui-org/navbar@2.0.27
+  - @nextui-org/autocomplete@2.0.9
+  - @nextui-org/tabs@2.0.26
+  - @nextui-org/switch@2.0.25
+  - @nextui-org/accordion@2.0.28
+  - @nextui-org/avatar@2.0.24
+  - @nextui-org/badge@2.0.24
+  - @nextui-org/breadcrumbs@2.0.4
+  - @nextui-org/button@2.0.26
+  - @nextui-org/card@2.0.24
+  - @nextui-org/checkbox@2.0.25
+  - @nextui-org/chip@2.0.25
+  - @nextui-org/code@2.0.24
+  - @nextui-org/divider@2.0.25
+  - @nextui-org/dropdown@2.1.16
+  - @nextui-org/image@2.0.24
+  - @nextui-org/input@2.1.16
+  - @nextui-org/kbd@2.0.25
+  - @nextui-org/link@2.0.26
+  - @nextui-org/listbox@2.1.16
+  - @nextui-org/menu@2.0.17
+  - @nextui-org/modal@2.0.28
+  - @nextui-org/pagination@2.0.26
+  - @nextui-org/popover@2.1.14
+  - @nextui-org/progress@2.0.24
+  - @nextui-org/radio@2.0.25
+  - @nextui-org/ripple@2.0.24
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/select@2.1.20
+  - @nextui-org/skeleton@2.0.24
+  - @nextui-org/slider@2.2.5
+  - @nextui-org/snippet@2.0.30
+  - @nextui-org/spacer@2.0.24
+  - @nextui-org/spinner@2.0.24
+  - @nextui-org/table@2.0.28
+  - @nextui-org/tooltip@2.0.29
+  - @nextui-org/user@2.0.25
+  - @nextui-org/system@2.0.15
+
+## 2.2.8
+
+### Patch Changes
+
+- Updated dependencies [[`d2bd008ba`](https://github.com/nextui-org/nextui/commit/d2bd008ba3d4de73f4405f1997b15466efd19a81)]:
+  - @nextui-org/input@2.1.16
+  - @nextui-org/accordion@2.0.27
+  - @nextui-org/autocomplete@2.0.8
+  - @nextui-org/modal@2.0.27
+  - @nextui-org/navbar@2.0.26
+  - @nextui-org/popover@2.1.13
+  - @nextui-org/select@2.1.19
+  - @nextui-org/tabs@2.0.25
+
+## 2.2.7
+
+### Patch Changes
+
+- Updated dependencies [[`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291)]:
+  - @nextui-org/input@2.1.15
+  - @nextui-org/theme@2.1.16
+  - @nextui-org/accordion@2.0.27
+  - @nextui-org/autocomplete@2.0.7
+  - @nextui-org/avatar@2.0.24
+  - @nextui-org/badge@2.0.23
+  - @nextui-org/breadcrumbs@2.0.4
+  - @nextui-org/button@2.0.25
+  - @nextui-org/checkbox@2.0.25
+  - @nextui-org/chip@2.0.25
+  - @nextui-org/dropdown@2.1.15
+  - @nextui-org/link@2.0.26
+  - @nextui-org/listbox@2.1.15
+  - @nextui-org/menu@2.0.16
+  - @nextui-org/modal@2.0.27
+  - @nextui-org/navbar@2.0.26
+  - @nextui-org/pagination@2.0.26
+  - @nextui-org/select@2.1.19
+  - @nextui-org/slider@2.2.4
+  - @nextui-org/snippet@2.0.29
+  - @nextui-org/switch@2.0.24
+  - @nextui-org/table@2.0.27
+  - @nextui-org/tabs@2.0.25
+  - @nextui-org/popover@2.1.13
+  - @nextui-org/card@2.0.24
+  - @nextui-org/code@2.0.23
+  - @nextui-org/divider@2.0.24
+  - @nextui-org/image@2.0.24
+  - @nextui-org/kbd@2.0.24
+  - @nextui-org/progress@2.0.24
+  - @nextui-org/radio@2.0.25
+  - @nextui-org/ripple@2.0.24
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/skeleton@2.0.23
+  - @nextui-org/spacer@2.0.23
+  - @nextui-org/spinner@2.0.23
+  - @nextui-org/tooltip@2.0.28
+  - @nextui-org/user@2.0.25
+  - @nextui-org/system@2.0.14
+
+## 2.2.6
+
+### Patch Changes
+
+- Updated dependencies [[`135cc21e6`](https://github.com/nextui-org/nextui/commit/135cc21e6f0f2bee1f19e7e5799b6cea8179b7f5), [`7f6218b97`](https://github.com/nextui-org/nextui/commit/7f6218b97860d267f5208134948dfeadd04505d1)]:
+  - @nextui-org/listbox@2.1.14
+  - @nextui-org/menu@2.0.15
+  - @nextui-org/select@2.1.18
+  - @nextui-org/theme@2.1.15
+  - @nextui-org/autocomplete@2.0.6
+  - @nextui-org/dropdown@2.1.14
+  - @nextui-org/accordion@2.0.26
+  - @nextui-org/avatar@2.0.24
+  - @nextui-org/badge@2.0.22
+  - @nextui-org/breadcrumbs@2.0.3
+  - @nextui-org/button@2.0.24
+  - @nextui-org/card@2.0.24
+  - @nextui-org/checkbox@2.0.25
+  - @nextui-org/chip@2.0.24
+  - @nextui-org/code@2.0.22
+  - @nextui-org/divider@2.0.23
+  - @nextui-org/image@2.0.24
+  - @nextui-org/input@2.1.14
+  - @nextui-org/kbd@2.0.23
+  - @nextui-org/link@2.0.25
+  - @nextui-org/modal@2.0.26
+  - @nextui-org/navbar@2.0.25
+  - @nextui-org/pagination@2.0.25
+  - @nextui-org/popover@2.1.12
+  - @nextui-org/progress@2.0.24
+  - @nextui-org/radio@2.0.25
+  - @nextui-org/ripple@2.0.24
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/skeleton@2.0.22
+  - @nextui-org/slider@2.2.3
+  - @nextui-org/snippet@2.0.28
+  - @nextui-org/spacer@2.0.22
+  - @nextui-org/spinner@2.0.22
+  - @nextui-org/switch@2.0.24
+  - @nextui-org/table@2.0.26
+  - @nextui-org/tabs@2.0.24
+  - @nextui-org/tooltip@2.0.27
+  - @nextui-org/user@2.0.25
+
+## 2.2.5
+
+### Patch Changes
+
+- Updated dependencies [[`6a6d426b1`](https://github.com/nextui-org/nextui/commit/6a6d426b10fa7f92dfb20611e261347027393193), [`85a820eef`](https://github.com/nextui-org/nextui/commit/85a820eeffe5df87e7622b0983788eb50adafe20), [`11ef4365d`](https://github.com/nextui-org/nextui/commit/11ef4365dacf539001a39d596d2f60440bc0648b)]:
+  - @nextui-org/select@2.1.17
+  - @nextui-org/input@2.1.14
+  - @nextui-org/theme@2.1.14
+  - @nextui-org/autocomplete@2.0.5
+  - @nextui-org/accordion@2.0.26
+  - @nextui-org/modal@2.0.26
+  - @nextui-org/navbar@2.0.25
+  - @nextui-org/popover@2.1.12
+  - @nextui-org/tabs@2.0.24
+  - @nextui-org/avatar@2.0.24
+  - @nextui-org/badge@2.0.22
+  - @nextui-org/breadcrumbs@2.0.3
+  - @nextui-org/button@2.0.24
+  - @nextui-org/card@2.0.24
+  - @nextui-org/checkbox@2.0.25
+  - @nextui-org/chip@2.0.24
+  - @nextui-org/code@2.0.22
+  - @nextui-org/divider@2.0.23
+  - @nextui-org/dropdown@2.1.13
+  - @nextui-org/image@2.0.24
+  - @nextui-org/kbd@2.0.23
+  - @nextui-org/link@2.0.25
+  - @nextui-org/listbox@2.1.13
+  - @nextui-org/menu@2.0.14
+  - @nextui-org/pagination@2.0.25
+  - @nextui-org/progress@2.0.24
+  - @nextui-org/radio@2.0.25
+  - @nextui-org/ripple@2.0.24
+  - @nextui-org/scroll-shadow@2.1.12
+  - @nextui-org/skeleton@2.0.22
+  - @nextui-org/slider@2.2.3
+  - @nextui-org/snippet@2.0.28
+  - @nextui-org/spacer@2.0.22
+  - @nextui-org/spinner@2.0.22
+  - @nextui-org/switch@2.0.24
+  - @nextui-org/table@2.0.26
+  - @nextui-org/tooltip@2.0.27
+  - @nextui-org/user@2.0.25
+
 ## 2.2.4
 
 ### Patch Changes

packages/core/react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/react",
-  "version": "2.2.4",
+  "version": "2.2.9",
   "description": "🚀 Beautiful and modern React UI library.",
   "author": "Junior Garcia <jrgarciadev@gmail.com>",
   "homepage": "https://nextui.org",

packages/core/system-rsc/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @nextui-org/system-rsc
 
+## 2.0.11
+
+### Patch Changes
+
+- [#1936](https://github.com/nextui-org/nextui/pull/1936) [`a978687b0`](https://github.com/nextui-org/nextui/commit/a978687b0736d1e15943ef46628fc4fa0723ddc7) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1935 size prop added to the omitted HTMLNextUIProps
+
+## 2.0.10
+
+### Patch Changes
+
+- [#1927](https://github.com/nextui-org/nextui/pull/1927) [`6ecdc278a`](https://github.com/nextui-org/nextui/commit/6ecdc278aba927ee38a799679b8eb99cba99cab9) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1921 `extendVariants` function adapted to consider props variants over `defaultVariants`.
+
 ## 2.0.9
 
 ### Patch Changes

packages/core/system-rsc/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/system-rsc",
-  "version": "2.0.9",
+  "version": "2.0.11",
   "description": "NextUI system primitives compatibles with RSC imports",
   "keywords": [
     "system-rsc"

packages/core/system-rsc/src/extend-variants.js

@@ -21,7 +21,40 @@ function getSlots(variants) {
     : {};
 }
 
-function getClassNamesWithProps({props, defaultVariants, customTv, hasSlots}) {
+function getClassNamesWithProps({
+  props = {},
+  variants,
+  slots,
+  defaultVariants,
+  compoundVariants,
+  hasSlots,
+  opts,
+}) {
+  // Do not apply default variants when the props variant is different
+  if (defaultVariants && typeof defaultVariants === "object") {
+    for (const key in defaultVariants) {
+      const value = defaultVariants[key];
+      const propValue = props?.[key];
+
+      if (propValue && propValue !== value) {
+        delete defaultVariants[key];
+      }
+    }
+  }
+
+  const customTv = tv(
+    {
+      variants,
+      defaultVariants,
+      compoundVariants,
+      ...(hasSlots && {slots}),
+    },
+    {
+      twMerge: opts.twMerge ?? true,
+      twMergeConfig: opts.twMergeConfig ?? {},
+    },
+  );
+
   const [baseProps, variantProps] = mapPropsVariants(props, customTv.variantKeys, false);
 
   const newProps = {...defaultVariants, ...baseProps};
@@ -62,26 +95,21 @@ export function extendVariants(BaseComponent, styles = {}, opts = {}) {
   const slots = getSlots(variants);
   const hasSlots = typeof slots === "object" && Object.keys(slots).length !== 0;
 
-  const customTv = tv(
-    {
-      variants,
-      defaultVariants,
-      compoundVariants,
-      ...(hasSlots && {slots}),
-    },
-    {
-      twMerge: opts.twMerge ?? true,
-      twMergeConfig: opts.twMergeConfig ?? {},
-    },
-  );
-
   const ForwardedComponent = React.forwardRef((originalProps = {}, ref) => {
-    const newProps = getClassNamesWithProps({
-      props: originalProps,
-      defaultVariants,
-      customTv,
-      hasSlots,
-    });
+    const newProps = React.useMemo(() =>
+      getClassNamesWithProps(
+        {
+          slots,
+          variants,
+          compoundVariants,
+          props: originalProps,
+          defaultVariants,
+          hasSlots,
+          opts,
+        },
+        [originalProps],
+      ),
+    );
 
     return React.createElement(BaseComponent, {...originalProps, ...newProps, ref});
   });
@@ -90,10 +118,13 @@ export function extendVariants(BaseComponent, styles = {}, opts = {}) {
   if (BaseComponent.getCollectionNode) {
     ForwardedComponent.getCollectionNode = (itemProps) => {
       const newProps = getClassNamesWithProps({
+        slots,
+        variants,
+        compoundVariants,
         props: itemProps,
         defaultVariants,
-        customTv,
         hasSlots,
+        opts,
       });
 
       return BaseComponent.getCollectionNode({...itemProps, ...newProps});

packages/core/system-rsc/src/types.ts

@@ -70,7 +70,7 @@ export type Merge<M, N> = N extends Record<string, unknown> ? M : Omit<M, keyof
 
 export type HTMLNextUIProps<T extends As = "div", OmitKeys extends keyof any = never> = Omit<
   PropsOf<T>,
-  "ref" | "color" | "slot" | "defaultChecked" | "defaultValue" | OmitKeys
+  "ref" | "color" | "slot" | "size" | "defaultChecked" | "defaultValue" | OmitKeys
 > & {
   as?: As;
 };

packages/core/system/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/system
 
+## 2.0.15
+
+### Patch Changes
+
+- Updated dependencies [[`a978687b0`](https://github.com/nextui-org/nextui/commit/a978687b0736d1e15943ef46628fc4fa0723ddc7)]:
+  - @nextui-org/system-rsc@2.0.11
+
+## 2.0.14
+
+### Patch Changes
+
+- Updated dependencies [[`6ecdc278a`](https://github.com/nextui-org/nextui/commit/6ecdc278aba927ee38a799679b8eb99cba99cab9)]:
+  - @nextui-org/system-rsc@2.0.10
+
 ## 2.0.13
 
 ### Patch Changes

packages/core/system/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/system",
-  "version": "2.0.13",
+  "version": "2.0.15",
   "description": "NextUI system primitives",
   "keywords": [
     "system"

packages/core/theme/CHANGELOG.md

@@ -1,5 +1,35 @@
 # @nextui-org/theme
 
+## 2.1.17
+
+### Patch Changes
+
+- [#1951](https://github.com/nextui-org/nextui/pull/1951) [`0f5cce5d6`](https://github.com/nextui-org/nextui/commit/0f5cce5d62713c59973b4330607cdcd3fd95d41a) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1933 TV Function refactored to support twMerge false opts.
+
+## 2.1.16
+
+### Patch Changes
+
+- [#1923](https://github.com/nextui-org/nextui/pull/1923) [`9189b3fbf`](https://github.com/nextui-org/nextui/commit/9189b3fbf2d6d6cc6566009c71b37d5fcc566291) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Textarea style rounded full styles issues fixed, start and end content props added
+
+## 2.1.15
+
+### Patch Changes
+
+- [#1914](https://github.com/nextui-org/nextui/pull/1914) [`7f6218b97`](https://github.com/nextui-org/nextui/commit/7f6218b97860d267f5208134948dfeadd04505d1) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1910 multiline select fixed, style improved.
+
+## 2.1.14
+
+### Patch Changes
+
+- [#1901](https://github.com/nextui-org/nextui/pull/1901) [`6a6d426b1`](https://github.com/nextui-org/nextui/commit/6a6d426b10fa7f92dfb20611e261347027393193) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - - Label position changed for Select and Input, this avoids to break the layout when having long descriptions and no placeholder
+
+  - Input/Select styles improved, label opacity removed
+
+- [#1902](https://github.com/nextui-org/nextui/pull/1902) [`85a820eef`](https://github.com/nextui-org/nextui/commit/85a820eeffe5df87e7622b0983788eb50adafe20) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Fix #1893, `endContent` prop fixed.
+
+- [#1905](https://github.com/nextui-org/nextui/pull/1905) [`11ef4365d`](https://github.com/nextui-org/nextui/commit/11ef4365dacf539001a39d596d2f60440bc0648b) Thanks [@jrgarciadev](https://github.com/jrgarciadev)! - Input/Select text size changed for sm size.
+
 ## 2.1.13
 
 ### Patch Changes

packages/core/theme/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/theme",
-  "version": "2.1.13",
+  "version": "2.1.17",
   "description": "The default theme for NextUI components",
   "keywords": [
     "theme",

packages/core/theme/src/components/autocomplete.ts

@@ -24,11 +24,11 @@ const autocomplete = tv({
     selectorButton: "text-medium",
   },
   variants: {
-    disableClearable: {
-      true: {
+    isClearable: {
+      true: {},
+      false: {
         clearButton: "hidden",
       },
-      false: {},
     },
     disableAnimation: {
       true: {
@@ -47,7 +47,7 @@ const autocomplete = tv({
   },
   defaultVariants: {
     disableAnimation: false,
-    disableClearable: false,
+    isClearable: true,
     disableSelectorIconRotation: false,
   },
 });

packages/core/theme/src/components/input.ts

@@ -33,19 +33,15 @@ const input = tv({
       "block",
       "text-small",
       "text-foreground-500",
-      "opacity-70",
-      "group-data-[filled-within=true]:opacity-100",
     ],
     mainWrapper: "h-full",
     inputWrapper:
       "relative w-full inline-flex tap-highlight-transparent flex-row items-center shadow-sm px-3 gap-3",
     innerWrapper: "inline-flex w-full items-center h-full box-border",
     input: [
-      "opacity-70",
       "w-full font-normal bg-transparent !outline-none placeholder:text-foreground-500 focus-visible:outline-none",
       "data-[has-start-content=true]:ps-1.5",
       "data-[has-end-content=true]:pe-1.5",
-      "group-data-[has-value=true]:opacity-100",
     ],
     clearButton: [
       "p-2",
@@ -65,7 +61,7 @@ const input = tv({
       // focus ring
       ...dataFocusVisibleClasses,
     ],
-    helperWrapper: "p-1 flex relative flex-col gap-1.5",
+    helperWrapper: "hidden group-data-[has-helper=true]:flex p-1 relative flex-col gap-1.5",
     description: "text-tiny text-foreground-400",
     errorMessage: "text-tiny text-danger",
   },
@@ -77,8 +73,6 @@ const input = tv({
           "data-[hover=true]:bg-default-200",
           "group-data-[focus=true]:bg-default-100",
         ],
-        input: "placeholder:text-default-foreground",
-        label: "text-default-foreground",
       },
       faded: {
         inputWrapper: [
@@ -87,8 +81,7 @@ const input = tv({
           "border-default-200",
           "data-[hover=true]:border-default-400",
         ],
-        input: "placeholder:text-default-foreground",
-        label: "text-default-foreground",
+        value: "group-data-[has-value=true]:text-default-foreground",
       },
       bordered: {
         inputWrapper: [
@@ -97,8 +90,6 @@ const input = tv({
           "data-[hover=true]:border-default-400",
           "group-data-[focus=true]:border-default-foreground",
         ],
-        input: "placeholder:text-foreground",
-        label: "text-foreground",
       },
       underlined: {
         inputWrapper: [
@@ -124,14 +115,11 @@ const input = tv({
           "group-data-[focus=true]:after:w-full",
         ],
         innerWrapper: "pb-1",
-        input: "placeholder:text-foreground",
-        label: "text-foreground",
+        label: "group-data-[filled-within=true]:text-foreground",
       },
     },
     color: {
-      default: {
-        label: "group-data-[filled-within=true]:opacity-80",
-      },
+      default: {},
       primary: {},
       secondary: {},
       success: {},
@@ -142,7 +130,7 @@ const input = tv({
       sm: {
         label: "text-tiny",
         inputWrapper: "h-unit-8 min-h-unit-8 px-2 rounded-small",
-        input: "text-tiny",
+        input: "text-small",
         clearButton: "text-medium",
       },
       md: {
@@ -175,7 +163,6 @@ const input = tv({
     },
     labelPlacement: {
       outside: {
-        label: "text-foreground pb-1.5",
         mainWrapper: "flex flex-col",
       },
       "outside-left": {
@@ -211,7 +198,7 @@ const input = tv({
     isInvalid: {
       true: {
         label: "!text-danger",
-        input: "placeholder:text-danger text-danger",
+        input: "!placeholder:text-danger !text-danger",
       },
     },
     isRequired: {
@@ -223,7 +210,8 @@ const input = tv({
       true: {
         label: "relative",
         inputWrapper: "!h-auto",
-        input: "resize-none py-2 data-[hide-scroll=true]:scrollbar-hide",
+        innerWrapper: "items-start group-data-[has-label=true]:items-start",
+        input: "resize-none data-[hide-scroll=true]:scrollbar-hide",
       },
     },
     disableAnimation: {
@@ -257,6 +245,13 @@ const input = tv({
   },
   compoundVariants: [
     // flat & color
+    {
+      variant: "flat",
+      color: "default",
+      class: {
+        input: "group-data-[has-value=true]:text-default-foreground",
+      },
+    },
     {
       variant: "flat",
       color: "primary",
@@ -380,6 +375,13 @@ const input = tv({
       },
     },
     // underlined & color
+    {
+      variant: "underlined",
+      color: "default",
+      class: {
+        input: "group-data-[has-value=true]:text-foreground",
+      },
+    },
     {
       variant: "underlined",
       color: "primary",
@@ -461,6 +463,22 @@ const input = tv({
         label: "text-danger",
       },
     },
+    // labelPlacement=inside & default
+    {
+      labelPlacement: "inside",
+      color: "default",
+      class: {
+        label: "group-data-[filled-within=true]:text-default-600",
+      },
+    },
+    // labelPlacement=outside & default
+    {
+      labelPlacement: "outside",
+      color: "default",
+      class: {
+        label: "group-data-[filled-within=true]:text-foreground",
+      },
+    },
     // radius-full & size
     {
       radius: "full",
@@ -795,11 +813,28 @@ const input = tv({
         label: "group-data-[has-helper=true]:pt-4",
       },
     },
+    // labelPlacement=[outside, outside-left] & isMultiline
+    {
+      labelPlacement: ["outside", "outside-left"],
+      isMultiline: true,
+      class: {
+        inputWrapper: "py-2",
+      },
+    },
+    // isMultiline & labelPlacement="outside"
+    {
+      labelPlacement: "outside",
+      isMultiline: true,
+      class: {
+        label: "pb-1.5",
+      },
+    },
     // isMultiline & labelPlacement="inside"
     {
       labelPlacement: "inside",
       isMultiline: true,
       class: {
+        label: "pb-0.5",
         input: "pt-0",
       },
     },
@@ -818,6 +853,14 @@ const input = tv({
         label: ["pe-2", "max-w-full", "text-ellipsis", "overflow-hidden"],
       },
     },
+    // isMultiline & radius=full
+    {
+      isMultiline: true,
+      radius: "full",
+      class: {
+        inputWrapper: "data-[has-multiple-rows=true]:rounded-large",
+      },
+    },
   ],
 });
 

packages/core/theme/src/components/select.ts

@@ -15,8 +15,6 @@ const select = tv({
       "text-small",
       "text-foreground-500",
       "pointer-events-none",
-      "opacity-70",
-      "group-data-[filled=true]:opacity-100",
     ],
     mainWrapper: "w-full flex flex-col",
     trigger:
@@ -25,13 +23,7 @@ const select = tv({
       "inline-flex h-full w-[calc(100%_-_theme(spacing.unit-6))] min-h-unit-4 items-center gap-1.5 box-border",
     selectorIcon: "absolute right-3 w-unit-4 h-unit-4",
     spinner: "absolute right-3",
-    value: [
-      "font-normal",
-      "w-full",
-      "text-left",
-      "opacity-70",
-      "group-data-[has-value=true]:opacity-100",
-    ],
+    value: ["text-foreground-500", "font-normal", "w-full", "text-left"],
     listboxWrapper: "scroll-py-6 max-h-64 w-full",
     listbox: "",
     popoverContent: "w-full p-1 overflow-hidden",
@@ -47,8 +39,6 @@ const select = tv({
           "data-[hover=true]:bg-default-200",
           "group-data-[focus=true]:bg-default-100",
         ],
-        label: "text-default-foreground",
-        value: "placeholder:text-default-foreground",
       },
       faded: {
         trigger: [
@@ -57,8 +47,7 @@ const select = tv({
           "border-default-200",
           "data-[hover=true]:border-default-400",
         ],
-        label: "text-default-foreground",
-        value: "placeholder:text-default-foreground",
+        value: "group-data-[has-value=true]:text-default-foreground",
       },
       bordered: {
         trigger: [
@@ -69,8 +58,6 @@ const select = tv({
           "data-[focus=true]:border-default-foreground",
           "data-[focus=true]:border-default-foreground",
         ],
-        label: "text-foreground",
-        value: "placeholder:text-foreground",
       },
       underlined: {
         trigger: [
@@ -96,14 +83,11 @@ const select = tv({
           "data-[open=true]:after:w-full",
           "data-[focus=true]:after:w-full",
         ],
-        label: "text-foreground",
-        value: "placeholder:text-foreground",
+        label: "group-data-[filled=true]:text-foreground",
       },
     },
     color: {
-      default: {
-        label: "group-data-[filled=true]:opacity-80",
-      },
+      default: {},
       primary: {},
       secondary: {},
       success: {},
@@ -114,7 +98,7 @@ const select = tv({
       sm: {
         label: "text-tiny",
         trigger: "h-unit-8 min-h-unit-8 px-2 rounded-small",
-        value: "text-tiny",
+        value: "text-small",
       },
       md: {
         trigger: "h-unit-10 min-h-unit-10 rounded-medium",
@@ -145,11 +129,10 @@ const select = tv({
     labelPlacement: {
       outside: {
         base: "flex flex-col",
-        label: "text-foreground pb-1.5",
       },
       "outside-left": {
         base: "flex-row items-center flex-nowrap items-start",
-        label: "relative text-foreground pr-2",
+        label: "relative pr-2 text-foreground",
       },
       inside: {
         label: "text-tiny cursor-pointer",
@@ -228,6 +211,13 @@ const select = tv({
   },
   compoundVariants: [
     // flat & color
+    {
+      variant: "flat",
+      color: "default",
+      class: {
+        value: "group-data-[has-value=true]:text-default-foreground",
+      },
+    },
     {
       variant: "flat",
       color: "primary",
@@ -343,6 +333,14 @@ const select = tv({
       },
     },
     // underlined & color
+    // underlined & color
+    {
+      variant: "underlined",
+      color: "default",
+      class: {
+        value: "group-data-[has-value=true]:text-foreground",
+      },
+    },
     {
       variant: "underlined",
       color: "primary",
@@ -424,6 +422,22 @@ const select = tv({
         label: "text-danger",
       },
     },
+    // labelPlacement=outside & default
+    {
+      labelPlacement: "inside",
+      color: "default",
+      class: {
+        label: "group-data-[filled=true]:text-default-600",
+      },
+    },
+    // labelPlacement=outside & default
+    {
+      labelPlacement: "outside",
+      color: "default",
+      class: {
+        label: "group-data-[filled=true]:text-foreground",
+      },
+    },
     // radius-full & size
     {
       radius: "full",
@@ -690,6 +704,14 @@ const select = tv({
         base: "data-[has-label=true]:mt-[calc(theme(fontSize.small)_+_12px)]",
       },
     },
+    // isMultiline & labelPlacement="outside"
+    {
+      labelPlacement: "outside",
+      isMultiline: true,
+      class: {
+        label: "pb-1.5",
+      },
+    },
     // text truncate labelPlacement=[inside,outside]
     {
       labelPlacement: ["inside", "outside"],

packages/core/theme/src/utils/tv.ts

@@ -1,31 +1,36 @@
-import {createTV} from "tailwind-variants";
+import {tv as tvBase, TV} from "tailwind-variants";
 
 import {mappedSpacingScaleKeys} from "../types";
 const COMMON_UNITS = ["small", "medium", "large"];
 
-export const tv = createTV({
-  twMerge: true,
-  twMergeConfig: {
-    theme: {
-      opacity: ["disabled"],
-      spacing: ["divider", "unit", ...mappedSpacingScaleKeys],
-      borderWidth: COMMON_UNITS,
-      borderRadius: COMMON_UNITS,
+export const tv: TV = (options, config) =>
+  tvBase(options, {
+    ...config,
+    twMerge: config?.twMerge ?? true,
+    twMergeConfig: {
+      ...config?.twMergeConfig,
+      theme: {
+        ...config?.twMergeConfig?.theme,
+        opacity: ["disabled"],
+        spacing: ["divider", "unit", ...mappedSpacingScaleKeys],
+        borderWidth: COMMON_UNITS,
+        borderRadius: COMMON_UNITS,
+      },
+      classGroups: {
+        ...config?.twMergeConfig?.classGroups,
+        shadow: [{shadow: COMMON_UNITS}],
+        "font-size": [{text: ["tiny", ...COMMON_UNITS]}],
+        "bg-image": ["bg-stripe-gradient"],
+        "min-w": [
+          {
+            "min-w": ["unit", ...mappedSpacingScaleKeys],
+          },
+        ],
+        "min-h": [
+          {
+            "min-h": ["unit", ...mappedSpacingScaleKeys],
+          },
+        ],
+      },
     },
-    classGroups: {
-      shadow: [{shadow: COMMON_UNITS}],
-      "font-size": [{text: ["tiny", ...COMMON_UNITS]}],
-      "bg-image": ["bg-stripe-gradient"],
-      "min-w": [
-        {
-          "min-w": ["unit", ...mappedSpacingScaleKeys],
-        },
-      ],
-      "min-h": [
-        {
-          "min-h": ["unit", ...mappedSpacingScaleKeys],
-        },
-      ],
-    },
-  },
-});
+  });

packages/utilities/aria-utils/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @nextui-org/aria-utils
 
+## 2.0.15
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/system@2.0.15
+
+## 2.0.14
+
+### Patch Changes
+
+- Updated dependencies []:
+  - @nextui-org/system@2.0.14
+
 ## 2.0.13
 
 ### Patch Changes

packages/utilities/aria-utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nextui-org/aria-utils",
-  "version": "2.0.13",
+  "version": "2.0.15",
   "description": "A package for managing @react-aria nextui utils.",
   "keywords": [
     "aria-utils"