@scalar/components 0.27.9 → 0.27.11

package/dist/style.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
 @layer properties {
   @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
     *, :before, :after, ::backdrop {
@@ -194,6 +194,14 @@
     }
   }
 
+  @media (max-resolution: 1.5x) {
+    @supports ((-moz-appearance: none)) {
+      :root {
+        --scalar-border-width: 1px;
+      }
+    }
+  }
+
   :root {
     --scalar-text-decoration: underline;
     --scalar-text-decoration-hover: underline;
@@ -261,8 +269,17 @@
     --scalar-button-1: #000;
     --scalar-button-1-hover: #000c;
     --scalar-button-1-color: #fff;
-    --scalar-tooltip-background: #1a1a1ae6;
-    --scalar-tooltip-color: #ffffffd9;
+    --scalar-tooltip-background: var(--scalar-background-1);
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .light-mode {
+      --scalar-tooltip-background: color-mix(in srgb, var(--scalar-background-1), transparent 10%);
+    }
+  }
+
+  .light-mode {
+    --scalar-tooltip-color: var(--scalar-color-1);
     --scalar-color-alert: var(--scalar-color-orange);
   }
 
@@ -665,22 +682,6 @@
   inset-block: 2px;
 }
 
-.scalar-app .-start {
-  inset-inline-start: -4px;
-}
-
-.scalar-app .start {
-  inset-inline-start: 4px;
-}
-
-.scalar-app .-end {
-  inset-inline-end: -4px;
-}
-
-.scalar-app .end {
-  inset-inline-end: 4px;
-}
-
 .scalar-app .-top-1 {
   top: -4px;
 }
@@ -811,7 +812,6 @@
 
 .scalar-app .z-10 {
   z-index: 10;
-  z-index: 10;
 }
 
 .scalar-app .z-context {
@@ -1448,7 +1448,7 @@
 }
 
 .scalar-app .translate-x-0 {
-  --tw-translate-x: calc(4px * 0);
+  --tw-translate-x: 0px;
   translate: var(--tw-translate-x) var(--tw-translate-y);
 }
 
@@ -1483,7 +1483,7 @@
 }
 
 .scalar-app .translate-y-0 {
-  --tw-translate-y: calc(4px * 0);
+  --tw-translate-y: 0px;
   translate: var(--tw-translate-x) var(--tw-translate-y);
 }
 
@@ -2444,7 +2444,7 @@
 }
 
 .scalar-app .shadow-border {
-  --tw-shadow: inset 0 0 0 var(--tw-shadow-color, var(--scalar-border-width)) var(--scalar-border-color);
+  --tw-shadow: inset 0 0 0 var(--scalar-border-width) var(--scalar-border-color);
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
 }
 
@@ -2655,14 +2655,8 @@
   border-width: var(--scalar-border-width);
 }
 
