From 239a3cd403271af66119fdfd28ee8f284cd43e0d Mon Sep 17 00:00:00 2001
From: Segun Adebayo <joseshegs@gmail.com>
Date: Sat, 13 Aug 2022 10:57:04 +0400
Subject: [PATCH] refactor: env package

---
 .changeset/many-rivers-listen.md |  6 ++++++
 packages/env/package.json        |  3 ---
 packages/env/src/env.tsx         | 24 +++++++++++++-----------
 pnpm-lock.yaml                   |  3 ---
 4 files changed, 19 insertions(+), 17 deletions(-)
 create mode 100644 .changeset/many-rivers-listen.md

diff --git a/.changeset/many-rivers-listen.md b/.changeset/many-rivers-listen.md
new file mode 100644
index 00000000000..7e0b153a97a
--- /dev/null
+++ b/.changeset/many-rivers-listen.md
@@ -0,0 +1,6 @@
+---
+"@chakra-ui/react-env": patch
+---
+
+- Omit rendered env span when the environment prop is passed. - Add `id` and
+  `hidden` attributes to the rendered env span
diff --git a/packages/env/package.json b/packages/env/package.json
index d8bb3fdc699..c8deff12d2e 100644
--- a/packages/env/package.json
+++ b/packages/env/package.json
@@ -31,9 +31,6 @@
   "bugs": {
     "url": "https://github.com/chakra-ui/chakra-ui/issues"
   },
-  "dependencies": {
-    "@chakra-ui/utils": "workspace:*"
-  },
   "peerDependencies": {
     "react": ">=18"
   },
diff --git a/packages/env/src/env.tsx b/packages/env/src/env.tsx
index abec4b94fd8..09db09b1624 100644
--- a/packages/env/src/env.tsx
+++ b/packages/env/src/env.tsx
@@ -1,4 +1,3 @@
-import { isBrowser, __DEV__ } from "@chakra-ui/utils"
 import {
   createContext,
   startTransition,
@@ -20,13 +19,12 @@ const mockEnv = {
   document: ssrDocument,
 }
 
-const defaultEnv: Environment = isBrowser ? { window, document } : mockEnv
+const defaultEnv: Environment =
+  typeof window !== "undefined" ? { window, document } : mockEnv
 
 const EnvironmentContext = createContext(defaultEnv)
 
-if (__DEV__) {
-  EnvironmentContext.displayName = "EnvironmentContext"
-}
+EnvironmentContext.displayName = "EnvironmentContext"
 
 export function useEnvironment() {
   return useContext(EnvironmentContext)
@@ -45,18 +43,24 @@ export function EnvironmentProvider(props: EnvironmentProviderProps) {
   useEffect(() => setMounted(true), [])
 
   const context = useMemo(() => {
+    if (environmentProp) {
+      return environmentProp
+    }
+
     const doc = node?.ownerDocument
     const win = node?.ownerDocument.defaultView
-    const nodeEnv = doc ? { document: doc, window: win } : undefined
-    const env = environmentProp ?? nodeEnv ?? defaultEnv
+
+    const env = doc ? { document: doc, window: win } : defaultEnv
     return env as Environment
   }, [node, environmentProp])
 
   return (
     <EnvironmentContext.Provider value={context}>
       {children}
-      {mounted && (
+      {!environmentProp && mounted && (
         <span
+          id="__chakra_env"
+          hidden
           ref={(el) => {
             startTransition(() => {
               if (el) setNode(el)
@@ -68,6 +72,4 @@ export function EnvironmentProvider(props: EnvironmentProviderProps) {
   )
 }
 
-if (__DEV__) {
-  EnvironmentProvider.displayName = "EnvironmentProvider"
-}
+EnvironmentProvider.displayName = "EnvironmentProvider"
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1a0965fb733..22a0fd04289 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -643,12 +643,9 @@ importers:
 
   packages/env:
     specifiers:
-      '@chakra-ui/utils': workspace:*
       '@types/react-frame-component': ^4.1.1
       react: ^18.2.0
       react-frame-component: ^5.2.3
-    dependencies:
-      '@chakra-ui/utils': link:../utils
     devDependencies:
       '@types/react-frame-component': 4.1.3
       react: 18.2.0