Merge pull request #3955 from IgniteUI/vnext

Updating prod for 21.2.0

Author: ChronosSF

gulpfile.js

@@ -19,6 +19,7 @@ const { generateLiveEditing } = require('igniteui-live-editing');
 const argv = yargs(hideBin(process.argv)).parse();
 
 const submodule = "igniteui-live-editing-samples";
+const mainPkgDevDeps = JSON.parse(fs.readFileSync(path.join(__dirname, 'package.json'), 'utf8')).devDependencies;
 
 gulp.task("generate-live-editing", async () => {
     var appDv = argv.appDv !== undefined && argv.appDv.toLowerCase().trim() === "true";
@@ -53,7 +54,38 @@ gulp.task("generate-live-editing", async () => {
                 },
                 additionalSharedStyles: ["_variables.scss", "_app-layout.scss"]
             })
+    const samplesDir = path.resolve(liveEditingOptions.samplesDir, 'samples');
     await generateLiveEditing(liveEditingOptions);
+
+    const sharedJsonPath = path.join(samplesDir, 'shared.json');
+    const sharedJson = JSON.parse(fs.readFileSync(sharedJsonPath, 'utf8'));
+    const stylesFile = sharedJson.files && sharedJson.files.find(f => f.path === 'src/styles.scss');
+    if (stylesFile) {
+        const tailwindImportRegex = /@import\s+["']tailwindcss["']\s*;?\r?\n?/g;
+        const stylesWithTailwind = tailwindImportRegex.test(stylesFile.content)
+            ? stylesFile.content
+            : stylesFile.content.replace(/((?:@use [^\n]+\n)+)/, '$1@import "tailwindcss";\n');
+        stylesFile.content = stylesFile.content.replace(tailwindImportRegex, '');
+        fs.writeFileSync(sharedJsonPath, JSON.stringify(sharedJson));
+
+        fs.readdirSync(samplesDir)
+            .filter(f => f.endsWith('.json') && f !== 'shared.json' && f !== 'meta.json')
+            .forEach(f => {
+                const samplePath = path.join(samplesDir, f);
+                const sample = JSON.parse(fs.readFileSync(samplePath, 'utf8'));
+                const deps = JSON.parse(sample.sampleDependencies || '{}');
+                if (deps['tailwindcss']) {
+                    const existing = sample.sampleFiles.findIndex(sf => sf.path === 'src/styles.scss');
+                    const styleEntry = { path: 'src/styles.scss', hasRelativeAssetsUrls: false, content: stylesWithTailwind };
+                    if (existing !== -1) {
+                        sample.sampleFiles[existing] = styleEntry;
+                    } else {
+                        sample.sampleFiles.push(styleEntry);
+                    }
+                    fs.writeFileSync(samplePath, JSON.stringify(sample));
+                }
+            });
+    }
 });
 
 gulp.task("overwrite-package-json", (done) => {
@@ -116,8 +148,15 @@ const processApp = (projectPath, dest, directoriesToExclude) => {
                     "path": "package.json",
                     "hasRelativeAssetsUrls": false,
                     "content": JSON.stringify({
-                        "dependencies": JSON.parse(jsonObj.sampleDependencies),
-                        "devDependencies": sharedJson.devDependencies
+                        "name": "example-app",
+                        "version": "0.0.0",
+                        "scripts": {
+                            "ng": "ng",
+                            "start": "node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng serve",
+                            "build": "node --max_old_space_size=12192 node_modules/@angular/cli/bin/ng build"
+                        },
+                        "dependencies": Object.fromEntries(Object.entries(JSON.parse(jsonObj.sampleDependencies)).map(([pkg, ver]) => [pkg, /^[\^~><=*]/.test(ver) ? ver : '^' + ver])),
+                        "devDependencies": Object.fromEntries(Object.keys(sharedJson.devDependencies).map(pkg => [pkg, mainPkgDevDeps[pkg] || sharedJson.devDependencies[pkg]]))
                     }, null, 2)
                 }
                 additionals.push(packageJson);
@@ -153,6 +192,16 @@ const processApp = (projectPath, dest, directoriesToExclude) => {
                     } else {
                         sampleContent = sampleFile.content;
                     }
+                    if (sampleFile.path === 'src/styles.scss') {
+                        const deps = JSON.parse(jsonObj.sampleDependencies);
+                        const tailwindImportRegex = /@import\s+["']tailwindcss["'];?/;
+                        const tailwindImportStripRegex = /@import\s+["']tailwindcss["'];?\r?\n?/g;
+                        if (deps['tailwindcss'] && !tailwindImportRegex.test(sampleContent)) {
+                            sampleContent = sampleContent.replace(/((?:@use [^\n]+\n)+)/, '$1@import "tailwindcss";\n');
+                        } else if (!deps['tailwindcss']) {
+                            sampleContent = sampleContent.replace(tailwindImportStripRegex, '');
+                        }
+                    }
                     const paths = sampleFile.path.replace("./", "").split("/");
                     let tempPath = "";
                     paths.forEach(p => {

live-editing/configs/GridConfigGenerator.ts

@@ -837,6 +837,12 @@ export class GridConfigGenerator implements IConfigGenerator {
             appConfig: BaseAppConfig
         }));
 
+        configs.push(new Config({
+            component: 'GridDisableSummariesComponent',
+            additionalFiles: ['/src/app/data/nwindData.ts'],
+            appConfig: BaseAppConfig
+        }));
+
         configs.push(new Config({
             component: 'GridStatePersistenceSampleComponent',
             additionalFiles: ['/src/app/directives/prevent-scroll.directive.ts', '/src/app/data/financialData.ts', '/src/app/services/financial.service.ts'],

live-editing/configs/PivotGridConfigGenerator.ts

@@ -76,6 +76,12 @@ export class PivotGridConfigGenerator implements IConfigGenerator {
             component: 'PivotDataSelectorSampleComponent'
         }));
 
+        configs.push(new Config({
+            additionalFiles: ['/src/app/directives/prevent-scroll.directive.ts', '/src/app/data/dataToAnalyze.ts'],
+            appConfig: BaseAppConfig,
+            component: 'PivotGridLayoutComponent'
+        }));
+
         return configs;
     }
 }

live-editing/configs/QueryBuilderConfigGenerator.ts

@@ -40,6 +40,13 @@ export class QueryBuilderConfigGenerator implements IConfigGenerator {
             shortenComponentPathBy: "/interactions/query-builder/"
         }));
 
+        configs.push(new Config({
+            component: 'QueryBuilderTailwindStyleComponent',
+            additionalDependencies: ["tailwindcss", "@tailwindcss/postcss"],
+            appConfig: BaseAppConfig,
+            shortenComponentPathBy: "/interactions/query-builder/"
+        }));
+
         return configs;
     }
 }

