@scalar/sidebar 0.9.0 → 0.9.2

package/dist/style.css

@@ -80,6 +80,11 @@
       --tw-mask-bottom-from-color: black;
       --tw-mask-bottom-to-color: transparent;
       --tw-leading: initial;
+      --tw-ordinal: initial;
+      --tw-slashed-zero: initial;
+      --tw-numeric-figure: initial;
+      --tw-numeric-spacing: initial;
+      --tw-numeric-fraction: initial;
       --tw-outline-style: solid;
       --tw-blur: initial;
       --tw-brightness: initial;
@@ -1896,6 +1901,27 @@
   initial-value: 0 0 #0000;
 }
 
+.scalar-virtual-text-search-input[data-v-95edadbb]::-webkit-search-cancel-button {
+  display: none;
+}
+
+.scalar-virtual-text[data-v-b50a85e1]:focus {
+  outline: none;
+}
+
+.scalar-virtual-text-highlight[data-v-b50a85e1] {
+  background: var(--scalar-background-accent);
+  color: inherit;
+  border-radius: 2px;
+  padding: 1px 0;
+}
+
+.scalar-virtual-text-highlight-active[data-v-b50a85e1] {
+  background: var(--scalar-color-accent);
+  color: var(--scalar-background-1);
+  border-radius: 2px;
+}
+
 :where(.scalar-app) {
   font-family: var(--scalar-font);
   color: var(--scalar-color-1);
@@ -2405,10 +2431,6 @@
   margin: auto;
 }
 
-.scalar-app .-mx-0\.25 {
-  margin-inline: -1px;
-}
-
 .scalar-app .-mx-0\.75 {
   margin-inline: -3px;
 }
@@ -2417,6 +2439,10 @@
   margin-inline: -1px;
 }
 
+.scalar-app .mx-0\.5 {
+  margin-inline: 2px;
+}
+
 .scalar-app .mx-px {
   margin-inline: 1px;
 }
@@ -2469,7 +2495,7 @@
   margin-top: 20svh;
 }
 
-.scalar-app .-mr-0\.25 {
+.scalar-app .-mr-px {
   margin-right: -1px;
 }
 
@@ -2485,6 +2511,10 @@
   margin-right: 6px;
 }
 
+.scalar-app .mr-2 {
+  margin-right: 8px;
+}
+
 .scalar-app .mr-3 {
   margin-right: 12px;
 }
@@ -2768,6 +2798,10 @@
   width: 128px;
 }
 
+.scalar-app .w-36 {
+  width: 144px;
+}
+
 .scalar-app .w-40 {
   width: 160px;
 }
@@ -2828,6 +2862,10 @@
   width: min-content;
 }
 
+.scalar-app .w-px {
+  width: 1px;
+}
+
 .scalar-app .w-screen {
   width: 100vw;
 }
@@ -2981,10 +3019,6 @@
   cursor: auto;
 }
 
-.scalar-app .cursor-default {
-  cursor: default;
-}
-
 .scalar-app .cursor-not-allowed {
   cursor: not-allowed;
 }
@@ -3260,6 +3294,10 @@
   border-color: var(--scalar-background-3);
 }
 
+.scalar-app .border-border-header {
+  border-color: var(--scalar-header-border-color, var(--scalar-border-color));
+}
+
 .scalar-app .border-c-1 {
   border-color: var(--scalar-color-1);
 }
@@ -3322,6 +3360,14 @@
   background-color: var(--scalar-background-danger);
 }
 
+.scalar-app .bg-b-header-1 {
+  background-color: var(--scalar-header-background-1, var(--scalar-background-1));
+}
+
+.scalar-app .bg-b-header-cta {
+  background-color: var(--scalar-header-call-to-action-color, var(--scalar-button-1));
+}
+
 .scalar-app .bg-b-tooltip {
   background-color: var(--scalar-tooltip-background);
 }
