@pandacss/studio 0.15.0 → 0.15.2

package/styled-system/chunks/src__components__theme-toggle.css

@@ -1,31 +1,12 @@
 @layer utilities {
-  .\[\&\.active\]\:text_yellow\.300 {
-    &.active {
-      color: var(--colors-yellow-300);
-    }
-  }
-
-  .\[\&\.active\]\:text_yellow\.300 {
-    &.active {
-      color: var(--colors-yellow-300);
-    }
-  }
-
-  .\[\&\.active\]\:text_yellow\.300 {
-    &.active {
-      color: var(--colors-yellow-300);
-    }
-  }
 
   .cursor_pointer {
-    cursor: pointer;
-  }
-
-  .\[\&\.active\]\:text_yellow\.300 {
-    &.active {
-      color: var(--colors-yellow-300);
+    cursor: pointer
     }
-  }
+
+  .\[\&\.active\]\:text_yellow\.300.active {
+    color: var(--colors-yellow-300)
+        }
 
   .sr_true {
     position: absolute;
@@ -36,46 +17,46 @@
     overflow: hidden;
     clip: rect(0, 0, 0, 0);
     white-space: nowrap;
-    border-width: 0;
-  }
+    border-width: 0
+    }
 
   .d_flex {
-    display: flex;
-  }
+    display: flex
+    }
 
   .items_center {
-    align-items: center;
-  }
+    align-items: center
+    }
 
   .gap_3 {
-    gap: var(--spacing-3);
-  }
+    gap: var(--spacing-3)
+    }
 
   .flex_row {
-    flex-direction: row;
-  }
+    flex-direction: row
+    }
 
   .rounded_md {
-    border-radius: var(--radii-md);
-  }
+    border-radius: var(--radii-md)
+    }
 
   .px_2 {
-    padding-inline: var(--spacing-2);
-  }
+    padding-inline: var(--spacing-2)
+    }
 
   .py_2 {
-    padding-block: var(--spacing-2);
-  }
+    padding-block: var(--spacing-2)
+    }
 
   .border-width_1px {
-    border-width: 1px;
-  }
+    border-width: 1px
+    }
 
   .self_flex-start {
-    align-self: flex-start;
-  }
+    align-self: flex-start
+    }
 
   .text_inherit {
-    color: inherit;
-  }
-}
+    color: inherit
+    }
+}

package/styled-system/chunks/src__components__token-analyzer.css

@@ -1,485 +1,220 @@
 @layer utilities {
-  .py_20px {
-    padding-block: 20px;
-  }
-
-  .\[\&_li\]\:cursor_pointer {
-    & li {
-      cursor: pointer;
-    }
-  }
-
-  .hover\:opacity_0\.8 {
-    &:where(:hover, [data-hover]) {
-      opacity: 0.8;
-    }
-  }
-
-  .hover\:bg_border {
-    &:where(:hover, [data-hover]) {
-      background-color: var(--colors-border);
-    }
-  }
-
-  .hover\:bg_border {
-    &:where(:hover, [data-hover]) {
-      background: var(--colors-border);
-    }
-  }
-
-  .hover\:opacity_0\.6 {
-    &:where(:hover, [data-hover]) {
-      opacity: 0.6;
-    }
-  }
-
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
-    }
-  }
-
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
-    }
-  }
-
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
-    }
-  }
-
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
-    }
-  }
-
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
-    }
-  }
-
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
-    }
-  }
-
-  .\[\&_li\]\:cursor_pointer {
-    & li {
-      cursor: pointer;
-    }
-  }
-
-  .hover\:opacity_0\.8 {
-    &:where(:hover, [data-hover]) {
-      opacity: 0.8;
-    }
-  }
-
-  .hover\:bg_border {
-    &:where(:hover, [data-hover]) {
-      background-color: var(--colors-border);
-    }
-  }
-
-  .hover\:bg_border {
-    &:where(:hover, [data-hover]) {
-      background: var(--colors-border);
-    }
-  }
-
-  .hover\:opacity_0\.6 {
-    &:where(:hover, [data-hover]) {
-      opacity: 0.6;
-    }
-  }
-
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
-    }
-  }
-
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
-    }
-  }
-
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
-    }
-  }
-
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
-    }
-  }
-
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
-    }
-  }
-
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
-    }
-  }
-
-  .\[\&_li\]\:cursor_pointer {
-    & li {
-      cursor: pointer;
-    }
-  }
-
-  .hover\:opacity_0\.8 {
-    &:where(:hover, [data-hover]) {
-      opacity: 0.8;
-    }
-  }
-
-  .hover\:bg_border {
-    &:where(:hover, [data-hover]) {
-      background-color: var(--colors-border);
-    }
-  }
-
-  .hover\:bg_border {
-    &:where(:hover, [data-hover]) {
-      background: var(--colors-border);
-    }
-  }
-
-  .hover\:opacity_0\.6 {
-    &:where(:hover, [data-hover]) {
-      opacity: 0.6;
-    }
-  }
-
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
-    }
-  }
-
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
-    }
-  }
-
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
-    }
-  }
-
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
-    }
-  }
 
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
-    }
-  }
-
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
+  .py_20px {
+    padding-block: 20px
     }
