igniteui-angular 18.0.0-beta.0 → 18.0.0-rc.0

package/lib/core/styles/components/slider/_slider-theme.scss

@@ -237,7 +237,7 @@
         border-radius: border-radius(rem(32px));
 
         @if $variant == 'indigo-design' {
-            border-radius: initial;
+            border-radius: border-radius(rem(4px));
         }
     }
 
@@ -290,6 +290,14 @@
             top: 0;
             align-items: flex-end;
         }
+
+        @if $variant == 'indigo-design' {
+            bottom: rem(3px);
+
+            &%igx-slider__ticks--top {
+                top: rem(3px);
+            }
+        }
     }
 
     %igx-slider__ticks-group {
@@ -303,7 +311,7 @@
         }
 
         &:last-of-type {
-            margin-inline-start: rem(-1px);
+            margin-inline-end: rem(-1px);
         }
     }
 
@@ -330,6 +338,10 @@
     %igx-slider__ticks--tall {
         %igx-slider__ticks-label {
             top: calc(#{$tick-height--tall} + #{$tick-height});
+
+            @if $variant == 'indigo-design' {
+                top: calc(#{$tick-height--tall} + (#{$tick-height} / 2));
+            }
         }
     }
 
@@ -348,6 +360,10 @@
 
         %igx-slider__ticks-label {
             top: calc(#{$tick-height--tall} + #{$tick-height});
+
+            @if $variant == 'indigo-design' {
+                top: calc(#{$tick-height--tall} + (#{$tick-height} / 2));
+            }
         }
     }
 
@@ -535,6 +551,10 @@
         display: flex;
         top: calc(((#{$thumb-label-height}) + rem(20px)) * -1);
         height: $thumb-label-height;
+
+        @if $variant == 'indigo-design' {
+            top: calc(((#{$thumb-label-height}) + rem(18px)) * -1);
+        }
     }
 
     %igx-slider-thumb-label__container {
@@ -561,6 +581,11 @@
             border-inline-start: rem(10px) solid transparent;
             border-inline-end: rem(10px) solid transparent;
             border-top: rem(10px) solid var-get($theme, 'label-background-color');
+
+            @if $variant == 'indigo-design' {
+                top: rem(16px);
+                border-top: rem(12px) solid var-get($theme, 'label-background-color');
+            }
         }
     }
 

package/migrations/update-18_0_0/index.js

@@ -98,12 +98,23 @@ exports.default = () => (host, context) => __awaiter(void 0, void 0, void 0, fun
                 continue;
             }
             const content = cssBuffer.toString('utf-8');
-            const newContent = `
+            let newContent = `
 // Specifies large size for all components to match the previous defaults
 // This may not be needed for your project. Please consult https://www.infragistics.com/products/ignite-ui-angular/angular/components/general/update-guide for more details.
 :root {
     --ig-size: var(--ig-size-large);
-}\n` + content;
+}\n`;
+            const lastUse = content.lastIndexOf('@use');
+            const lastForward = content.lastIndexOf('@forward');
+            if (lastUse > -1 || lastForward > -1) {
+                const lastLinePos = Math.max(lastForward, lastUse);
+                const fragment = content.substring(lastLinePos);
+                const insertPos = fragment.indexOf(';') + lastLinePos + 1;
+                newContent = content.substring(0, insertPos) + newContent + content.substring(insertPos + 1);
+            }
+            else {
+                newContent = newContent + content;
+            }
             // Write the new content to the CSS file
             host.overwrite(stylesPath, newContent);
             context.logger.info(`Added global default Large size for ig components to CSS file: ${stylesPath}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "igniteui-angular",
-  "version": "18.0.0-beta.0",
+  "version": "18.0.0-rc.0",
   "description": "Ignite UI for Angular is a dependency-free Angular toolkit for building modern web apps",
   "author": "Infragistics",
   "license": "SEE LICENSE IN LICENSE",
@@ -94,7 +94,7 @@
     }
   },
   "igxDevDependencies": {
-    "@igniteui/angular-schematics": "~18.0.1330-beta.0"
+    "@igniteui/angular-schematics": "~18.0.1330-rc.0"
   },
   "ng-update": {
     "migrations": "./migrations/migration-collection.json",