@pandacss/studio 0.0.0-dev-20230613163214

package/styled-system/types/system-types.d.ts

@@ -0,0 +1,76 @@
+import type { ConditionalValue, Conditions, Nested } from './conditions'
+import type { PropertiesFallback } from './csstype'
+import type { SystemProperties, CssVarProperties } from './style-props'
+
+type String = string & {}
+type Number = number & {}
+
+/* -----------------------------------------------------------------------------
+ * Native css properties
+ * -----------------------------------------------------------------------------*/
+
+export type CssProperty = keyof PropertiesFallback
+
+export type CssProperties = PropertiesFallback<String | Number> & CssVarProperties
+
+export type CssKeyframes = {
+  [name: string]: {
+    [time: string]: CssProperties
+  }
+}
+
+/* -----------------------------------------------------------------------------
+ * Conditional css properties
+ * -----------------------------------------------------------------------------*/
+
+type MinimalNested<P> = {
+  [K in keyof Conditions]?: Nested<P>
+}
+
+type GenericProperties = {
+  [key: string]: ConditionalValue<String | Number | boolean>
+}
+
+/* -----------------------------------------------------------------------------
+ * Native css props
+ * -----------------------------------------------------------------------------*/
+
+export type NestedCssProperties = Nested<CssProperties>
+
+export type SystemStyleObject = Nested<SystemProperties & CssVarProperties>
+
+export type GlobalStyleObject = {
+  [selector: string]: SystemStyleObject
+}
+
+export type CompositionStyleObject<Property extends string> = Nested<{
+  [K in Property]?: K extends keyof SystemStyleObject ? SystemStyleObject[K] : unknown
+}>
+
+/* -----------------------------------------------------------------------------
+ * Jsx style props
+ * -----------------------------------------------------------------------------*/
+
+export type JsxStyleProps = SystemProperties &
+  MinimalNested<SystemStyleObject> & {
+    css?: SystemStyleObject
+  }
+
+type Assign<T, U> = Omit<T, keyof U> & U
+
+export type PatchedHTMLProps = {
+  htmlSize?: string | number
+  htmlWidth?: string | number
+  htmlHeight?: string | number
+  htmlTranslate?: 'yes' | 'no' | undefined
+  htmlContent?: string
+}
+
+export type OmittedHTMLProps = 'color' | 'translate' | 'transition' | 'width' | 'height' | 'size' | 'content'
+
+type WithHTMLProps<T> = Omit<T, OmittedHTMLProps> & PatchedHTMLProps
+
+export type JsxHTMLProps<T extends Record<string, any>, P extends Record<string, any> = {}> = Assign<
+  WithHTMLProps<T>,
+  P
+>

package/virtual-panda.ts

@@ -0,0 +1,72 @@
+import { analyzeTokens, findConfig, loadConfigAndCreateContext, writeAnalyzeJSON } from '@pandacss/node'
+import type { AstroIntegration } from 'astro'
+import { stringify } from 'javascript-stringify'
+import type { Plugin as VitePlugin } from 'vite'
+
+import { dirname, resolve } from 'path'
+import { fileURLToPath } from 'url'
+
+const virtualModuleId = 'virtual:panda'
+const resolvedVirtualModuleId = '\0' + virtualModuleId
+
+const _dirname = dirname(fileURLToPath(import.meta.url))
+const analysisDataFilepath = 'src/lib/analysis.json'
+const jsonPath = resolve(_dirname, analysisDataFilepath)
+
+function vitePlugin(): VitePlugin {
+  let config: any
+
+  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 () => {
+        const module = server.moduleGraph.getModuleById(resolvedVirtualModuleId)
+        if (module) {
+          await server.reloadModule(module)
+        }
+      })
+    },
+    resolveId(id) {
+      if (id === virtualModuleId) {
+        return resolvedVirtualModuleId
+      }
+      return null
+    },
+    async load(id) {
+      if (id === resolvedVirtualModuleId) {
+        return {
+          code: `export const config = ${stringify(config)}`,
+        }
+      }
+    },
+  }
+}
+
+const virtualPanda = (): AstroIntegration => ({
+  name: 'virtual:panda',
+  hooks: {
+    'astro:config:setup': ({ updateConfig, addWatchFile }) => {
+      const configPath = findConfig()
+
+      if (configPath) {
+        addWatchFile(configPath)
+      }
+
+      updateConfig({
+        vite: {
+          plugins: [vitePlugin()],
+        },
+      })
+    },
+  },
+})
+
+export default virtualPanda