-:is(.scalar-app .\*\:border-border-tooltip > *) {
-  border-color: var(--scalar-tooltip-color);
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  :is(.scalar-app .\*\:border-border-tooltip > *) {
-    border-color: color-mix(in srgb, var(--scalar-tooltip-color), var(--scalar-tooltip-background));
-  }
+:is(.scalar-app .\*\:border-border > *) {
+  border-color: var(--scalar-border-color);
 }
 
 :is(.scalar-app .\*\:px-1 > *) {
@@ -2685,6 +2679,16 @@
   .scalar-app .group-hover\/button\:text-c-header-1:is(:where(.group\/button):hover *) {
     color: var(--scalar-header-color-1, var(--scalar-color-1));
   }
+
+  .scalar-app .group-hover\/copy-button\:bg-b-1\.5:is(:where(.group\/copy-button):hover *) {
+    background-color: var(--scalar-background-1);
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .scalar-app .group-hover\/copy-button\:bg-b-1\.5:is(:where(.group\/copy-button):hover *) {
+      background-color: color-mix(in srgb, var(--scalar-background-1), var(--scalar-background-2));
+    }
+  }
 }
 
 .scalar-app .group-focus-visible\/toggle\:outline:is(:where(.group\/toggle):focus-visible *) {
@@ -2745,16 +2749,22 @@
   border-bottom-left-radius: inherit;
 }
 
-.scalar-app .focus-within\:bg-b-1:focus-within {
-  background-color: var(--scalar-background-1);
-}
-
 .scalar-app .focus-within\:outline-none:focus-within {
   --tw-outline-style: none;
   outline-style: none;
 }
 
 @media (hover: hover) {
+  .scalar-app .hover\:bg-b-1\.5:hover {
+    background-color: var(--scalar-background-1);
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .scalar-app .hover\:bg-b-1\.5:hover {
+      background-color: color-mix(in srgb, var(--scalar-background-1), var(--scalar-background-2));
+    }
+  }
+
   .scalar-app .hover\:bg-b-2:hover {
     background-color: var(--scalar-background-2);
   }
@@ -2909,6 +2919,20 @@
   background-color: var(--bg-dark);
 }
 
+.scalar-app .dark\:bg-b-1\.5:where(.dark-mode, .dark-mode *) {
+  background-color: var(--scalar-background-1);
+}
+
+@supports (color: color-mix(in lab, red, red)) {
+  .scalar-app .dark\:bg-b-1\.5:where(.dark-mode, .dark-mode *) {
+    background-color: color-mix(in srgb, var(--scalar-background-1), var(--scalar-background-2));
+  }
+}
+
+.scalar-app .dark\:bg-b-2:where(.dark-mode, .dark-mode *) {
+  background-color: var(--scalar-background-2);
+}
+
 .scalar-app .dark\:bg-b-3:where(.dark-mode, .dark-mode *) {
   background-color: var(--scalar-background-3);
 }
@@ -2932,6 +2956,20 @@
 }
 
 @media (hover: hover) {
+  .scalar-app .dark\:group-hover\/copy-button\:bg-b-1\.5:where(.dark-mode, .dark-mode *):is(:where(.group\/copy-button):hover *) {
+    background-color: var(--scalar-background-1);
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .scalar-app .dark\:group-hover\/copy-button\:bg-b-1\.5:where(.dark-mode, .dark-mode *):is(:where(.group\/copy-button):hover *) {
+      background-color: color-mix(in srgb, var(--scalar-background-1), var(--scalar-background-2));
+    }
+  }
+
+  .scalar-app .dark\:hover\:bg-b-2:where(.dark-mode, .dark-mode *):hover {
+    background-color: var(--scalar-background-2);
+  }
+
   .scalar-app .dark\:hover\:bg-b-3:where(.dark-mode, .dark-mode *):hover {
     background-color: var(--scalar-background-3);
   }
@@ -3526,7 +3564,7 @@ to {
     transform: scale(3.5) rotate(360deg);
 }
 }
-/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
 .scalar-app :where(code.hljs) * {
   font-size: inherit;
   font-family: var(--scalar-font-code);
@@ -3868,7 +3906,6 @@ code.hljs {
 }
 
 /* -------------------------------------------------------------- */
-
 /* Language specific overrides */
 
 /** For HTML we leave the content strings brighter */
@@ -4448,7 +4485,7 @@ img,
 }
 }
 }
-/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
 .scalar-modal-layout[data-v-5bb1dcc2] {
   animation: .3s ease-in-out forwards fadein-layout-5bb1dcc2;
 }
@@ -4518,7 +4555,7 @@ img,
   top: 0;
   right: -50dvw;
 }
-/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
 .group\/item > * > .scalar-sidebar-indent .scalar-sidebar-indent-border[data-v-3e080c68] {
   inset-block: -1px;
 }
@@ -4528,11 +4565,11 @@ img,
 .group\/item:last-child > * > .scalar-sidebar-indent .scalar-sidebar-indent-border[data-v-3e080c68] {
   bottom: 0;
 }
-/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
 .group\/item:last-of-type > .group\/button > .group\/button-label > .group\/button-loading {
   width: 66.6667%;
 }
-/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
 .group\/items.-translate-x-full .group\/button {
   transition-behavior: allow-discrete;
   max-height: 0;
@@ -4545,7 +4582,7 @@ img,
   max-height: 3.40282e38px;
   display: flex;
 }
-/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
 .animate-sidebar-border-bottom {
   animation: forwards border-bottom;
   animation-timeline: scroll();
@@ -4559,7 +4596,7 @@ to {
     border-bottom-width: var(--scalar-border-width);
 }
 }
-/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
 .group\/sidebar-section:first-of-type > .group\/spacer-before, .group\/sidebar-section:last-of-type > .group\/spacer-after {
   height: 0;
 }
