Bootstrap: Bump to 5.3.3 and remove from /packages/devextreme/ (#28367)

Author: mpreyskurantov

packages/devextreme-themebuilder/package.json

@@ -21,7 +21,7 @@
     "pack": "cd dist && pnpm pack"
   },
   "peerDependencies": {
-    "bootstrap": "npm:bootstrap@^5.3.0"
+    "bootstrap": "npm:bootstrap@^5.3.3"
   },
   "dependencies": {
     "autoprefixer": "^10.4.7",

packages/devextreme-themebuilder/src/modules/bootstrap-extractor.ts

@@ -87,7 +87,7 @@ export default class BootstrapExtractor {
     }
 
     const result = `${functions}
-${variables.replace('@import "variables-dark";', '')}
+${this.getVariables(variables)}
 ${variablesDark}
 ${this.input}
 ${this.getSetterServiceCode('!default')}
@@ -104,6 +104,10 @@ ${this.getCollectorServiceCode()}`;
     );
   }
 
+  getVariables(variables: string): string {
+    return variables.replace(/^@import "variables-dark";.*$/gm, '');
+  }
+
   getFilePath(fileName: string): string {
     return require.resolve(`bootstrap/scss/${fileName}`);
   }

packages/devextreme-themebuilder/tests/modules/bootstrap-extractor.test.ts

@@ -50,7 +50,7 @@ describe('BootstrapExtractor', () => {
 
     expect(await extractor.sassProcessor())
       .toBe(`${functions.toString()}
-${variables.toString()}
+${extractor.getVariables(variables.toString())}
 ${variablesDark.toString()}
 ${testSassString}
 ${setterServiceCode}

packages/devextreme/package.json

@@ -65,7 +65,6 @@
     "axe-core": "4.10.0",
     "babel-plugin-add-module-exports": "1.0.4",
     "babel-plugin-inferno": "6.7.1",
-    "bootstrap": "5.3.2",
     "cldr-core": "41.0.0",
     "cldr-numbers-full": "41.0.0",
     "cldrjs": "0.5.5",

packages/devextreme/testing/tests/Bootstrap Integration/widget_bundled.tests.js

@@ -17,7 +17,7 @@ QUnit.testStart(function() {
 
 executeAsyncMock.setup();
 
-const BOOTSTRAP_CSS_URL = window.ROOT_URL + 'packages/devextreme/node_modules/bootstrap/dist/css/bootstrap.css';
+const BOOTSTRAP_CSS_URL = window.ROOT_URL + 'packages/devextreme-themebuilder/node_modules/bootstrap/dist/css/bootstrap.css';
 
 const applyBootstrap = (function() {
     let styles = null;

pnpm-lock.yaml

@@ -72,7 +72,7 @@ sh.pushd(path.join(ROOT_DIR, 'packages/devextreme/artifacts'));
 sh.popd();
 
 // TODO: maybe we should add bootstrap to vendors
-const BOOTSTRAP_DIR = path.join(ROOT_DIR, 'packages', 'devextreme', 'node_modules', 'bootstrap', 'dist');
+const BOOTSTRAP_DIR = path.join(ROOT_DIR, 'packages', 'devextreme-themebuilder', 'node_modules', 'bootstrap', 'dist');
 sh.cp([path.join(BOOTSTRAP_DIR, 'js', 'bootstrap.js'), path.join(BOOTSTRAP_DIR, 'js', 'bootstrap.min.js')], JS_ARTIFACTS);
 sh.cp([path.join(BOOTSTRAP_DIR, 'css', 'bootstrap.css'), path.join(BOOTSTRAP_DIR, 'css', 'bootstrap.min.css')], CSS_ARTIFACTS);