-  }
 
   .p_4px_8px {
-    padding: 4px 8px;
-  }
-
-  .\[\&_li\]\:cursor_pointer {
-    & li {
-      cursor: pointer;
+    padding: 4px 8px
     }
-  }
+    .\[\&_li\]\:cursor_pointer li {
+      cursor: pointer
+        }
 
   .list-style_none {
-    list-style: none;
-  }
-
-  .hover\:opacity_0\.8 {
-    &:where(:hover, [data-hover]) {
-      opacity: 0.8;
+    list-style: none
     }
-  }
 
   .p_6 {
-    padding: var(--spacing-6);
-  }
+    padding: var(--spacing-6)
+    }
 
   .cursor_default {
-    cursor: default;
-  }
+    cursor: default
+    }
 
   .px_24 {
-    padding-inline: var(--spacing-24);
-  }
+    padding-inline: var(--spacing-24)
+    }
 
   .w_100\% {
-    width: 100%;
-  }
+    width: 100%
+    }
 
   .w_5 {
-    width: var(--sizes-5);
-  }
+    width: var(--sizes-5)
+    }
 
   .ml_auto {
-    margin-left: auto;
-  }
+    margin-left: auto
+    }
 
   .mt_8 {
-    margin-top: var(--spacing-8);
-  }
+    margin-top: var(--spacing-8)
+    }
 
   .fs_xl {
-    font-size: var(--font-sizes-xl);
-  }
+    font-size: var(--font-sizes-xl)
+    }
 
   .p_2 {
-    padding: var(--spacing-2);
-  }
+    padding: var(--spacing-2)
+    }
 
   .bg_gray\.100 {
-    background: var(--colors-gray-100);
-  }
+    background: var(--colors-gray-100)
+    }
 
   .border_1px_solid_rgba\(0\,_0\,_0\,_0\.1\) {
-    border: 1px solid rgba(0, 0, 0, 0.1);
-  }
+    border: 1px solid rgba(0, 0, 0, 0.1)
+    }
 
   .fs_md {
-    font-size: var(--font-sizes-md);
-  }
+    font-size: var(--font-sizes-md)
+    }
 
   .font_bold {
-    font-weight: var(--font-weights-bold);
-  }
+    font-weight: var(--font-weights-bold)
+    }
 
   .ml_2 {
-    margin-left: var(--spacing-2);
-  }
+    margin-left: var(--spacing-2)
+    }
 
   .d_inline-block {
-    display: inline-block;
-  }
+    display: inline-block
+    }
 
   .bg_card {
-    background: var(--colors-card);
-  }
+    background: var(--colors-card)
+    }
 
   .p_0 {
-    padding: var(--spacing-0);
-  }
-
-  .hover\:bg_border {
-    &:where(:hover, [data-hover]) {
-      background-color: var(--colors-border);
+    padding: var(--spacing-0)
     }
-  }
 
   .py_2 {
-    padding-block: var(--spacing-2);
-  }
+    padding-block: var(--spacing-2)
+    }
 
   .px_4 {
-    padding-inline: var(--spacing-4);
-  }
+    padding-inline: var(--spacing-4)
+    }
 
   .transition_all_0\.2s_ease {
-    transition: all 0.2s ease;
-  }
-
-  .hover\:bg_border {
-    &:where(:hover, [data-hover]) {
-      background: var(--colors-border);
+    transition: all 0.2s ease
     }
-  }
 
   .rounded_md {
-    border-radius: var(--radii-md);
-  }
-
-  .hover\:opacity_0\.6 {
-    &:where(:hover, [data-hover]) {
-      opacity: 0.6;
+    border-radius: var(--radii-md)
     }
-  }
 
   .bg_none {
-    background: none;
-  }
+    background: none
+    }
 
   .pt_6 {
-    padding-top: var(--spacing-6);
-  }
+    padding-top: var(--spacing-6)
+    }
 
   .pl_6 {
-    padding-left: var(--spacing-6);
-  }
+    padding-left: var(--spacing-6)
+    }
 
   .pr_4 {
-    padding-right: var(--spacing-4);
-  }
+    padding-right: var(--spacing-4)
+    }
 
   .text_text {
-    color: var(--colors-text);
-  }
+    color: var(--colors-text)
+    }
 
   .gap_10px {
-    gap: 10px;
-  }
-
-  .mb_4 {
-    margin-bottom: var(--spacing-4);
-  }
-
-  .p_20px {
-    padding: 20px;
-  }
-
-  .fs_lg {
-    font-size: var(--font-sizes-lg);
-  }
-
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
+    gap: 10px
     }
