Merge branch 'canary' into fix/eng-1199

.changeset/clean-dryers-notice.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/select": patch
+---
+
+Fixed toggle issue while clicking on label of select component unexpectedly open and close the model instantly. The removal of code block containing `group-data-[filled=true]:pointer-events-auto` prevent from any unwanted user interactions and resolve the flickering issue (#3558)

.changeset/five-teachers-refuse.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+fixed the shadow clipping of card inside listbox or menubox item (#3480)

.changeset/giant-sheep-attend.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+Improved RTL support for the input component

.changeset/happy-socks-hug.md

@@ -0,0 +1,14 @@
+---
+"@nextui-org/autocomplete": patch
+"@nextui-org/date-picker": patch
+"@nextui-org/dropdown": patch
+"@nextui-org/modal": patch
+"@nextui-org/popover": patch
+"@nextui-org/select": patch
+"@nextui-org/use-aria-modal-overlay": patch
+"@nextui-org/use-aria-multiselect": patch
+"@nextui-org/use-aria-overlay": patch
+"@nextui-org/aria-utils": patch
+---
+
+Refactor overlays to reduce its complexity, while improving stability.

.changeset/healthy-clouds-refuse.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/navbar": patch
+---
+
+Fix navbar menu breaking when a numerical height value is provided. The height value is now converted to pixels if it is a number.

.changeset/lucky-schools-travel.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/input": patch
+---
+
+Fixed hover and focus of input when label placement is outside-left (#2328)

.changeset/metal-jars-rhyme.md

@@ -0,0 +1,6 @@
+---
+"@nextui-org/autocomplete": patch
+"@nextui-org/theme": patch
+---
+
+Improve clear button pointer events, keyboard reopen issue on mobile

.changeset/moody-coats-sparkle.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+Fix skeleton overflow issue (#3214 #3670)

.changeset/nice-beans-thank.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/system-rsc": patch
+---
+
+added missing `StringToBoolean<keyof V[K]>[]` (#3530)

.changeset/popular-baboons-pull.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/listbox": patch
+---
+
+Fix item highlighting in `AutocompleteSection` during keyboard navigation (#3713)

.changeset/real-cows-lie.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/popover": patch
+---
+
+Use `usePreventScroll` instead of `react-remove-scroll`; Add `shouldBlockScroll` prop to `Tooltip` (#3474).

.changeset/red-ducks-greet.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/link": patch
+---
+
+use `@nextui-org/use-aria-link` to suppress onClick deprecation warning (#3196)

.changeset/selfish-spies-visit.md

@@ -0,0 +1,7 @@
+---
+"@nextui-org/use-clipboard": patch
+"@nextui-org/use-real-shape": patch
+"@nextui-org/use-ref-state": patch
+---
+
+ensure exposed functions wrap by `useCallback`

.changeset/serious-dolls-mix.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+Improved RTL support for the select component

.changeset/seven-apricots-happen.md

@@ -0,0 +1,6 @@
+---
+"@nextui-org/modal": patch
+"@nextui-org/theme": patch
+---
+
+adjust modal position when keyboard appears (#2837)

.changeset/silver-stingrays-brush.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+export default-layout in theme

.changeset/slow-forks-nail.md

@@ -0,0 +1,6 @@
+---
+"@nextui-org/calendar": patch
+"@nextui-org/theme": patch
+---
+
+fixed arrow keys order when html has dir="rtl" (#3641, #3642)

.changeset/soft-wombats-wash.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/input": patch
+---
+
+disable clear button when input is read-only

.changeset/sweet-crabs-buy.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+fixed the double click need in chrome for checkbox, switch and radiobuttons (#3528)

.changeset/tall-walls-sell.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+The color of the selected value in SELECT component was `text-foreground-500` instead of `text-default-foreground`. Also label slot in SELECT component's UNDERLINE had no effect of color variant. The change includes the fix for the mentioned issues (#3659).

.changeset/two-radios-attend.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+Improved RTL support for the pagination component

.changeset/warm-planets-smile.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/dropdown": patch
+---
+
+fix(dropdown): respect closeOnSelect prop on DropdownItem (#2290)

.changeset/wild-apples-cheer.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/shared-utils": patch
+---
+
+fixed gregorian year offset for persian (#3602)

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -105,6 +105,6 @@ body:
         - "Safari"
         - "Edge"
         - "Opera"
-        - "Other (add additonal context)"
+        - "Other (add additional context)"
     validations:
-      required: true
+      required: true

.nvmrc

@@ -1 +1 @@
-20.x
+v20.16.0

CONTRIBUTING.md

@@ -196,7 +196,7 @@ pnpm build
 npm run build
 ```
 
-> Note: ensure your version of Node is 16 or higher to run scripts
+> Note: ensure that you have at least Node.js 20.16.0 as well as pnpm 9.6.0 or higher installed on your machine to run the scripts
 
 6. Send your pull request:
 

apps/docs/components/docs/components/code-demo/code-demo.tsx

@@ -58,7 +58,7 @@ export const CodeDemo: React.FC<CodeDemoProps> = ({
   isPreviewCentered = false,
   // when false .js files will be used
   typescriptStrict = false,
-  showOpenInCodeSandbox,
+  showOpenInCodeSandbox = true,
   isGradientBox = false,
   previewHeight = "auto",
   overflow = "visible",
@@ -139,7 +139,7 @@ export const CodeDemo: React.FC<CodeDemoProps> = ({
         files={files}
         highlightedLines={highlightedLines}
         showEditor={showEditor}
-        showOpenInCodeSandbox={showOpenInCodeSandbox || showPreview}
+        showOpenInCodeSandbox={showOpenInCodeSandbox}
         showPreview={showSandpackPreview}
         typescriptStrict={typescriptStrict}
       />

apps/docs/components/marketing/hero/hero.tsx

@@ -113,7 +113,7 @@ export const Hero = () => {
               });
             }}
           >
-            Github
+            GitHub
           </Button>
         </div>
       </div>

apps/docs/components/sandpack/use-sandpack.ts

@@ -100,13 +100,17 @@ export const useSandpack = ({
       let fileContent = files[key] as string;
 
       // Check if the file content includes 'React' import statements, if not, add it
-      if (!fileContent.includes("from 'react'") && !fileContent.includes('from "react"')) {
+      if (
+        fileContent.includes("React.") &&
+        !fileContent.includes("from 'react'") &&
+        !fileContent.includes('from "react"')
+      ) {
         fileContent = `${importReact}\n${fileContent}\n`;
       }
 
       // Check if file content includes any other dependencies, if yes, add it to dependencies
       const importRegex = /import .* from ["'](.*)["']/g;
-      let match;
+      let match: RegExpExecArray | null;
 
       while ((match = importRegex.exec(fileContent)) !== null) {
         const dependencyName = match[1];

apps/docs/content/components/table/infinite-pagination.ts

@@ -67,10 +67,98 @@ export default function App() {
   );
 }`;
 
+const AppTs = `import {Table, TableHeader, TableColumn, TableBody, TableRow, TableCell, Pagination, Spinner, getKeyValue} from "@nextui-org/react";
+import { useInfiniteScroll } from "@nextui-org/use-infinite-scroll";
+import { useAsyncList } from "@react-stately/data";
+
+interface SWCharacter {
+  name: string;
+  height: string;
+  mass: string;
+  birth_year: string;
+}
+
+export default function App() {
+  const [isLoading, setIsLoading] = React.useState<boolean>(true);
+  const [hasMore, setHasMore] = React.useState<boolean>(false);
+
+  let list = useAsyncList<SWCharacter>({
+    async load({ signal, cursor }) {
+      if (cursor) {
+        setIsLoading(false);
+      }
+
+      // If no cursor is available, then we're loading the first page.
+      // Otherwise, the cursor is the next URL to load, as returned from the previous page.
+      const res = await fetch(
+        cursor || "https://swapi.py4e.com/api/people/?search=",
+        { signal }
+      );
+      let json = await res.json();
+
+      setHasMore(json.next !== null);
+
+      return {
+        items: json.results,
+        cursor: json.next,
+      };
+    },
+  });
+
+  const [loaderRef, scrollerRef] = useInfiniteScroll({
+    hasMore,
+    onLoadMore: list.loadMore,
+  });
+
+  return (
+    <Table
+      isHeaderSticky
+      aria-label="Example table with infinite pagination"
+      baseRef={scrollerRef}
+      bottomContent={
+        hasMore ? (
+          <div className="flex w-full justify-center">
+            <Spinner ref={loaderRef} color="white" />
+          </div>
+        ) : null
+      }
+      classNames={{
+        base: "max-h-[520px] overflow-scroll",
+        table: "min-h-[400px]",
+      }}
+    >
+      <TableHeader>
+        <TableColumn key="name">Name</TableColumn>
+        <TableColumn key="height">Height</TableColumn>
+        <TableColumn key="mass">Mass</TableColumn>
+        <TableColumn key="birth_year">Birth year</TableColumn>
+      </TableHeader>
+      <TableBody
+        isLoading={isLoading}
+        items={list.items}
+        loadingContent={<Spinner color="white" />}
+      >
+        {(item: SWCharacter) => (
+          <TableRow key={item.name}>
+            {(columnKey) => (
+              <TableCell>{getKeyValue(item, columnKey)}</TableCell>
+            )}
+          </TableRow>
+        )}
+      </TableBody>
+    </Table>
+  );
+}`;
+
 const react = {
   "/App.jsx": App,
 };
 
+const reactTs = {
+  "/App.tsx": AppTs,
+};
+
 export default {
   ...react,
+  ...reactTs,
 };

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

@@ -226,6 +226,7 @@ import {useFilter} from "@react-aria/i18n";
 <CodeDemo
   title="Fully Controlled"
   showPreview={false}
+  showOpenInCodeSandbox={false}
   highlightedLines="63-64,67,69-71"
   files={autocompleteContent.fullyControlled}
 />
@@ -281,6 +282,7 @@ import {useAsyncList} from "@react-stately/data";
   typescriptStrict={true}
   title="Asynchronous Filtering"
   showPreview={false}
+  showOpenInCodeSandbox={false}
   highlightedLines="27-29,33"
   files={autocompleteContent.asyncFiltering}
 />
@@ -307,6 +309,7 @@ import {useInfiniteScroll} from "@nextui-org/use-infinite-scroll";
 
 <CodeDemo
   showPreview={false}
+  showOpenInCodeSandbox={false}
   typescriptStrict={true}
   title="Asynchronous Loading"
   highlightedLines="21-22,25,27"

apps/docs/content/docs/components/avatar.mdx

@@ -90,7 +90,8 @@ You can also provide a custom fallback component to be displayed when the `src`
 
 In case you need to customize the avatar even further, you can use the `useAvatar` hook to create your own implementation.
 
-<CodeDemo showPreview={false} title="Custom implementation" files={avatarContent.customImpl} />
+<CodeDemo showPreview={false} showOpenInCodeSandbox={false} title="Custom implementation" files={avatarContent.customImpl} />
+
 
 ### Custom initials logic
 
@@ -134,7 +135,7 @@ By passing the `isGrid` prop to the `AvatarGroup` component, the avatars will be
 In case you need to customize the avatar group even further, you can use the `useAvatarGroup` hook and the
 `AvatarGroupProvider` to create your own implementation.
 
-<CodeDemo showPreview={false} title="Custom implementation" files={avatarContent.groupCustomImpl} />
+<CodeDemo showPreview={false} showOpenInCodeSandbox={false} title="Custom implementation" files={avatarContent.groupCustomImpl} />
 
 ## Slots
 

apps/docs/content/docs/components/badge.mdx

@@ -89,6 +89,16 @@ Instead, consider supplying a comprehensive description, such as using `aria-lab
 
 <Spacer y={4} />
 
+## Slots
+
+The Badge component has two slots:
+
+- **base**: The base slot for the badge, which is the container of the badge.
+
+- **badge**: The main slot for the badge content, which is the content of the badge.
+
+<Spacer y={4} />
+
 ## API
 
 ### Badge Props

apps/docs/content/docs/components/button.mdx

@@ -101,7 +101,7 @@ You can customize the `Button` component by passing custom Tailwind CSS classes
 
 You can also use the `useButton` hook to create your own button component.
 
-<CodeDemo showPreview={false} title="Custom Implementation" files={buttonContent.customImpl} />
+<CodeDemo showPreview={false} showOpenInCodeSandbox={false} title="Custom Implementation" files={buttonContent.customImpl} />
 
 ## Button Group