@@ -4567,20 +4604,12 @@ to {
   height: 0;
   margin-bottom: -1px;
 }
-/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
 @layer properties {
 @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
 *, :before, :after, ::backdrop {
       --tw-font-weight: initial;
-      --tw-backdrop-blur: initial;
-      --tw-backdrop-brightness: initial;
-      --tw-backdrop-contrast: initial;
-      --tw-backdrop-grayscale: initial;
-      --tw-backdrop-hue-rotate: initial;
-      --tw-backdrop-invert: initial;
-      --tw-backdrop-opacity: initial;
-      --tw-backdrop-saturate: initial;
-      --tw-backdrop-sepia: initial;
+      --tw-border-style: solid;
       --tw-shadow: 0 0 #0000;
       --tw-shadow-color: initial;
       --tw-shadow-alpha: 100%;
@@ -4595,99 +4624,78 @@ to {
       --tw-ring-offset-width: 0px;
       --tw-ring-offset-color: #fff;
       --tw-ring-offset-shadow: 0 0 #0000;
+      --tw-backdrop-blur: initial;
+      --tw-backdrop-brightness: initial;
+      --tw-backdrop-contrast: initial;
+      --tw-backdrop-grayscale: initial;
+      --tw-backdrop-hue-rotate: initial;
+      --tw-backdrop-invert: initial;
+      --tw-backdrop-opacity: initial;
+      --tw-backdrop-saturate: initial;
+      --tw-backdrop-sepia: initial;
 }
 }
 }
