@pandacss/studio 0.15.0 → 0.15.2

package/{virtual-panda.mjs → virtual-panda.ts}

@@ -1,5 +1,7 @@
-import { analyzeTokens, findConfig, loadConfigAndCreateContext, writeAnalyzeJSON } from '@pandacss/node'
+import { type PandaContext, analyzeTokens, loadConfigAndCreateContext, writeAnalyzeJSON } from '@pandacss/node'
 import { stringify } from 'javascript-stringify'
+import type { AstroIntegration } from 'astro'
+import type { PluginOption } from 'vite'
 
 import { dirname, resolve } from 'path'
 import { fileURLToPath } from 'url'
@@ -11,38 +13,39 @@ const _dirname = dirname(fileURLToPath(import.meta.url))
 const analysisDataFilepath = 'src/lib/analysis.json'
 const jsonPath = resolve(_dirname, analysisDataFilepath)
 
-/**
- * @returns import('vite').VitePlugin
- */
-function vitePlugin() {
-  let config
+function vitePlugin(configPath: string): PluginOption {
+  let config: PandaContext['config']
+
+  async function loadPandaConfig() {
+    const ctx = await loadConfigAndCreateContext({ configPath })
+    config = ctx.config
+
+    const result = analyzeTokens(ctx)
+    await writeAnalyzeJSON(jsonPath, result, ctx)
+  }
 
   return {
     name: 'vite:panda',
-    async configResolved() {
-      const ctx = await loadConfigAndCreateContext()
-      config = ctx.config
 
-      const result = analyzeTokens(ctx)
-      await writeAnalyzeJSON(jsonPath, result, ctx)
-    },
     async configureServer(server) {
-      const file = config.path
-      server.watcher.add(file).on('change', async () => {
+      server.watcher.add(configPath).on('change', async (path) => {
+        if (path !== configPath) return
+        await loadPandaConfig()
         const module = server.moduleGraph.getModuleById(resolvedVirtualModuleId)
-        if (module) {
-          await server.reloadModule(module)
-        }
+        if (module) await server.reloadModule(module)
       })
     },
+
     resolveId(id) {
       if (id === virtualModuleId) {
         return resolvedVirtualModuleId
       }
       return null
     },
+
     async load(id) {
       if (id === resolvedVirtualModuleId) {
+        await loadPandaConfig()
         return {
           code: `export const config = ${stringify(config)}`,
         }
@@ -51,22 +54,15 @@ function vitePlugin() {
   }
 }
 
-/**
- * @returns import('astro').AstroIntegration
- */
-const virtualPanda = () => ({
+const virtualPanda = (): AstroIntegration => ({
   name: 'virtual:panda',
   hooks: {
-    'astro:config:setup': ({ updateConfig, addWatchFile }) => {
-      const configPath = findConfig()
-
-      if (configPath) {
-        addWatchFile(configPath)
-      }
+    'astro:config:setup': ({ updateConfig }) => {
+      const configPath = process.env.PUBLIC_CONFIG_PATH
 
       updateConfig({
         vite: {
-          plugins: [vitePlugin()],
+          plugins: [vitePlugin(configPath!)],
         },
       })
     },

package/styled-system/chunks/..__core____tests____atomic-rule.test.css

@@ -1,216 +0,0 @@
-@layer utilities {
-  .styles\:text_red\! {
-    color: red !important
-    }
-
-  .styles\:fs_30px\! {
-    font-size: 30px !important
-    }
-
-  .styles\:bg_red\.300 {
-    background: var(--colors-red-300)
-    }
-
-  .styles\:w_20px {
-    width: 20px
-    }
-
-  .styles\:w_70px {
-    width: 70px
-    }
-
-  .styles\:w_50px {
-    width: 50px
-    }
-      @media screen and (min-width: 40em) {
-    [dir=ltr] .styles\:ltr\:sm\:ml_4 {
-        margin-left: var(--spacing-4)
-        }
-            }
-    [dir=rtl] .styles\:rtl\:ml_-4 {
-      margin-left: calc(var(--spacing-4) * -1)
-        }
-    .styles\:light\:text_red.light, .light .styles\:light\:text_red {
-      color: red
-        }
-    .styles\:dark\:text_green.dark, .dark .styles\:dark\:text_green {
-      color: green
-        }
-    .styles\:dark\:opacity_slate400.dark, .dark .styles\:dark\:opacity_slate400 {
-      opacity: slate400
-        }
-      @media screen and (min-width: 40em) {
-    [dir=rtl] .styles\:sm\:rtl\:top_20px {
-        top: 20px
-        }
-            }
-    .styles\:left_20px,.styles\:\[\&_\>_p\]\:left_20px > p {
-      left: 20px
-        }
-      @media screen and (min-width: 48em) {
-    .styles\:\[\&_\>_p\]\:md\:left_40px > p {
-        left: 40px
-        }
-            }
-      .styles\:\[\&_\>_p\]\:light\:bg_red400 > p.light, .light .styles\:\[\&_\>_p\]\:light\:bg_red400 > p {
-        background: red400
-            }
-      .styles\:\[\&_\>_p\]\:dark\:bg_green500 > p.dark, .dark .styles\:\[\&_\>_p\]\:dark\:bg_green500 > p {
-        background: green500
-            }
-      [dir=rtl] .styles\:\[\&_\>_p\]\:rtl\:font_sans > p {
-        font: sans
-            }
-    .styles\:\[\&\:\:placeholder\]\:left_40px::placeholder {
-      left: 40px
-        }
-    .styles\:\[\&\:\:placeholder\]\:bg_red400::placeholder {
-      background: red400
-        }
-      @media screen and (min-width: 40em) {
-    .styles\:\[\&\:\:placeholder\]\:sm\:text_left::placeholder {
-        text-align: left
-        }
-            }
-
-  .styles\:all_unset {
-    all: unset
-    }
-
-  .styles\:bg_red {
-    background-color: red
-    }
-
-  .styles\:border_none {
-    border: var(--borders-none)
-    }
-
-  .styles\:p_\$3_\$3 {
-    padding: $3 $3
-    }
-
-  .styles\:rounded_\$button {
-    border-radius: $button
-    }
-
-  .styles\:fs_\$xsmall {
-    font-size: $xsmall
-    }
-
-  .styles\:cursor_pointer {
-    cursor: pointer
-    }
-    .styles\:\[\&_\+_span\]\:ml_\$2 + span {
-      margin-left: $2
-        }
-    .test .styles\:\[\.test_\&\]\:bg_blue {
-      background-color: blue
-        }
-    .styles\:\[\&_\.my-class\]\:text_red .my-class,.styles\:\[\&_span\]\:text_red span,.styles\:\[\&_kbd\]\:text_red kbd {
-      color: red
-        }
-    .styles\:\[\&\:focus\,_\&\:hover\]\:shadow_none:focus, .styles\:\[\&\:focus\,_\&\:hover\]\:shadow_none:hover {
-      box-shadow: none
-        }
-    :focus > .styles\:\[\:focus_\>_\&\]\:text_white {
-      color: var(--colors-white)
-        }
-      @media screen and (min-width: 40em) {
-    .styles\:sm\:hover\:top_50px:is(:hover, [data-hover]) {
-        top: 50px
-        }
-            }
-            @media screen and (min-width: 40em) {
-          [dir=ltr] .styles\:\[\&_\>_p\]\:ltr\:dark\:sm\:hover\:font_serif > p:is(:hover, [data-hover]).dark, .dark [dir=ltr] .styles\:\[\&_\>_p\]\:ltr\:dark\:sm\:hover\:font_serif > p:is(:hover, [data-hover]) {
-              font: serif
-                    }
-                        }
-    input:hover .styles\:\[input\:hover_\&\]\:bg_red400 {
-      background: red400
-        }
-      @media screen and (min-width: 40em) {
-    input:hover .styles\:\[input\:hover_\&\]\:sm\:fs_14px {
-        font-size: 14px
-        }
-            }
-      @media screen and (min-width: 64em) {
-    input:hover .styles\:\[input\:hover_\&\]\:lg\:fs_18px {
-        font-size: 18px
-        }
-            }
-    .styles\:hover\:bg_pink\.400:is(:hover, [data-hover]) {
-      background: var(--colors-pink-400)
-        }
-        @media screen and (min-width: 40em) {
-      .styles\:hover\:sm\:dark\:bg_red\.300:is(:hover, [data-hover]).dark, .dark .styles\:hover\:sm\:dark\:bg_red\.300:is(:hover, [data-hover]) {
-          background: var(--colors-red-300)
-            }
-                }
-    .styles\:hover\:text_pink\.400:is(:hover, [data-hover]) {
-      color: var(--colors-pink-400)
-        }
-        @media screen and (min-width: 40em) {
-      .styles\:hover\:disabled\:sm\:bg_red\.300:is(:hover, [data-hover]):is(:disabled, [disabled], [data-disabled]) {
-          background: var(--colors-red-300)
-            }
-                }
-      @media base {
-    .styles\:\[\@media_base\]\:\[\&\:hover\]\:left_40px:hover {
-        left: 40px
-        }
-            }
-      @media base {
-        @media screen and (min-width: 40em) {
-    .styles\:\[\@media_base\]\:\[\&\:hover\]\:sm\:text_left:hover {
-          text-align: left
-        }
-                }
-            }
-      @media (min-width: 768px) {
-    .styles\:\[\@media_\(min-width\:_768px\)\]\:\[\&\:hover\]\:bg_yellow:hover {
-        background-color: yellow
-        }
-            }
-    @media screen and (min-width: 40em) {
-
-  .styles\:sm\:w_60px {
-      width: 60px
-    }
-        }
-    @media screen and (min-width: 64em) {
-
-  .styles\:lg\:top_120px {
-      top: 120px
-    }
-        }
-    @media screen and (min-width: 48em) {
-
-  .styles\:md\:left_40px {
-      left: 40px
-    }
-        }
-    @media base {
-
-  .styles\:\[\@media_base\]\:left_40px {
-      left: 40px
-    }
-        }
-    @media base {
-      @media screen and (min-width: 40em) {
-
-  .styles\:\[\@media_base\]\:sm\:text_left {
-        text-align: left
-    }
-            }
-        }
-    @media (min-width: 768px) {
-
-  .styles\:\[\@media_\(min-width\:_768px\)\]\:bg_green {
-      background-color: green
-    }
-
-  .styles\:\[\@media_\(min-width\:_768px\)\]\:fs_\$small {
-      font-size: $small
-    }
-        }
-}