From 6806fb1d86f26a3194980cbabfb219ce6cf382de Mon Sep 17 00:00:00 2001
From: cjhih456 <42570411+cjhih456@users.noreply.github.com>
Date: Wed, 8 Jan 2025 18:52:08 +0900
Subject: [PATCH] issue: emotion jsx covered by emotion

https://github.com/emotion-js/emotion/issues/1404
https://emotion.sh/docs/css-prop#gotchas
---
 .../ui/Form/InputLayout/InputLayoutContext.ts   |  6 +++---
 src/components/ui/Form/InputLayout/index.tsx    | 17 +----------------
 2 files changed, 4 insertions(+), 19 deletions(-)

diff --git a/src/components/ui/Form/InputLayout/InputLayoutContext.ts b/src/components/ui/Form/InputLayout/InputLayoutContext.ts
index 6b5d852..f96e9ba 100644
--- a/src/components/ui/Form/InputLayout/InputLayoutContext.ts
+++ b/src/components/ui/Form/InputLayout/InputLayoutContext.ts
@@ -1,12 +1,12 @@
 import { createContext } from 'react'
 
 export interface InputLayoutContextValues {
-  isValid: boolean,
-  isError: boolean,
+  isValid?: boolean,
+  error?: string,
 }
 
 const InputLayoutContext = createContext<InputLayoutContextValues>({
   isValid: false,
-  isError: false,
+  error: '',
 })
 export default InputLayoutContext
\ No newline at end of file
diff --git a/src/components/ui/Form/InputLayout/index.tsx b/src/components/ui/Form/InputLayout/index.tsx
index d58838c..1737fec 100644
--- a/src/components/ui/Form/InputLayout/index.tsx
+++ b/src/components/ui/Form/InputLayout/index.tsx
@@ -1,6 +1,5 @@
 import type { InputLayoutContextValues } from './InputLayoutContext';
 import type { ReactNode } from 'react';
-import { cloneElement } from 'react';
 import InputLayoutContext from './InputLayoutContext';
 import InputError from './atom/InputError';
 import InputLabel from './atom/InputLabel';
@@ -9,29 +8,15 @@ import InputPostfix from './atom/InputPostfix';
 import InputPrefix from './atom/InputPrefix';
 import InputShell from './atom/InputShell';
 import InputTag from './atom/InputTag';
-import { getFilteredElement } from './utils/getFilteredElement';
 
 interface InputLayoutProps {
   children: ReactNode
 }
 const InputLayout = ({ children, className, ...props }: InputLayoutProps & CssProps & InputLayoutContextValues) => {
-  const errorElements = getFilteredElement(children, InputError)
-  const labelElements = getFilteredElement(children, InputLabel)
-  const outlineElement = getFilteredElement(children, InputOutline)
-  const postfixElement = getFilteredElement(children, InputPostfix)
-  const prefixElement = getFilteredElement(children, InputPrefix)
-  const shellElement = getFilteredElement(children, InputShell)
-  const inputElement = getFilteredElement(children, InputTag)
 
-  const displayShellElement = cloneElement(
-    shellElement[0] || <div />,
-    [prefixElement, inputElement, postfixElement, labelElements, outlineElement].flat().filter(Boolean)
-  )
-  console.log(shellElement)
   return <InputLayoutContext.Provider value={props}>
     <div className={className}>
-      {displayShellElement}
-      {errorElements}
+      {children}
     </div>
   </InputLayoutContext.Provider>
 }