{"version":3,"sources":["../../../src/utilities/LocalColorSchemeArea/LocalColorSchemeArea.tsx"],"names":["jsx","themeToString","theme","LocalColorSchemeArea","props","__spreadValues"],"mappings":";yVAmBI,cAAAA,MAAA,6BAVJ,IAAMC,EAAiBC,GACrBA,IAAU,aAAQA,IAAU,QAAU,QAAU,OAOrCC,EAAwBC,GAEjCJ,EAAC,WAAQ,UAAW,QAAQC,EAAcG,EAAM,KAAK,CAAC,cAAe,IAAKC,EAAA,GAAKD,EAAM,IAClF,SAAAA,EAAM,SACT","sourcesContent":["/** @jsxImportSource @emotion/react */\n\nimport type { CSSProperties, PropsWithChildren } from \"react\";\n\ntype LocalColorSchemeAreaProps = PropsWithChildren & {\n  sx?: CSSProperties;\n  theme: \"light\" | \"dark\" | \"🌝\" | \"🌚\";\n};\n\nconst themeToString = (theme: LocalColorSchemeAreaProps[\"theme\"]) =>\n  theme === \"🌝\" || theme === \"light\" ? \"light\" : \"dark\";\n\n/**\n * html의 theme을 무시하고, 해당 컴포넌트를 기준으로 theme을 설정할 수 있습니다.\n *\n * children 요소는 section tag 로 감싸지며 sx를 통해 section tag의 style을 직접 조정할 수 있습니다.\n */\nexport const LocalColorSchemeArea = (props: LocalColorSchemeAreaProps) => {\n  return (\n    <section className={`clay-${themeToString(props.theme)}-theme-area`} css={{ ...props.sx }}>\n      {props.children}\n    </section>\n  );\n};\n"]}