@pandacss/studio 0.4.0 → 0.5.1

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

@@ -57,7 +57,7 @@ export type JsxStyleProps = SystemProperties &
     css?: SystemStyleObject
   }
 
-type Assign<T, U> = Omit<T, keyof U> & U
+export type Assign<T, U> = Omit<T, keyof U> & U
 
 export type PatchedHTMLProps = {
   htmlSize?: string | number

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

@@ -1,7 +1,5 @@
 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'
@@ -13,8 +11,11 @@ const _dirname = dirname(fileURLToPath(import.meta.url))
 const analysisDataFilepath = 'src/lib/analysis.json'
 const jsonPath = resolve(_dirname, analysisDataFilepath)
 
-function vitePlugin(): VitePlugin {
-  let config: any
+/**
+ * @returns import('vite').VitePlugin
+ */
+function vitePlugin() {
+  let config
 
   return {
     name: 'vite:panda',
@@ -50,7 +51,10 @@ function vitePlugin(): VitePlugin {
   }
 }
 
-const virtualPanda = (): AstroIntegration => ({
+/**
+ * @returns import('astro').AstroIntegration
+ */
+const virtualPanda = () => ({
   name: 'virtual:panda',
   hooks: {
     'astro:config:setup': ({ updateConfig, addWatchFile }) => {

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

@@ -1,363 +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;
-  }
-
-  .styles\:ltr\:sm\:ml_4 {
-    [dir='ltr'] & {
-      @media screen and (min-width: 640px) {
-        margin-left: var(--spacing-4);
-      }
-    }
-  }
-
-  .styles\:rtl\:ml_-4 {
-    [dir='rtl'] & {
-      margin-left: calc(var(--spacing-4) * -1);
-    }
-  }
-
-  .styles\:light\:text_red {
-    &.light,
-    .light & {
-      color: red;
-    }
-  }
-
-  .styles\:dark\:text_green {
-    &.dark,
-    .dark & {
-      color: green;
-    }
-  }
-
-  .styles\:dark\:opacity_slate400 {
-    &.dark,
-    .dark & {
-      opacity: slate400;
-    }
-  }
-
-  .styles\:sm\:rtl\:top_20px {
-    [dir='rtl'] & {
-      @media screen and (min-width: 640px) {
-        top: 20px;
-      }
-    }
-  }
-
-  .styles\:left_20px {
-    left: 20px;
-  }
-
-  .styles\:\[\&_\>_p\]\:left_20px {
-    & > p {
-      left: 20px;
-    }
-  }
-
-  .styles\:\[\&_\>_p\]\:md\:left_40px {
-    & > p {
-      @media screen and (min-width: 768px) {
-        left: 40px;
-      }
-    }
-  }
-
-  .styles\:\[\&_\>_p\]\:light\:bg_red400 {
-    & > p {
-      &.light,
-      .light & {
-        background: red400;
-      }
-    }
-  }
-
-  .styles\:\[\&_\>_p\]\:dark\:bg_green500 {
-    & > p {
-      &.dark,
-      .dark & {
-        background: green500;
-      }
-    }
-  }
-
-  .styles\:\[\&_\>_p\]\:rtl\:font_sans {
-    & > p {
-      [dir='rtl'] & {
-        font: sans;
-      }
-    }
-  }
-
-  .styles\:\[\&\:\:placeholder\]\:left_40px {
-    &::placeholder {
-      left: 40px;
-    }
-  }
-
-  .styles\:\[\&\:\:placeholder\]\:bg_red400 {
-    &::placeholder {
-      background: red400;
-    }
-  }
-
-  .styles\:\[\&\:\:placeholder\]\:sm\:text_left {
-    &::placeholder {
-      @media screen and (min-width: 640px) {
-        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;
-    }
-  }
-
-  .styles\:\[\.test_\&\]\:bg_blue {
-    .test & {
-      background-color: blue;
-    }
-  }
-
-  .styles\:\[\&_\.my-class\]\:text_red {
-    & .my-class {
-      color: red;
-    }
-  }
-
-  .styles\:\[\&_span\]\:text_red {
-    & span {
-      color: red;
-    }
-  }
-
-  .styles\:\[\&_kbd\]\:text_red {
-    & kbd {
-      color: red;
-    }
-  }
-
-  .styles\:\[\&\:focus\,_\&\:hover\]\:shadow_none {
-    &:focus,
-    &:hover {
-      box-shadow: none;
-    }
-  }
-
-  .styles\:\[\:focus_\>_\&\]\:text_white {
-    :focus > & {
-      color: var(--colors-white);
-    }
-  }
-
-  .styles\:sm\:hover\:top_50px {
-    &:where(:hover, [data-hover]) {
-      @media screen and (min-width: 640px) {
-        top: 50px;
-      }
-    }
-  }
-
-  .styles\:\[\&_\>_p\]\:ltr\:dark\:sm\:hover\:font_serif {
-    & > p {
-      &:where(:hover, [data-hover]) {
-        [dir='ltr'] & {
-          &.dark,
-          .dark & {
-            @media screen and (min-width: 640px) {
-              font: serif;
-            }
-          }
-        }
-      }
-    }
-  }
-
-  .styles\:\[input\:hover_\&\]\:bg_red400 {
-    input:hover & {
-      background: red400;
-    }
-  }
-
-  .styles\:\[input\:hover_\&\]\:sm\:fs_14px {
-    input:hover & {
-      @media screen and (min-width: 640px) {
-        font-size: 14px;
-      }
-    }
-  }
-
-  .styles\:\[input\:hover_\&\]\:lg\:fs_18px {
-    input:hover & {
-      @media screen and (min-width: 1024px) {
-        font-size: 18px;
-      }
-    }
-  }
-
-  .styles\:hover\:bg_pink\.400 {
-    &:where(:hover, [data-hover]) {
-      background: var(--colors-pink-400);
-    }
-  }
-
-  .styles\:hover\:sm\:dark\:bg_red\.300 {
-    &:where(:hover, [data-hover]) {
-      &.dark,
-      .dark & {
-        @media screen and (min-width: 640px) {
-          background: var(--colors-red-300);
-        }
-      }
-    }
-  }
-
-  .styles\:hover\:text_pink\.400 {
-    &:where(:hover, [data-hover]) {
-      color: var(--colors-pink-400);
-    }
-  }
-
-  .styles\:hover\:disabled\:sm\:bg_red\.300 {
-    &:where(:hover, [data-hover]) {
-      &:where(:disabled, [disabled], [data-disabled]) {
-        @media screen and (min-width: 640px) {
-          background: var(--colors-red-300);
-        }
-      }
-    }
-  }
-
-  .styles\:\[\@media_base\]\:\[\&\:hover\]\:left_40px {
-    &:hover {
-      @media base {
-        left: 40px;
-      }
-    }
-  }
-
-  .styles\:\[\@media_base\]\:\[\&\:hover\]\:sm\:text_left {
-    &:hover {
-      @media base {
-        @media screen and (min-width: 640px) {
-          text-align: left;
-        }
-      }
-    }
-  }
-
-  .styles\:\[\@media_\(min-width\:_768px\)\]\:\[\&\:hover\]\:bg_yellow {
-    &:hover {
-      @media (min-width: 768px) {
-        background-color: yellow;
-      }
-    }
-  }
-
-  .styles\:sm\:w_60px {
-    @media screen and (min-width: 640px) {
-      width: 60px;
-    }
-  }
-
-  .styles\:sm\:w_60px {
-    @media screen and (min-width: 640px) {
-      width: 60px;
-    }
-  }
-
-  .styles\:lg\:top_120px {
-    @media screen and (min-width: 1024px) {
-      top: 120px;
-    }
-  }
-
-  .styles\:md\:left_40px {
-    @media screen and (min-width: 768px) {
-      left: 40px;
-    }
-  }
-
-  .styles\:\[\@media_base\]\:left_40px {
-    @media base {
-      left: 40px;
-    }
-  }
-
-  .styles\:\[\@media_base\]\:sm\:text_left {
-    @media base {
-      @media screen and (min-width: 640px) {
-        text-align: left;
-      }
-    }
-  }
-
-  .styles\:\[\@media_\(min-width\:_768px\)\]\:bg_green {
-    @media (min-width: 768px) {
-      background-color: green;
-    }
-  }
-
-  .styles\:\[\@media_\(min-width\:_768px\)\]\:bg_green {
-    @media (min-width: 768px) {
-      background-color: green;
-    }
-  }
-
-  .styles\:\[\@media_\(min-width\:_768px\)\]\:fs_\$small {
-    @media (min-width: 768px) {
-      font-size: $small;
-    }
-  }
-}

package/styled-system/chunks/src__components__analyzer__quick-tooltip.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__components__analyzer__token-search-combobox.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__layouts__Layout.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__colors.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__font-sizes.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__font-weights.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__fonts.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__index.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__layer-styles.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__letter-spacings.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__line-heights.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__playground__contrast-checker.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__playground__typography.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__radii.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__sizes.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__spacing.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__text-styles.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__token-analyzer__file.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__token-analyzer__index.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}

package/styled-system/chunks/src__pages__token-analyzer__utility.css

@@ -1,2 +0,0 @@
-@layer utilities {
-}