@@ -3497,6 +3543,10 @@
   padding: 1px;
 }
 
+.scalar-app .px-1 {
+  padding-inline: 4px;
+}
+
 .scalar-app .px-1\.5 {
   padding-inline: 6px;
 }
@@ -3537,6 +3587,10 @@
   padding-inline: 36px;
 }
 
+.scalar-app .py-0\.5 {
+  padding-block: 2px;
+}
+
 .scalar-app .py-1 {
   padding-block: 4px;
 }
@@ -3569,10 +3623,6 @@
   padding-block: 6.75px;
 }
 
-.scalar-app .pt-0 {
-  padding-top: 0;
-}
-
 .scalar-app .pt-3 {
   padding-top: 12px;
 }
@@ -3597,6 +3647,10 @@
   padding-bottom: 0;
 }
 
+.scalar-app .pb-3 {
+  padding-bottom: 12px;
+}
+
 .scalar-app .pl-2 {
   padding-left: 8px;
 }
@@ -3672,11 +3726,6 @@
   font-size: var(--scalar-font-size-6);
 }
 
-.scalar-app .leading-5 {
-  --tw-leading: calc(4px * 5);
-  line-height: 20px;
-}
-
 .scalar-app .leading-\[22px\] {
   --tw-leading: 22px;
   line-height: 22px;
@@ -3765,6 +3814,18 @@
   color: var(--scalar-color-danger);
 }
 
+.scalar-app .text-c-header-1 {
+  color: var(--scalar-header-color-1, var(--scalar-color-1));
+}
+
+.scalar-app .text-c-header-2 {
+  color: var(--scalar-header-color-2, var(--scalar-color-2));
+}
+
+.scalar-app .text-c-header-cta {
+  color: var(--scalar-button-1-color);
+}
+
 .scalar-app .text-c-tooltip {
   color: var(--scalar-tooltip-color);
 }
@@ -3809,6 +3870,11 @@
   text-transform: uppercase;
 }
 
+.scalar-app .tabular-nums {
+  --tw-numeric-spacing: tabular-nums;
+  font-variant-numeric: var(--tw-ordinal,   ) var(--tw-slashed-zero,   ) var(--tw-numeric-figure,   ) var(--tw-numeric-spacing,   ) var(--tw-numeric-fraction,   );
+}
+
 .scalar-app .no-underline {
   text-decoration-line: none;
 }
@@ -3844,6 +3910,11 @@
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
 }
 
+.scalar-app .shadow-md {
+  --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);
+}
+
 .scalar-app .shadow-none {
   --tw-shadow: 0 0 #0000;
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -4005,8 +4076,8 @@
   justify-content: center;
 }
 
-:is(.scalar-app .\*\:gap-px > *) {
-  gap: 1px;
+:is(.scalar-app .\*\:gap-1 > *) {
+  gap: 4px;
 }
 
 :is(.scalar-app .\*\:rounded > *) {
@@ -4045,8 +4116,8 @@
     background-color: var(--scalar-sidebar-indent-border-hover, var(--scalar-border-color));
   }
 
-  .scalar-app .group-hover\/button\:text-c-1:is(:where(.group\/button):hover *) {
-    color: var(--scalar-color-1);
+  .scalar-app .group-hover\/button\:text-c-header-1:is(:where(.group\/button):hover *) {
+    color: var(--scalar-header-color-1, var(--scalar-color-1));
   }
 }
 
@@ -4126,10 +4197,24 @@
     background-color: var(--scalar-background-3);
   }
 
+  .scalar-app .hover\:bg-b-header-2:hover {
+    background-color: var(--scalar-header-background-2, var(--scalar-background-2));
+  }
+
   .scalar-app .hover\:bg-h-btn:hover {
     background-color: var(--scalar-button-1-hover);
   }
 