live-editing/configs/RippleConfigGenerator.ts

@@ -9,6 +9,36 @@ export class RippleConfigGenerator implements IConfigGenerator {
     public generateConfigs(): Config[] {
         const configs = new Array<Config>();
 
+        configs.push(new Config({
+            component: 'RippleSample2Component',
+            appConfig: BaseAppConfig,
+            shortenComponentPathBy: "/interactions/ripple/"
+        }));
+
+        configs.push(new Config({
+            component: 'RippleSample3Component',
+            appConfig: BaseAppConfig,
+            shortenComponentPathBy: "/interactions/ripple/"
+        }));
+
+        configs.push(new Config({
+            component: 'RippleSample4Component',
+            appConfig: BaseAppConfig,
+            shortenComponentPathBy: "/interactions/ripple/"
+        }));
+
+        configs.push(new Config({
+            component: 'RippleSample5Component',
+            appConfig: BaseAppConfig,
+            shortenComponentPathBy: "/interactions/ripple/"
+        }));
+
+        configs.push(new Config({
+            component: 'RippleSample6Component',
+            appConfig: BaseAppConfig,
+            shortenComponentPathBy: "/interactions/ripple/"
+        }));
+
         configs.push(new Config({
             component: 'RippleStylingSampleComponent',
             additionalFiles: ["/src/app/interactions/ripple/ripple-stying/layout.scss"],