-  }
 
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
+  .mb_4 {
+    margin-bottom: var(--spacing-4)
     }
-  }
 
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
+  .p_20px {
+    padding: 20px
     }
-  }
 
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
+  .fs_lg {
+    font-size: var(--font-sizes-lg)
     }
-  }
 
   .d_inline-flex {
-    display: inline-flex;
-  }
+    display: inline-flex
+    }
 
   .items_center {
-    align-items: center;
-  }
+    align-items: center
+    }
 
   .opacity_0\.5 {
-    opacity: 0.5;
-  }
+    opacity: 0.5
+    }
 
   .border-b_1px_solid_transparent {
-    border-bottom: 1px solid transparent;
-  }
-
-  .cursor_pointer {
-    cursor: pointer;
-  }
-
-  .hover\:opacity_1 {
-    &:where(:hover, [data-hover]) {
-      opacity: 1;
+    border-bottom: 1px solid transparent
     }
-  }
 
-  .hover\:border-b_black {
-    &:where(:hover, [data-hover]) {
-      border-bottom-color: var(--colors-black);
+  .cursor_pointer {
+    cursor: pointer
     }
-  }
 
   .gap_4 {
-    gap: var(--spacing-4);
-  }
+    gap: var(--spacing-4)
+    }
 
   .flex-wrap_wrap {
-    flex-wrap: wrap;
-  }
+    flex-wrap: wrap
+    }
 
   .mt_4 {
-    margin-top: var(--spacing-4);
-  }
+    margin-top: var(--spacing-4)
+    }
 
   .d_flex {
-    display: flex;
-  }
+    display: flex
+    }
 
   .flex_column {
-    flex-direction: column;
-  }
+    flex-direction: column
+    }
 
   .gap_2 {
-    gap: var(--spacing-2);
-  }
+    gap: var(--spacing-2)
+    }
 
   .px_2 {
-    padding-inline: var(--spacing-2);
-  }
+    padding-inline: var(--spacing-2)
+    }
 
   .fs_sm {
-    font-size: var(--font-sizes-sm);
-  }
+    font-size: var(--font-sizes-sm)
+    }
 
   .w_full {
-    width: var(--sizes-full);
-  }
-
-  .\[\&_li\]\:hover\:opacity_0\.8 {
-    & li {
-      &:where(:hover, [data-hover]) {
-        opacity: 0.8;
-      }
+    width: var(--sizes-full)
     }
-  }
 
-  .\[\&_li\]\:hover\:opacity_0\.8 {
-    & li {
-      &:where(:hover, [data-hover]) {
-        opacity: 0.8;
-      }
-    }
-  }
+  .hover\:opacity_0\.8:is(:hover, [data-hover]) {
+    opacity: 0.8
+        }
 
-  .\[\&_li\]\:hover\:opacity_0\.8 {
-    & li {
-      &:where(:hover, [data-hover]) {
-        opacity: 0.8;
-      }
-    }
-  }
+  .hover\:bg_border:is(:hover, [data-hover]) {
+    background-color: var(--colors-border)
+        }
 
-  .\[\&_li\]\:hover\:opacity_0\.8 {
-    & li {
-      &:where(:hover, [data-hover]) {
-        opacity: 0.8;
-      }
-    }
-  }
-}
+  .hover\:bg_border:is(:hover, [data-hover]) {
+    background: var(--colors-border)
+        }
+
+  .hover\:opacity_0\.6:is(:hover, [data-hover]) {
+    opacity: 0.6
+        }
+
+  .hover\:opacity_1:is(:hover, [data-hover]) {
+    opacity: 1
+        }
+
+  .hover\:border-b_black:is(:hover, [data-hover]) {
+    border-bottom-color: var(--colors-black)
+        }
+      .\[\&_li\]\:hover\:opacity_0\.8 li:is(:hover, [data-hover]) {
+        opacity: 0.8
+            }
+}