-:where(body) > .scalar-tooltip {
-  --scalar-tooltip-padding: 8px;
-  padding: var(--scalar-tooltip-padding);
+:where(body, dialog) > .scalar-tooltip {
+  --scalar-tooltip-padding-x: 8px;
+  --scalar-tooltip-padding-y: 6px;
+  padding: var(--scalar-tooltip-padding-y) var(--scalar-tooltip-padding-x);
   z-index: 99999;
   max-width: 320px;
   font-size: var(--scalar-font-size-5);
-  --tw-font-weight: var(--scalar-semibold);
+  --tw-font-weight: var(--scalar-regular);
   line-height: 16px;
-  font-weight: var(--scalar-semibold);
+  font-weight: var(--scalar-regular);
   overflow-wrap: break-word;
   color: var(--scalar-tooltip-color);
 }
-:where(body) > .scalar-tooltip[data-side="top"] {
-  padding-bottom: calc(var(--scalar-tooltip-padding) + var(--scalar-tooltip-offset));
+:where(body, dialog) > .scalar-tooltip[data-side="top"] {
+  padding-bottom: calc(var(--scalar-tooltip-padding-y) + var(--scalar-tooltip-offset));
 }
-:where(body) > .scalar-tooltip[data-side="bottom"] {
-  padding-top: calc(var(--scalar-tooltip-padding) + var(--scalar-tooltip-offset));
+:where(body, dialog) > .scalar-tooltip[data-side="bottom"] {
+  padding-top: calc(var(--scalar-tooltip-padding-y) + var(--scalar-tooltip-offset));
 }
-:where(body) > .scalar-tooltip[data-side="left"] {
-  padding-right: calc(var(--scalar-tooltip-padding) + var(--scalar-tooltip-offset));
+:where(body, dialog) > .scalar-tooltip[data-side="left"] {
+  padding-right: calc(var(--scalar-tooltip-padding-x) + var(--scalar-tooltip-offset));
 }
-:where(body) > .scalar-tooltip[data-side="right"] {
-  padding-left: calc(var(--scalar-tooltip-padding) + var(--scalar-tooltip-offset));
+:where(body, dialog) > .scalar-tooltip[data-side="right"] {
+  padding-left: calc(var(--scalar-tooltip-padding-x) + var(--scalar-tooltip-offset));
 }
-:where(body) > .scalar-tooltip:before {
+:where(body, dialog) > .scalar-tooltip:before {
   content: "";
   z-index: calc(1 * -1);
-  border-radius: var(--scalar-radius-md);
+  border-radius: var(--scalar-radius-lg);
+  border-style: var(--tw-border-style);
+  border-width: var(--scalar-border-width);
   background-color: var(--scalar-tooltip-background);
+  --tw-shadow: var(--scalar-shadow-1);
+  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   --tw-backdrop-blur: blur(8px);
-  -webkit-backdrop-filter: var(--tw-backdrop-blur,  ) var(--tw-backdrop-brightness,  ) var(--tw-backdrop-contrast,  ) var(--tw-backdrop-grayscale,  ) var(--tw-backdrop-hue-rotate,  ) var(--tw-backdrop-invert,  ) var(--tw-backdrop-opacity,  ) var(--tw-backdrop-saturate,  ) var(--tw-backdrop-sepia,  );
-  backdrop-filter: var(--tw-backdrop-blur,  ) var(--tw-backdrop-brightness,  ) var(--tw-backdrop-contrast,  ) var(--tw-backdrop-grayscale,  ) var(--tw-backdrop-hue-rotate,  ) var(--tw-backdrop-invert,  ) var(--tw-backdrop-opacity,  ) var(--tw-backdrop-saturate,  ) var(--tw-backdrop-sepia,  );
+  -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
+  backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
   position: absolute;
   inset: 0;
 }
-:where(body) > .scalar-tooltip[data-side="top"]:before {
+:where(body, dialog) > .scalar-tooltip[data-side="top"]:before {
   bottom: var(--scalar-tooltip-offset);
 }
-:where(body) > .scalar-tooltip[data-side="bottom"]:before {
+:where(body, dialog) > .scalar-tooltip[data-side="bottom"]:before {
   top: var(--scalar-tooltip-offset);
 }
-:where(body) > .scalar-tooltip[data-side="left"]:before {
+:where(body, dialog) > .scalar-tooltip[data-side="left"]:before {
   right: var(--scalar-tooltip-offset);
 }
-:where(body) > .scalar-tooltip[data-side="right"]:before {
+:where(body, dialog) > .scalar-tooltip[data-side="right"]:before {
   left: var(--scalar-tooltip-offset);
 }
-:where(body.dark-mode) > .scalar-tooltip:before {
-  --tw-shadow: inset 0 0 0 var(--tw-shadow-color, var(--scalar-border-width)) var(--scalar-border-color);
-  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-}
 @property --tw-font-weight {
   syntax: "*";
   inherits: false
 }
-@property --tw-backdrop-blur {
-  syntax: "*";
-  inherits: false
-}
-@property --tw-backdrop-brightness {
-  syntax: "*";
-  inherits: false
-}
-@property --tw-backdrop-contrast {
-  syntax: "*";
-  inherits: false
-}
-@property --tw-backdrop-grayscale {
-  syntax: "*";
-  inherits: false
-}
-@property --tw-backdrop-hue-rotate {
-  syntax: "*";
-  inherits: false
-}
-@property --tw-backdrop-invert {
-  syntax: "*";
-  inherits: false
-}
-@property --tw-backdrop-opacity {
-  syntax: "*";
-  inherits: false
-}
-@property --tw-backdrop-saturate {
-  syntax: "*";
-  inherits: false
-}
-@property --tw-backdrop-sepia {
+@property --tw-border-style {
   syntax: "*";
-  inherits: false
+  inherits: false;
+  initial-value: solid;
 }
 @property --tw-shadow {
   syntax: "*";
@@ -4754,6 +4762,42 @@ to {
   inherits: false;
   initial-value: 0 0 #0000;
 }
+@property --tw-backdrop-blur {
+  syntax: "*";
+  inherits: false
+}
+@property --tw-backdrop-brightness {
+  syntax: "*";
+  inherits: false
+}
+@property --tw-backdrop-contrast {
+  syntax: "*";
+  inherits: false
+}
+@property --tw-backdrop-grayscale {
+  syntax: "*";
+  inherits: false
+}
+@property --tw-backdrop-hue-rotate {
+  syntax: "*";
+  inherits: false
+}
+@property --tw-backdrop-invert {
+  syntax: "*";
+  inherits: false
+}
+@property --tw-backdrop-opacity {
+  syntax: "*";
+  inherits: false
+}
+@property --tw-backdrop-saturate {
+  syntax: "*";
+  inherits: false
+}
+@property --tw-backdrop-sepia {
+  syntax: "*";
+  inherits: false
+}
 
 .scalar-virtual-text-search-input[data-v-95edadbb]::-webkit-search-cancel-button {
   display: none;