[core] Fix thrown error during eval phase (#196)

apps/pigment-css-next-app/src/app/grid/page.tsx

@@ -13,7 +13,7 @@ const Item = styled.div`
 
 function GridDemo1() {
   return (
-    <Grid container spacing={2}>
+    <Grid container spacing={2} sx={{ color: '#070707' }}>
       <Grid size={8}>
         <Item>size=8</Item>
       </Grid>

packages/pigment-css-react/src/css.js

@@ -1,4 +1,12 @@
+/**
+ * `__wyw_dynamic_import` is a special global var that is set during the evaluation phase by wyw.
+ * So during eval phase, it can happen that some code is calling the runtime function.
+ * We do not want to throw error in that case as we want the evaluation to happen.
+ */
 export default function css() {
+  if (typeof __wyw_dynamic_import !== 'undefined') {
+    return;
+  }
   throw new Error(
     `${process.env.PACKAGE_NAME}: You were trying to call "css" function without configuring your bundler. Make sure to install the bundler specific plugin and use it. @pigment-css/vite-plugin for Vite integration or @pigment-css/nextjs-plugin for Next.js integration.`,
   );

packages/pigment-css-react/src/generateAtomics.js

@@ -1,6 +1,14 @@
 import cx from 'clsx';
 
+/**
+ * `__wyw_dynamic_import` is a special global var that is set during the evaluation phase by wyw.
+ * So during eval phase, it can happen that some code is calling the runtime function.
+ * We do not want to throw error in that case as we want the evaluation to happen.
+ */
 export function generateAtomics() {
+  if (typeof __wyw_dynamic_import !== 'undefined') {
+    return;
+  }
   throw new Error(
     `${process.env.PACKAGE_NAME}: You were trying to call "generateAtomics" function without configuring your bundler. Make sure to install the bundler specific plugin and use it. @pigment-css/vite-plugin for Vite integration or @pigment-css/nextjs-plugin for Next.js integration.`,
   );

packages/pigment-css-react/src/globalCss.js

@@ -1,4 +1,12 @@
+/**
+ * `__wyw_dynamic_import` is a special global var that is set during the evaluation phase by wyw.
+ * So during eval phase, it can happen that some code is calling the runtime function.
+ * We do not want to throw error in that case as we want the evaluation to happen.
+ */
 export default function globalCss() {
+  if (typeof __wyw_dynamic_import !== 'undefined') {
+    return;
+  }
   throw new Error(
     `${process.env.PACKAGE_NAME}: You were trying to call "globalCss" function without configuring your bundler. Make sure to install the bundler specific plugin and use it. @pigment-css/vite-plugin for Vite integration or @pigment-css/nextjs-plugin for Next.js integration.`,
   );

packages/pigment-css-react/src/keyframes.js

@@ -1,4 +1,12 @@
+/**
+ * `__wyw_dynamic_import` is a special global var that is set during the evaluation phase by wyw.
+ * So during eval phase, it can happen that some code is calling the runtime function.
+ * We do not want to throw error in that case as we want the evaluation to happen.
+ */
 export default function keyframes() {
+  if (typeof __wyw_dynamic_import !== 'undefined') {
+    return;
+  }
   throw new Error(
     `${process.env.PACKAGE_NAME}: You were trying to call "keyframes" function without configuring your bundler. Make sure to install the bundler specific plugin and use it. @pigment-css/vite-plugin for Vite integration or @pigment-css/nextjs-plugin for Next.js integration.`,
   );

packages/pigment-css-react/src/useTheme.js

@@ -1,4 +1,12 @@
+/**
+ * `__wyw_dynamic_import` is a special global var that is set during the evaluation phase by wyw.
+ * So during eval phase, it can happen that some code is calling the runtime function.
+ * We do not want to throw error in that case as we want the evaluation to happen.
+ */
 export default function useTheme() {
+  if (typeof __wyw_dynamic_import !== 'undefined') {
+    return;
+  }
   throw new Error(
     `${process.env.PACKAGE_NAME}: You were trying to call "useTheme" function without configuring your bundler. Make sure to install the bundler specific plugin and use it. @pigment-css/vite-plugin for Vite integration or @pigment-css/nextjs-plugin for Next.js integration.`,
   );