release hotfixes to production - June 2025

browser/tasks/Transformer.ts

@@ -1031,10 +1031,10 @@ class CodeViewer {
         // jsonContent = jsonContent.replace(/\/\//g, "/");
 
         this.hasRelativeAssetsUrls = false;
-        this.path = filePath;
-        this.content = jsonContent;
         this.isMain = isMain;
         this.fileExtension = fileExtension;
         this.fileHeader = fileHeader;
+        this.path = filePath;
+        this.content = jsonContent;
     }
 }

browser/tasks/gulp-samples.js

@@ -46,6 +46,7 @@ var sampleSources = [
     // igConfig.SamplesCopyPath + '/charts/data-chart/chart-performance/package.json',
     // igConfig.SamplesCopyPath + '/charts/financial-chart/high-frequency/package.json',
     // igConfig.SamplesCopyPath + '/charts/financial-chart/high-volume/package.json',
+    // igConfig.SamplesCopyPath + '/charts/data-chart/data-annotation-multiple-with-stocks/package.json',
 
     // including all samples for all components:
     igConfig.SamplesCopyPath + '/**/package.json',
@@ -728,6 +729,7 @@ function updateCodeViewer(cb) {
 
         var content = "{\r\n \"sampleFiles\":\r\n";
         var contentItems = [];
+        var dataFiles = [];
 
         var tsItem = new CodeViewer(sample.SampleFilePath, sample.SampleFileSourceCode, "ts", "ts", true);
 
@@ -739,19 +741,40 @@ function updateCodeViewer(cb) {
                 var cssItem = new CodeViewer(file, cssContent, "css", "css", true);
                 contentItems.push(cssItem);
             }
+            else if (file.indexOf(".html") > 0) {
+                var tsContent = fs.readFileSync(file, "utf8");
+                var tsItem = new CodeViewer(file, tsContent, "html", "html", true);
+                contentItems.push(tsItem);
+            }
             else if (file.indexOf(".ts") > 0 && file.indexOf(sample.SampleFileName) == -1) {
 
-                var isIndex = file.indexOf("index.ts") > 0;
                 var tsContent = fs.readFileSync(file, "utf8");
                 var tsItem = new CodeViewer(file, tsContent, "ts", "ts", true);
-                tsItem.fileHeader = isIndex ? "ts" : "DATA";
-                contentItems.push(tsItem);
+
+                if (file.indexOf("index.ts") > 0) {
+                    tsItem.fileHeader = "ts";
+                    contentItems.push(tsItem);
+                } else {
+                    tsItem.fileHeader = "DATA";
+                    dataFiles.push(tsItem); 
+                }
             }
-            else if (file.indexOf(".html") > 0) {
-                var tsContent = fs.readFileSync(file, "utf8");
-                var tsItem = new CodeViewer(file, tsContent, "html", "html", true);
-                contentItems.push(tsItem);
+        }
+
+        if (dataFiles.length === 1) {
+            contentItems.push(dataFiles[0]);
+        } else if (dataFiles.length > 1) {
+            // combining multiple data files into one data source
+            var dataPath = dataFiles[0].path;
+            var dataFolder = dataPath.substring(0, dataPath.lastIndexOf("/"));
+            var dataContent = "// NOTE this file contains multiple data sources:";
+            for (let i = 0; i < dataFiles.length; i++) {
+                const data = dataFiles[i];
+                dataContent += "\r\n\r\n" + "// Data Source #" + (i+1) + "\r\n";
+                dataContent += data.content + "\r\n";
             }
+            var dataItem = new CodeViewer(dataFolder + "/DataSources.ts", dataContent, "ts", "DATA", true);
+            contentItems.push(dataItem);
         }
 
         content += JSON.stringify(contentItems, null, ' ');

samples/layouts/stepper/styling/src/StepperStyle.css

@@ -1,9 +1,49 @@
-igc-step::part(title) {
-  color: var(--ig-primary-500);
+
+:root {
+  --color-teal: rgba(77, 182, 172, 1);
+  --color-dark-navy: rgba(26, 35, 126, 1);
+  --color-aqua-gray: rgba(208, 236, 236, 1);
+  --color-white: rgba(255, 255, 255, 1);
+
+  --color-teal-hover: rgba(26, 35, 126, 1);
+  --color-teal-shadow: rgba(77, 182, 172, 0.5);
 }
-igc-step[active]::part(indicator) {
-  background-color: var(--ig-primary-500);
+
+igc-button::part(base) {
+  margin: 1rem 0.5rem 0 0;
+  background-color: var(--color-teal);
+  color: var(--color-white);
+  font-weight: 600;
+  transition: background-color 0.25s ease, transform 0.1s ease;
+}
+
+igc-button:hover::part(base) {
+  background-color: var(--color-dark-navy);
+}
+
+igc-button:active::part(base) {
+  transform: scale(0.96);
 }
+
+igc-step::part(title) {
+  color: var(--color-dark-navy);
+  font-variant: small-caps;
+  font-weight: bold;
+}
+
 igc-step::part(indicator) {
-  background-color: var(--ig-surface-500);
+  border-radius: 12px 6px 12px 6px;
+  background-color: var(--color-aqua-gray);
+  color: var(--color-dark-navy);
+  transition: all 0.2s ease;
+}
+
+igc-step[active]::part(indicator) {
+  background-color: var(--color-teal);
+  box-shadow: 0 2px 8px var(--color-teal-shadow);
+  transform: scale(1.04);
 }
+
+igc-step[active]:active::part(indicator) {
+  transform: scale(1.08);
+}