@tulipfarm/sprout 0.3.1 → 0.4.0

package/dist/styles/skeleton.css

@@ -10,25 +10,25 @@
     pointer-events: none;
     user-select: none;
   }
-  .sprout-skeleton[data-shape="title"] {
+  .sprout-skeleton[data-shape='title'] {
     width: 66.6667%;
     height: 24px;
   }
-  .sprout-skeleton[data-shape="avatar"] {
+  .sprout-skeleton[data-shape='avatar'] {
     width: 32px;
     height: 32px;
     border-radius: 9999px;
   }
-  .sprout-skeleton[data-shape="panel"] {
+  .sprout-skeleton[data-shape='panel'] {
     height: 128px;
     border-radius: var(--sprout-radius-control);
   }
-  .sprout-skeleton[data-shape="checkbox"] {
+  .sprout-skeleton[data-shape='checkbox'] {
     width: 16px;
     height: 16px;
     border-radius: 4px;
   }
-  .sprout-skeleton[data-shape="action"] {
+  .sprout-skeleton[data-shape='action'] {
     width: 28px;
     height: 28px;
   }
@@ -39,10 +39,10 @@
     gap: 12px;
     min-width: 0;
   }
-  .sprout-skeleton-group[data-gap="sm"] {
+  .sprout-skeleton-group[data-gap='sm'] {
     gap: 8px;
   }
-  .sprout-skeleton-group[data-gap="lg"] {
+  .sprout-skeleton-group[data-gap='lg'] {
     gap: 16px;
   }
   .sprout-skeleton-group-label {
@@ -58,10 +58,8 @@
 
   @media (prefers-reduced-motion: no-preference) {
     .sprout-skeleton {
-      animation: sprout-skeleton-pulse 1.6s cubic-bezier(0.4, 0, 0.6, 1)
-        infinite;
-      transition: background-color var(--sprout-motion-fast)
-        var(--sprout-motion-ease);
+      animation: sprout-skeleton-pulse 1.6s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+      transition: background-color var(--sprout-motion-fast) var(--sprout-motion-ease);
     }
   }
 

package/dist/styles/slider.css

@@ -1,15 +1,11 @@
 @layer components {
   .sprout-slider {
     --sprout-slider-thumb: #fff;
-    --sprout-slider-ring: color-mix(
-      in oklab,
-      var(--sprout-focus) 50%,
-      transparent
-    );
+    --sprout-slider-ring: color-mix(in oklab, var(--sprout-focus) 50%, transparent);
     display: block;
     width: 100%;
   }
-  .sprout-slider[data-orientation="vertical"] {
+  .sprout-slider[data-orientation='vertical'] {
     width: auto;
     height: 100%;
   }
@@ -26,7 +22,7 @@
     user-select: none;
     cursor: pointer;
   }
-  .sprout-slider-control[data-orientation="vertical"] {
+  .sprout-slider-control[data-orientation='vertical'] {
     flex-direction: column;
     width: auto;
     height: 100%;
@@ -48,11 +44,11 @@
     background-color: var(--sprout-input);
     user-select: none;
   }
-  .sprout-slider-track[data-orientation="horizontal"] {
+  .sprout-slider-track[data-orientation='horizontal'] {
     width: 100%;
     height: 4px;
   }
-  .sprout-slider-track[data-orientation="vertical"] {
+  .sprout-slider-track[data-orientation='vertical'] {
     width: 4px;
     height: 100%;
   }
@@ -61,10 +57,10 @@
     background-color: var(--sprout-primary);
     user-select: none;
   }
-  .sprout-slider-range[data-orientation="horizontal"] {
+  .sprout-slider-range[data-orientation='horizontal'] {
     height: 100%;
   }
-  .sprout-slider-range[data-orientation="vertical"] {
+  .sprout-slider-range[data-orientation='vertical'] {
     width: 100%;
   }
 
@@ -84,7 +80,7 @@
   }
   /* A 28px hit area around the thumb. */
   .sprout-slider-thumb::after {
-    content: "";
+    content: '';
     position: absolute;
     inset: -8px;
   }
@@ -96,11 +92,7 @@
       0 0 0 3px var(--sprout-slider-ring);
   }
   .sprout-slider-thumb[data-invalid] {
-    --sprout-slider-ring: color-mix(
-      in oklab,
-      var(--sprout-danger) 30%,
-      transparent
-    );
+    --sprout-slider-ring: color-mix(in oklab, var(--sprout-danger) 30%, transparent);
     border-color: var(--sprout-danger);
   }
   .sprout-slider-thumb[data-disabled],
@@ -112,10 +104,8 @@
   @media (prefers-reduced-motion: no-preference) {
     .sprout-slider-thumb {
       transition:
-        box-shadow var(--sprout-motion-fast, 120ms)
-          var(--sprout-motion-ease, ease-out),
-        border-color var(--sprout-motion-fast, 120ms)
-          var(--sprout-motion-ease, ease-out);
+        box-shadow var(--sprout-motion-fast, 120ms) var(--sprout-motion-ease, ease-out),
+        border-color var(--sprout-motion-fast, 120ms) var(--sprout-motion-ease, ease-out);
     }
   }
 

package/dist/styles/spinner.css

@@ -21,12 +21,12 @@
     width: 64px;
     height: 64px;
   }
-  .sprout-spinner[data-variant="thinking"] {
+  .sprout-spinner[data-variant='thinking'] {
     vertical-align: middle;
   }
 
   @media (prefers-reduced-motion: no-preference) {
-    .sprout-spinner[data-variant="default"] {
+    .sprout-spinner[data-variant='default'] {
       animation: sprout-spinner-spin 1s linear infinite;
     }
   }

package/dist/styles/sql-viewer.css

@@ -19,29 +19,44 @@
 
   .sprout-sql-flow.light,
   .sprout-sql-flow.dark {
+    --sprout-indigo: inherit;
+    --sprout-green: inherit;
+    --sprout-orange: inherit;
+    --sprout-red: inherit;
+    --sprout-sky: inherit;
+    --sprout-purple: inherit;
+    --sprout-yellow: inherit;
+    --sprout-teal: inherit;
+    --sprout-blue: inherit;
+    --sprout-tan: inherit;
     --sprout-chart-1: inherit;
     --sprout-chart-2: inherit;
     --sprout-chart-3: inherit;
     --sprout-chart-4: inherit;
     --sprout-chart-5: inherit;
+    --sprout-chart-6: inherit;
+    --sprout-chart-7: inherit;
+    --sprout-chart-8: inherit;
+    --sprout-chart-9: inherit;
+    --sprout-chart-10: inherit;
   }
 
   .sprout-sql-viewer [data-tone] {
     --sprout-sql-tone: var(--sprout-primary);
   }
-  .sprout-sql-viewer [data-tone="1"] {
+  .sprout-sql-viewer [data-tone='1'] {
     --sprout-sql-tone: var(--sprout-chart-1);
   }
-  .sprout-sql-viewer [data-tone="2"] {
+  .sprout-sql-viewer [data-tone='2'] {
     --sprout-sql-tone: var(--sprout-chart-2);
   }
-  .sprout-sql-viewer [data-tone="3"] {
+  .sprout-sql-viewer [data-tone='3'] {
     --sprout-sql-tone: var(--sprout-chart-3);
   }
-  .sprout-sql-viewer [data-tone="4"] {
+  .sprout-sql-viewer [data-tone='4'] {
     --sprout-sql-tone: var(--sprout-chart-4);
   }
-  .sprout-sql-viewer [data-tone="5"] {
+  .sprout-sql-viewer [data-tone='5'] {
     --sprout-sql-tone: var(--sprout-chart-5);
   }
 
@@ -73,8 +88,7 @@
     box-sizing: border-box;
     width: 100%;
     height: 100%;
-    border: 1px solid
-      color-mix(in oklab, var(--sprout-sql-tone) 45%, var(--sprout-line));
+    border: 1px solid color-mix(in oklab, var(--sprout-sql-tone) 45%, var(--sprout-line));
     border-radius: 14px;
     background: color-mix(in oklab, var(--sprout-sql-tone) 6%, transparent);
   }
@@ -126,11 +140,7 @@
     box-shadow: var(--sprout-shadow-panel);
   }
   .sprout-sql-table[data-active] {
-    border-color: color-mix(
-      in oklab,
-      var(--sprout-sql-tone) 55%,
-      var(--sprout-line)
-    );
+    border-color: color-mix(in oklab, var(--sprout-sql-tone) 55%, var(--sprout-line));
   }
 
   .sprout-sql-table-header {
@@ -141,11 +151,7 @@
     height: 40px;
     padding: 0 12px;
     border-bottom: 1px solid var(--sprout-line);
-    background: color-mix(
-      in oklab,
-      var(--sprout-sql-tone) 9%,
-      var(--sprout-surface)
-    );
+    background: color-mix(in oklab, var(--sprout-sql-tone) 9%, var(--sprout-surface));
   }
   .sprout-sql-table-title {
     min-width: 0;
@@ -177,8 +183,7 @@
     line-height: 1.25rem;
   }
   .sprout-sql-column + .sprout-sql-column {
-    box-shadow: inset 0 1px 0
-      color-mix(in oklab, var(--sprout-line) 60%, transparent);
+    box-shadow: inset 0 1px 0 color-mix(in oklab, var(--sprout-line) 60%, transparent);
   }
   .sprout-sql-column[data-join] {
     cursor: pointer;
@@ -194,7 +199,7 @@
     width: 12px;
     color: var(--sprout-muted);
   }
-  .sprout-sql-column[data-key="primary"] .sprout-sql-column-icon {
+  .sprout-sql-column[data-key='primary'] .sprout-sql-column-icon {
     color: var(--sprout-warning);
   }
   .sprout-sql-column[data-join] .sprout-sql-column-icon {
@@ -207,7 +212,7 @@
     text-overflow: ellipsis;
     white-space: nowrap;
   }
-  .sprout-sql-column[data-key="primary"] .sprout-sql-column-name {
+  .sprout-sql-column[data-key='primary'] .sprout-sql-column-name {
     font-weight: 600;
   }
   .sprout-sql-column-type {
@@ -223,11 +228,7 @@
 
   .sprout-sql-keys {
     border-top: 1px solid var(--sprout-line);
-    background: color-mix(
-      in oklab,
-      var(--sprout-hover) 40%,
-      var(--sprout-surface)
-    );
+    background: color-mix(in oklab, var(--sprout-hover) 40%, var(--sprout-surface));
   }
   .sprout-sql-keys-title {
     box-sizing: border-box;
@@ -277,14 +278,13 @@
     box-sizing: border-box;
     max-width: calc(100% - 88px);
     padding: 8px 10px;
-    border: 1px solid
-      color-mix(in oklab, var(--sprout-primary) 40%, var(--sprout-line));
+    border: 1px solid color-mix(in oklab, var(--sprout-primary) 40%, var(--sprout-line));
     border-radius: 8px;
     background: var(--sprout-surface);
     box-shadow: var(--sprout-shadow-control);
     pointer-events: none;
   }
-  .sprout-sql-viewer[data-layout="vertical"] .sprout-sql-joins {
+  .sprout-sql-viewer[data-layout='vertical'] .sprout-sql-joins {
     max-width: calc(100% - 24px);
   }
   .sprout-sql-join-text {

package/dist/styles/state-panel.css

@@ -3,10 +3,9 @@
     font-family: var(--sprout-font);
     color: var(--sprout-text);
     overflow-wrap: anywhere;
-    animation: sprout-state-panel-in var(--sprout-motion-normal, 180ms)
-      var(--sprout-motion-ease, ease) both;
+    animation: sprout-state-panel-in var(--sprout-motion-normal, 180ms) var(--sprout-motion-ease, ease) both;
   }
-  .sprout-state-panel[data-layout="centered"] {
+  .sprout-state-panel[data-layout='centered'] {
     display: flex;
     flex-direction: column;
     align-items: center;
@@ -71,7 +70,7 @@
     display: none;
   }
 
-  .sprout-state-panel[data-layout="sample"] {
+  .sprout-state-panel[data-layout='sample'] {
     container-type: inline-size;
     width: 100%;
   }
@@ -92,17 +91,17 @@
     gap: 1.5rem;
     padding: 1.5rem;
   }
-  [data-layout="sample"] .sprout-state-panel-text {
+  [data-layout='sample'] .sprout-state-panel-text {
     max-width: 28rem;
   }
-  [data-layout="sample"] .sprout-state-panel-title {
+  [data-layout='sample'] .sprout-state-panel-title {
     font-size: 1.25rem;
     line-height: 1.4;
   }
-  [data-layout="sample"] .sprout-state-panel-description {
+  [data-layout='sample'] .sprout-state-panel-description {
     font-size: var(--sprout-text-base);
   }
-  [data-layout="sample"] .sprout-state-panel-actions {
+  [data-layout='sample'] .sprout-state-panel-actions {
     align-items: stretch;
     gap: 0.5rem;
   }
@@ -127,7 +126,7 @@
   }
 
   @container (min-width: 24rem) {
-    [data-layout="sample"] .sprout-state-panel-actions {
+    [data-layout='sample'] .sprout-state-panel-actions {
       flex-direction: row;
       flex-wrap: wrap;
       align-items: center;

package/dist/styles/state-sample.css

@@ -6,9 +6,6 @@
     --sprout-state-sample-document: #2b67d1;
     --sprout-state-sample-slides: #d9622b;
     --sprout-state-sample-image: #a8d4f7;
-    --sprout-state-sample-chart-1: #188038;
-    --sprout-state-sample-chart-2: #245cba;
-    --sprout-state-sample-chart-4: #7c4eb0;
   }
   .sprout-state-sample {
     display: flex;
@@ -23,17 +20,11 @@
   .dark.sprout-state-sample,
   .dark .sprout-state-sample-mark {
     --sprout-state-sample-image: #4d7ea8;
-    --sprout-state-sample-chart-1: #75ce8e;
-    --sprout-state-sample-chart-2: #9cbdff;
-    --sprout-state-sample-chart-4: #c6a4ed;
   }
   @media (prefers-color-scheme: dark) {
     :root:not(.light):not(.dark) .sprout-state-sample,
     :root:not(.light):not(.dark) .sprout-state-sample-mark {
       --sprout-state-sample-image: #4d7ea8;
-      --sprout-state-sample-chart-1: #75ce8e;
-      --sprout-state-sample-chart-2: #9cbdff;
-      --sprout-state-sample-chart-4: #c6a4ed;
     }
   }
 
@@ -139,10 +130,10 @@
     font-weight: 500;
     text-overflow: ellipsis;
   }
-  .sprout-state-sample-cell[data-size="wide"] {
+  .sprout-state-sample-cell[data-size='wide'] {
     flex: 1.6 1 0%;
   }
-  .sprout-state-sample-cell[data-size="narrow"] {
+  .sprout-state-sample-cell[data-size='narrow'] {
     flex: none;
     width: 6rem;
   }
@@ -190,57 +181,53 @@
     color: var(--sprout-muted);
   }
 
-  .sprout-state-sample-text[data-tone="strong"] {
+  .sprout-state-sample-text[data-tone='strong'] {
     font-weight: 500;
     color: var(--sprout-text);
   }
-  .sprout-state-sample-text[data-tone="muted"] {
+  .sprout-state-sample-text[data-tone='muted'] {
     color: var(--sprout-muted);
   }
-  .sprout-state-sample-text[data-tone="link"] {
+  .sprout-state-sample-text[data-tone='link'] {
     color: var(--sprout-info);
   }
-  .sprout-state-sample-text[data-tone="mono"] {
+  .sprout-state-sample-text[data-tone='mono'] {
     font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
     color: var(--sprout-muted);
   }
 
   .sprout-state-sample-mark {
     --sprout-state-sample-from: var(--sprout-state-sample-pdf);
-    --sprout-state-sample-to: var(--sprout-state-sample-chart-4);
+    --sprout-state-sample-to: var(--sprout-purple);
     flex-shrink: 0;
     width: 0.875rem;
     height: 0.875rem;
     border-radius: 0.125rem;
-    background: linear-gradient(
-      to bottom right,
-      var(--sprout-state-sample-from),
-      var(--sprout-state-sample-to)
-    );
+    background: linear-gradient(to bottom right, var(--sprout-state-sample-from), var(--sprout-state-sample-to));
   }
-  .sprout-state-sample-mark[data-size="md"] {
+  .sprout-state-sample-mark[data-size='md'] {
     width: 1.75rem;
     height: 1.75rem;
     border-radius: var(--sprout-radius-control);
   }
-  .sprout-state-sample-mark[data-tone="orange"] {
+  .sprout-state-sample-mark[data-tone='orange'] {
     --sprout-state-sample-from: var(--sprout-state-sample-slides);
     --sprout-state-sample-to: var(--sprout-state-sample-pdf);
   }
-  .sprout-state-sample-mark[data-tone="green"] {
+  .sprout-state-sample-mark[data-tone='green'] {
     --sprout-state-sample-from: var(--sprout-state-sample-sheet);
-    --sprout-state-sample-to: var(--sprout-state-sample-chart-2);
+    --sprout-state-sample-to: var(--sprout-blue);
   }
-  .sprout-state-sample-mark[data-tone="blue"] {
+  .sprout-state-sample-mark[data-tone='blue'] {
     --sprout-state-sample-from: var(--sprout-state-sample-document);
-    --sprout-state-sample-to: var(--sprout-state-sample-chart-4);
+    --sprout-state-sample-to: var(--sprout-purple);
   }
-  .sprout-state-sample-mark[data-tone="violet"] {
-    --sprout-state-sample-from: var(--sprout-state-sample-chart-4);
+  .sprout-state-sample-mark[data-tone='violet'] {
+    --sprout-state-sample-from: var(--sprout-purple);
     --sprout-state-sample-to: var(--sprout-state-sample-pdf);
   }
-  .sprout-state-sample-mark[data-tone="teal"] {
-    --sprout-state-sample-from: var(--sprout-state-sample-chart-1);
+  .sprout-state-sample-mark[data-tone='teal'] {
+    --sprout-state-sample-from: var(--sprout-green);
     --sprout-state-sample-to: var(--sprout-state-sample-image);
   }
 
@@ -251,10 +238,10 @@
     border-radius: 9999px;
     background: var(--sprout-active);
   }
-  .sprout-state-sample-placeholder[data-width="sm"] {
+  .sprout-state-sample-placeholder[data-width='sm'] {
     width: 33.333%;
   }
-  .sprout-state-sample-placeholder[data-width="lg"] {
+  .sprout-state-sample-placeholder[data-width='lg'] {
     width: 75%;
   }
 

package/dist/styles/switch.css

@@ -27,7 +27,7 @@
   }
   /* A 56 x 34px hit area around the default track. */
   .sprout-switch::after {
-    content: "";
+    content: '';
     position: absolute;
     inset: -8px -12px;
   }
@@ -45,12 +45,11 @@
   .sprout-switch[data-checked] {
     background-color: var(--sprout-primary);
   }
-  .sprout-switch[aria-invalid="true"] {
+  .sprout-switch[aria-invalid='true'] {
     border-color: var(--sprout-danger);
-    box-shadow: 0 0 0 3px
-      color-mix(in oklab, var(--sprout-danger) 20%, transparent);
+    box-shadow: 0 0 0 3px color-mix(in oklab, var(--sprout-danger) 20%, transparent);
   }
-  .sprout-switch[aria-invalid="true"]:focus-visible {
+  .sprout-switch[aria-invalid='true']:focus-visible {
     outline-color: var(--sprout-danger);
   }
   .sprout-switch[data-readonly] {
@@ -60,7 +59,7 @@
     cursor: not-allowed;
     opacity: 0.5;
   }
-  .sprout-switch[aria-busy="true"] {
+  .sprout-switch[aria-busy='true'] {
     cursor: progress;
   }
 
@@ -88,21 +87,15 @@
   @media (prefers-reduced-motion: no-preference) {
     .sprout-switch {
       transition:
-        background-color var(--sprout-motion-fast, 120ms)
-          var(--sprout-motion-ease, ease-out),
-        border-color var(--sprout-motion-fast, 120ms)
-          var(--sprout-motion-ease, ease-out),
-        box-shadow var(--sprout-motion-fast, 120ms)
-          var(--sprout-motion-ease, ease-out),
-        opacity var(--sprout-motion-fast, 120ms)
-          var(--sprout-motion-ease, ease-out);
+        background-color var(--sprout-motion-fast, 120ms) var(--sprout-motion-ease, ease-out),
+        border-color var(--sprout-motion-fast, 120ms) var(--sprout-motion-ease, ease-out),
+        box-shadow var(--sprout-motion-fast, 120ms) var(--sprout-motion-ease, ease-out),
+        opacity var(--sprout-motion-fast, 120ms) var(--sprout-motion-ease, ease-out);
     }
     .sprout-switch-thumb {
       transition:
-        transform var(--sprout-motion-normal, 180ms)
-          var(--sprout-motion-ease, ease-out),
-        background-color var(--sprout-motion-fast, 120ms)
-          var(--sprout-motion-ease, ease-out);
+        transform var(--sprout-motion-normal, 180ms) var(--sprout-motion-ease, ease-out),
+        background-color var(--sprout-motion-fast, 120ms) var(--sprout-motion-ease, ease-out);
     }
   }