+  .scalar-app .hover\:bg-h-header-cta:hover {
+    background-color: var(--scalar-header-call-to-action-color, var(--scalar-button-1));
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .scalar-app .hover\:bg-h-header-cta:hover {
+      background-color: color-mix(in srgb, var(--scalar-header-call-to-action-color, var(--scalar-button-1)), var(--scalar-header-background-1, var(--scalar-background-1)) 15%);
+    }
+  }
+
   .scalar-app .hover\:bg-sidebar-b-1:hover {
     background-color: var(--scalar-sidebar-background-1, var(--scalar-background-1));
   }
@@ -4170,6 +4255,10 @@
     color: var(--scalar-color-1);
   }
 
+  .scalar-app .hover\:text-c-header-1:hover {
+    color: var(--scalar-header-color-1, var(--scalar-color-1));
+  }
+
   .scalar-app .hover\:text-sidebar-c-1:hover {
     color: var(--scalar-sidebar-color-1, var(--scalar-color-1));
   }
@@ -4215,6 +4304,14 @@
   filter: var(--tw-blur,   ) var(--tw-brightness,   ) var(--tw-contrast,   ) var(--tw-grayscale,   ) var(--tw-hue-rotate,   ) var(--tw-invert,   ) var(--tw-saturate,   ) var(--tw-sepia,   ) var(--tw-drop-shadow,   );
 }
 
+.scalar-app .disabled\:pointer-events-none:disabled {
+  pointer-events: none;
+}
+
+.scalar-app .disabled\:opacity-30:disabled {
+  opacity: .3;
+}
+
 .scalar-app .has-\[\:focus-visible\]\:bg-sidebar-b-1:has(:focus-visible) {
   background-color: var(--scalar-sidebar-background-1, var(--scalar-background-1));
 }
@@ -4507,6 +4604,31 @@
   inherits: false
 }
 
+@property --tw-ordinal {
+  syntax: "*";
+  inherits: false
+}
+
+@property --tw-slashed-zero {
+  syntax: "*";
+  inherits: false
+}
+
+@property --tw-numeric-figure {
+  syntax: "*";
+  inherits: false
+}
+
+@property --tw-numeric-spacing {
+  syntax: "*";
+  inherits: false
+}
+
+@property --tw-numeric-fraction {
+  syntax: "*";
+  inherits: false
+}
+
 @property --tw-outline-style {
   syntax: "*";
   inherits: false;

package/package.json

@@ -10,7 +10,7 @@
     "url": "git+https://github.com/scalar/scalar.git",
     "directory": "packages/sidebar"
   },
-  "version": "0.9.0",
+  "version": "0.9.2",
   "engines": {
     "node": ">=22"
   },
@@ -31,16 +31,16 @@
   ],
   "dependencies": {
     "vue": "^3.5.30",
-    "@scalar/components": "0.21.4",
-    "@scalar/helpers": "0.4.3",
-    "@scalar/use-hooks": "0.4.2",
+    "@scalar/components": "0.22.1",
+    "@scalar/helpers": "0.5.1",
     "@scalar/icons": "0.7.2",
-    "@scalar/workspace-store": "0.45.0",
-    "@scalar/themes": "0.15.3"
+    "@scalar/themes": "0.15.3",
+    "@scalar/use-hooks": "0.4.2",
+    "@scalar/workspace-store": "0.46.1"
   },
   "devDependencies": {
     "@tailwindcss/vite": "^4.2.0",
-    "@types/jsdom": "27.0.0",
+    "@types/jsdom": "28.0.1",
     "@types/node": "^24.1.0",
     "@vitejs/plugin-vue": "^6.0.3",
     "@vue/test-utils": "2.4.6",
@@ -52,7 +52,7 @@
   "scripts": {
     "build": "vite build && vue-tsc -p tsconfig.build.json && tsc-alias -p tsconfig.build.json",
     "dev": "vite ./playground -c ./vite.config.ts",
-    "test": "vitest",
+    "test": "vitest --run",
     "types:check": "vue-tsc --noEmit"
   }
 }