From a4543e17f94dd3eb3d35f481aafa95515a4e4d77 Mon Sep 17 00:00:00 2001 From: abhinandan-verma Date: Mon, 22 Jul 2024 02:42:07 +0530 Subject: [PATCH 1/6] fix(navbar): fixed the height when style h-full --- .changeset/brown-days-applaud.md | 5 +++++ packages/core/theme/src/components/navbar.ts | 2 +- 2 files changed, 6 insertions(+), 1 deletion(-) create mode 100644 .changeset/brown-days-applaud.md diff --git a/.changeset/brown-days-applaud.md b/.changeset/brown-days-applaud.md new file mode 100644 index 0000000000..4a8909bfc2 --- /dev/null +++ b/.changeset/brown-days-applaud.md @@ -0,0 +1,5 @@ +--- +"@nextui-org/theme": patch +--- + +fixed the navbar height when `h-full`(#1694) diff --git a/packages/core/theme/src/components/navbar.ts b/packages/core/theme/src/components/navbar.ts index e1ef852de2..93a7468020 100644 --- a/packages/core/theme/src/components/navbar.ts +++ b/packages/core/theme/src/components/navbar.ts @@ -52,7 +52,7 @@ const navbar = tv({ "flex", "z-40", "w-full", - "h-auto", + "max-h-[var(--navbar-height)]", "items-center", "justify-center", "data-[menu-open=true]:border-none", From 626e0e0cae4d7d63dd903bac3eefa685b7924466 Mon Sep 17 00:00:00 2001 From: abhinandan-verma Date: Mon, 22 Jul 2024 02:57:20 +0530 Subject: [PATCH 2/6] fix(navbar): fixed the height when style h-full --- packages/core/theme/src/components/navbar.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/core/theme/src/components/navbar.ts b/packages/core/theme/src/components/navbar.ts index 93a7468020..e1ef852de2 100644 --- a/packages/core/theme/src/components/navbar.ts +++ b/packages/core/theme/src/components/navbar.ts @@ -52,7 +52,7 @@ const navbar = tv({ "flex", "z-40", "w-full", - "max-h-[var(--navbar-height)]", + "h-auto", "items-center", "justify-center", "data-[menu-open=true]:border-none", From e4d51555e2536bbf234db67130d1448174025987 Mon Sep 17 00:00:00 2001 From: abhinandan-verma Date: Wed, 31 Jul 2024 11:34:57 +0530 Subject: [PATCH 3/6] docs(sandpack): improved logic for react imoprt --- apps/docs/components/sandpack/use-sandpack.ts | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/apps/docs/components/sandpack/use-sandpack.ts b/apps/docs/components/sandpack/use-sandpack.ts index c2f0988d38..6e3e2a8052 100644 --- a/apps/docs/components/sandpack/use-sandpack.ts +++ b/apps/docs/components/sandpack/use-sandpack.ts @@ -16,12 +16,18 @@ export interface UseSandpackProps { const importReact = 'import React from "react";'; +// to check if the currebt file has `.jsx` or `.tsx` extension +function isReactFile(key: string) { + return key.endsWith(".jsx") || key.endsWith(".tsx"); +} + export const useSandpack = ({ files = {}, typescriptStrict = false, template = "vite-react", highlightedLines, }: UseSandpackProps) => { + debugger; // once the user select a template we store it in local storage const [currentTemplate, setCurrentTemplate] = useLocalStorage( "currentTemplate", @@ -99,14 +105,20 @@ export const useSandpack = ({ .reduce((acc, key) => { let fileContent = files[key] as string; + const isReact = isReactFile(key); + // Check if the file content includes 'React' import statements, if not, add it - if (!fileContent.includes("from 'react'") && !fileContent.includes('from "react"')) { + if ( + isReact && + !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]; From 4f9edff3abd97a1faf749c9dd28f1dbac1f45582 Mon Sep 17 00:00:00 2001 From: Abhinandan Date: Wed, 31 Jul 2024 11:40:33 +0530 Subject: [PATCH 4/6] Delete .changeset/brown-days-applaud.md --- .changeset/brown-days-applaud.md | 5 ----- 1 file changed, 5 deletions(-) delete mode 100644 .changeset/brown-days-applaud.md diff --git a/.changeset/brown-days-applaud.md b/.changeset/brown-days-applaud.md deleted file mode 100644 index 4a8909bfc2..0000000000 --- a/.changeset/brown-days-applaud.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -"@nextui-org/theme": patch ---- - -fixed the navbar height when `h-full`(#1694) From e1b00829e812770d52b830a0e21ddf622308fecd Mon Sep 17 00:00:00 2001 From: Abhinandan Date: Wed, 31 Jul 2024 11:56:44 +0530 Subject: [PATCH 5/6] Update use-sandpack.ts --- apps/docs/components/sandpack/use-sandpack.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/apps/docs/components/sandpack/use-sandpack.ts b/apps/docs/components/sandpack/use-sandpack.ts index 6e3e2a8052..ebb041269d 100644 --- a/apps/docs/components/sandpack/use-sandpack.ts +++ b/apps/docs/components/sandpack/use-sandpack.ts @@ -16,7 +16,7 @@ export interface UseSandpackProps { const importReact = 'import React from "react";'; -// to check if the currebt file has `.jsx` or `.tsx` extension +// to check if the current file has `.jsx` or `.tsx` extension function isReactFile(key: string) { return key.endsWith(".jsx") || key.endsWith(".tsx"); } @@ -27,7 +27,6 @@ export const useSandpack = ({ template = "vite-react", highlightedLines, }: UseSandpackProps) => { - debugger; // once the user select a template we store it in local storage const [currentTemplate, setCurrentTemplate] = useLocalStorage( "currentTemplate", From 8fa9740a3d933d8b3717f6f0b13a295ab40fcbec Mon Sep 17 00:00:00 2001 From: WK Wong Date: Thu, 1 Aug 2024 21:27:13 +0800 Subject: [PATCH 6/6] refactor(docs): skip adding import react if not required --- apps/docs/components/sandpack/use-sandpack.ts | 9 +-------- 1 file changed, 1 insertion(+), 8 deletions(-) diff --git a/apps/docs/components/sandpack/use-sandpack.ts b/apps/docs/components/sandpack/use-sandpack.ts index ebb041269d..d3d62b23e4 100644 --- a/apps/docs/components/sandpack/use-sandpack.ts +++ b/apps/docs/components/sandpack/use-sandpack.ts @@ -16,11 +16,6 @@ export interface UseSandpackProps { const importReact = 'import React from "react";'; -// to check if the current file has `.jsx` or `.tsx` extension -function isReactFile(key: string) { - return key.endsWith(".jsx") || key.endsWith(".tsx"); -} - export const useSandpack = ({ files = {}, typescriptStrict = false, @@ -104,11 +99,9 @@ export const useSandpack = ({ .reduce((acc, key) => { let fileContent = files[key] as string; - const isReact = isReactFile(key); - // Check if the file content includes 'React' import statements, if not, add it if ( - isReact && + fileContent.includes("React.") && !fileContent.includes("from 'react'") && !fileContent.includes('from "react"') ) {