@castlabs/ui 7.14.0 → 7.15.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@castlabs/ui",
-  "version": "7.14.0",
+  "version": "7.15.0",
   "repository": "https://github.com/castlabs/ui-styleguide",
   "private": false,
   "description": "A vanilla HTML/CS/JS & Vue.js component library for Castlabs.",
@@ -42,30 +42,30 @@
     "simplebar": "6.3.3"
   },
   "optionalDependencies": {
-    "@rollup/rollup-linux-x64-gnu": "4.57.1"
+    "@rollup/rollup-linux-x64-gnu": "4.59.0"
   },
   "devDependencies": {
     "@castlabs/ui-editor": "file:../castlabs-ui-editor",
     "@tsconfig/node22": "22.0.5",
-    "@types/jsdom": "27.0.0",
-    "@types/node": "25.2.0",
+    "@types/jsdom": "28.0.0",
+    "@types/node": "25.3.0",
     "@vitejs/plugin-vue": "6.0.4",
-    "@vitest/eslint-plugin": "1.6.6",
+    "@vitest/eslint-plugin": "1.6.9",
     "@vue/eslint-config-prettier": "10.2.0",
-    "@vue/eslint-config-typescript": "14.6.0",
+    "@vue/eslint-config-typescript": "14.7.0",
     "@vue/test-utils": "2.4.6",
     "@vue/tsconfig": "0.8.1",
     "core-js": "3.48.0",
     "dree": "5.1.5",
     "eslint-plugin-import": "2.32.0",
-    "eslint-plugin-n": "17.23.2",
+    "eslint-plugin-n": "17.24.0",
     "eslint-plugin-promise": "7.2.1",
-    "eslint-plugin-vue": "10.7.0",
+    "eslint-plugin-vue": "10.8.0",
     "eslint": "9.39.2",
     "gulp-concat": "2.6.1",
     "gulp-replace": "1.1.4",
     "gulp": "5.0.1",
-    "jsdom": "28.0.0",
+    "jsdom": "28.1.0",
     "npm-run-all": "4.1.5",
     "sass": "1.97.3",
     "stylelint-config-sass-guidelines": "13.0.0",
@@ -76,7 +76,7 @@
     "typescript": "5.9.3",
     "vite": "7.3.1",
     "vitest": "4.0.18",
-    "vue-tsc": "3.2.4",
-    "vue": "3.5.27"
+    "vue-tsc": "3.2.5",
+    "vue": "3.5.29"
   }
 }

package/src/components/ClList/style.variables.scss

@@ -7,6 +7,12 @@
 
 @use '../../styles/global' as *;
 
+%cl-list-tight {
+  li {
+    margin-top: $spacing-tiny;
+  }
+}
+
 %cl-list {
   @include cl-accent;
 
@@ -32,6 +38,10 @@
     }
   }
 
+  &.cl-tight {
+    @extend %cl-list-tight;
+  }
+
   &.cl-list-none {
     margin-left: 0;
 

package/src/components/navigation/ClNavSide/ClNavDrawer/style.scss

@@ -410,6 +410,12 @@ $sidenav-color-text-minor: $color-ci-ash;
       padding: $spacing-tiny $spacing-small;
       position: relative;
 
+      @include media-breakpoint-up(md) {
+        // reduce nav item heigt a bit on larger screens
+        padding-bottom: $spacing-tiny - px(1);
+        padding-top: $spacing-tiny - px(1);
+      }
+
       &::after {
         // we use a block item, not a border, so content does not jump
         background-color: $color-ci-red;
@@ -430,6 +436,13 @@ $sidenav-color-text-minor: $color-ci-ash;
     }
   }
 
+  @for $depth from 1 through 5 {
+    .cl-nav-item-level-#{$depth},
+    .cl-nav-item-level-#{$depth}.active {
+      padding-left: $spacing-small * $depth;
+    }
+  }
+
   .cl-dropdown {
     // service drawer
     #{'--cl-color-text'}: $color-ci-eggshell;

package/src/styles/abstracts/responsive.scss

@@ -22,12 +22,20 @@ $grid-table-responsive: sm;
 
 @function breakpoint-min($breakpoint) {
   $min: map.get($grid-breakpoints, $breakpoint);
-  @return if($min != 0, $min, null);
+  @if $min != 0 {
+    @return $min;
+  } @else {
+    @return null;
+  }
 }
 
 @function breakpoint-max($breakpoint) {
   $max: map.get($grid-breakpoints, $breakpoint);
-  @return if($max and $max > 0, $max - 0.02, null);
+  @if max and $max > 0 {
+    @return $max - 0.02;
+  } @else {
+    @return null;
+  }
 }
 
 @function breakpoint-next($breakpoint, $breakpoint-names: map.keys($grid-breakpoints)) {
@@ -35,7 +43,11 @@ $grid-table-responsive: sm;
   @if not $n {
     @error 'breakpoint `#{$breakpoint}` not found in `#{$grid-breakpoints}`';
   }
-  @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
+  @if $n < length($breakpoint-names) {
+    @return nth($breakpoint-names, $n + 1);
+  } @else {
+    @return null;
+  }
 }
 
 @mixin media-breakpoint-up($breakpoint) {

package/src/styles/abstracts/typography.scss

@@ -487,14 +487,13 @@ $typography-responsive-scale: 0.8;
 %cl-p-pre-box {
   @extend %cl-p-pre;
 
-  border: $brand-line-width solid var(--cl-color-text);
+  background-color: $color-ci-haze;
   border-radius: $brand-border-radius;
-  clip-path: inset(-1px round 22px);
+  clip-path: inset(0 round $brand-border-radius);
   font-size: px(15);
   line-height: 1.4;
   margin-top: $spacing-small;
   padding: $spacing-small;
-  padding-bottom: 0.95rem; // fix for overlapping scrollbar/clip
 }
 
 %cl-p-tag {

package/src/styles/assets/logo.scss

@@ -16,9 +16,6 @@ $cl-url-postfix: '' !default;
   background-size: contain;
   display: inline-block;
   height: 1em * 2;
-  margin-bottom: -1em;
-  position: relative;
-  top: -0.4em;
   width: 2.95em * 2;
 }
 
@@ -29,9 +26,6 @@ $cl-url-postfix: '' !default;
   background-size: contain;
   display: inline-block;
   height: 1em * 2;
-  margin-bottom: -1em;
-  position: relative;
-  top: -0.4em;
   width: 2.95em * 2;
 }
 

package/src/styles/layout/meta.scss

@@ -1,3 +1,3 @@
 :root {
-  #{'--cl-version'}: 'v7.14.0';
+  #{'--cl-version'}: 'v7.15.0';
 }