diff --git a/README.md b/README.md
index 2005d4e..0be2c2f 100644
--- a/README.md
+++ b/README.md
@@ -68,7 +68,7 @@ Built-in Material 3 stylesheets provide a modern, accessible design out of the b
- Source
+ Source
|
Live demo
diff --git a/components/base/tsconfig.json b/components/base/tsconfig.json
index 3ab8c23..92826d6 100644
--- a/components/base/tsconfig.json
+++ b/components/base/tsconfig.json
@@ -9,14 +9,14 @@
"moduleResolution": "Node", // Resolve modules using Node-style resolution.
"noEmitOnError": true, // Prevent emitting JS files if there are errors.
"noFallthroughCasesInSwitch": true, // Prevent fallthrough in switch cases.
- "noImplicitAny": true, // Disallow implicit any types.
+ "noImplicitAny": false, // Disallow implicit any types.
"noImplicitReturns": true, // Ensure functions return a value.
"noUnusedLocals": true, // Warn on unused local variables.
"noUnusedParameters": true, // Warn on unused function parameters.
- "strict": true, // Enable all strict checks.
- "strictBindCallApply": true, // Enable strict checking of bind, call, and apply methods.
- "strictFunctionTypes": true, // Enable strict checking of function types.
- "strictNullChecks": true, // Enable strict null checks.
+ "strict": false, // Enable all strict checks.
+ "strictBindCallApply": false, // Enable strict checking of bind, call, and apply methods.
+ "strictFunctionTypes": false, // Enable strict checking of function types.
+ "strictNullChecks": false, // Enable strict null checks.
"skipLibCheck": true, // Skip checking of declaration files.
"sourceMap": true, // Generate source maps.
"target": "ES2020", // Set ECMAScript version to ES2020.
diff --git a/components/buttons/gulpfile.js b/components/buttons/gulpfile.js
index b1bf280..f75b59b 100644
--- a/components/buttons/gulpfile.js
+++ b/components/buttons/gulpfile.js
@@ -1,5 +1,7 @@
var gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
+const glob = require('glob');
+const fs = (global.fs = global.fs || require("fs"));
/**
* Compile ts files
@@ -45,8 +47,22 @@ gulp.task('styles', function (done) {
});
});
+/**
+* Remove css variables for CSS files
+*/
+gulp.task('react-remove-css', function (done) {
+ var getCss = glob.sync('./styles/**/*.css');
+ for (var i = 0; i < getCss.length; i++) {
+ var cssContent = fs.readFileSync(getCss[i], 'utf8');
+ cssContent = cssContent.replace(/(:root\s*{[^}]*})|(\:root, .sf-light-mode\s*{[^}]*})|(\.sf-dark-mode\s*{[^}]*})/g, '');
+ cssContent = cssContent.replace(/^\s*[\r\n]/gm, '');
+ fs.writeFileSync(getCss[i], cssContent, 'utf8');
+ }
+ done();
+});
+
/**
* Build ts and scss files
*/
-gulp.task('build', gulp.series('scripts', 'styles'));
+gulp.task('build', gulp.series('scripts', 'styles', 'react-remove-css'));
diff --git a/components/buttons/styles/button/material3.scss b/components/buttons/styles/button/material3.scss
index 9eeb62e..bb8b567 100644
--- a/components/buttons/styles/button/material3.scss
+++ b/components/buttons/styles/button/material3.scss
@@ -1,2 +1,3 @@
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/buttons/styles/check-box/material3.scss b/components/buttons/styles/check-box/material3.scss
index 84409d0..bb8b567 100644
--- a/components/buttons/styles/check-box/material3.scss
+++ b/components/buttons/styles/check-box/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/buttons/styles/chips/material3.scss b/components/buttons/styles/chips/material3.scss
index 84409d0..bb8b567 100644
--- a/components/buttons/styles/chips/material3.scss
+++ b/components/buttons/styles/chips/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/buttons/styles/floating-action-button/material3.scss b/components/buttons/styles/floating-action-button/material3.scss
index c75e79d..565e980 100644
--- a/components/buttons/styles/floating-action-button/material3.scss
+++ b/components/buttons/styles/floating-action-button/material3.scss
@@ -1,4 +1,4 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import '../button/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/buttons/styles/material3.scss b/components/buttons/styles/material3.scss
index 5932ebc..2ff7afe 100644
--- a/components/buttons/styles/material3.scss
+++ b/components/buttons/styles/material3.scss
@@ -1,11 +1,5 @@
-@import '../base/themes/material3.scss';
-@import 'button/material3-definition.scss';
-@import 'button/all.scss';
-@import 'check-box/material3-definition.scss';
-@import 'check-box/all.scss';
-@import 'radio-button/material3-definition.scss';
-@import 'radio-button/all.scss';
-@import 'chips/material3-definition.scss';
-@import 'chips/all.scss';
-@import 'floating-action-button/material3-definition.scss';
-@import 'floating-action-button/all.scss';
+@import 'button/material3.scss';
+@import 'check-box/material3.scss';
+@import 'radio-button/material3.scss';
+@import 'chips/material3.scss';
+@import 'floating-action-button/material3.scss';
diff --git a/components/buttons/styles/radio-button/material3.scss b/components/buttons/styles/radio-button/material3.scss
index 84409d0..bb8b567 100644
--- a/components/buttons/styles/radio-button/material3.scss
+++ b/components/buttons/styles/radio-button/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/calendars/gulpfile.js b/components/calendars/gulpfile.js
index b1bf280..f75b59b 100644
--- a/components/calendars/gulpfile.js
+++ b/components/calendars/gulpfile.js
@@ -1,5 +1,7 @@
var gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
+const glob = require('glob');
+const fs = (global.fs = global.fs || require("fs"));
/**
* Compile ts files
@@ -45,8 +47,22 @@ gulp.task('styles', function (done) {
});
});
+/**
+* Remove css variables for CSS files
+*/
+gulp.task('react-remove-css', function (done) {
+ var getCss = glob.sync('./styles/**/*.css');
+ for (var i = 0; i < getCss.length; i++) {
+ var cssContent = fs.readFileSync(getCss[i], 'utf8');
+ cssContent = cssContent.replace(/(:root\s*{[^}]*})|(\:root, .sf-light-mode\s*{[^}]*})|(\.sf-dark-mode\s*{[^}]*})/g, '');
+ cssContent = cssContent.replace(/^\s*[\r\n]/gm, '');
+ fs.writeFileSync(getCss[i], cssContent, 'utf8');
+ }
+ done();
+});
+
/**
* Build ts and scss files
*/
-gulp.task('build', gulp.series('scripts', 'styles'));
+gulp.task('build', gulp.series('scripts', 'styles', 'react-remove-css'));
diff --git a/components/calendars/styles/calendar/material3.scss b/components/calendars/styles/calendar/material3.scss
index ddbe045..74ac8f8 100644
--- a/components/calendars/styles/calendar/material3.scss
+++ b/components/calendars/styles/calendar/material3.scss
@@ -1,4 +1,4 @@
-@import '../../base/themes/material3.scss';
-@import '../../buttons/button/material3-definition.scss';
+@import 'react-base/styles/themes/material3.scss';
+@import 'react-buttons/styles/button/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/calendars/styles/datepicker/material3.scss b/components/calendars/styles/datepicker/material3.scss
index a712397..2d9aab8 100644
--- a/components/calendars/styles/datepicker/material3.scss
+++ b/components/calendars/styles/datepicker/material3.scss
@@ -1,5 +1,5 @@
-@import '../../base/themes/material3.scss';
-@import '../../inputs/input/material3-definition.scss';
-@import '../../popups/popup/material3-definition.scss';
+@import 'react-base/styles/themes/material3.scss';
+@import 'react-inputs/styles/input/material3-definition.scss';
+@import 'react-popups/styles/popup/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/calendars/styles/material3.scss b/components/calendars/styles/material3.scss
index e2eac4d..2969a68 100644
--- a/components/calendars/styles/material3.scss
+++ b/components/calendars/styles/material3.scss
@@ -1,10 +1,3 @@
-@import '../base/themes/material3.scss';
-@import '../buttons/button/material3-definition.scss';
-@import '../inputs/input/material3-definition.scss';
-@import '../popups/popup/material3-definition.scss';
-@import 'calendar/material3-definition.scss';
-@import 'calendar/all.scss';
-@import 'datepicker/material3-definition.scss';
-@import 'datepicker/all.scss';
-@import 'timepicker/material3-definition.scss';
-@import 'timepicker/all.scss';
+@import 'calendar/material3.scss';
+@import 'datepicker/material3.scss';
+@import 'timepicker/material3.scss';
diff --git a/components/calendars/styles/timepicker/material3.scss b/components/calendars/styles/timepicker/material3.scss
index a712397..2d9aab8 100644
--- a/components/calendars/styles/timepicker/material3.scss
+++ b/components/calendars/styles/timepicker/material3.scss
@@ -1,5 +1,5 @@
-@import '../../base/themes/material3.scss';
-@import '../../inputs/input/material3-definition.scss';
-@import '../../popups/popup/material3-definition.scss';
+@import 'react-base/styles/themes/material3.scss';
+@import 'react-inputs/styles/input/material3-definition.scss';
+@import 'react-popups/styles/popup/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/dropdowns/gulpfile.js b/components/dropdowns/gulpfile.js
index b1bf280..f75b59b 100644
--- a/components/dropdowns/gulpfile.js
+++ b/components/dropdowns/gulpfile.js
@@ -1,5 +1,7 @@
var gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
+const glob = require('glob');
+const fs = (global.fs = global.fs || require("fs"));
/**
* Compile ts files
@@ -45,8 +47,22 @@ gulp.task('styles', function (done) {
});
});
+/**
+* Remove css variables for CSS files
+*/
+gulp.task('react-remove-css', function (done) {
+ var getCss = glob.sync('./styles/**/*.css');
+ for (var i = 0; i < getCss.length; i++) {
+ var cssContent = fs.readFileSync(getCss[i], 'utf8');
+ cssContent = cssContent.replace(/(:root\s*{[^}]*})|(\:root, .sf-light-mode\s*{[^}]*})|(\.sf-dark-mode\s*{[^}]*})/g, '');
+ cssContent = cssContent.replace(/^\s*[\r\n]/gm, '');
+ fs.writeFileSync(getCss[i], cssContent, 'utf8');
+ }
+ done();
+});
+
/**
* Build ts and scss files
*/
-gulp.task('build', gulp.series('scripts', 'styles'));
+gulp.task('build', gulp.series('scripts', 'styles', 'react-remove-css'));
diff --git a/components/dropdowns/styles/drop-down-base/material3.scss b/components/dropdowns/styles/drop-down-base/material3.scss
index 84409d0..bb8b567 100644
--- a/components/dropdowns/styles/drop-down-base/material3.scss
+++ b/components/dropdowns/styles/drop-down-base/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/dropdowns/styles/drop-down-list/material3.scss b/components/dropdowns/styles/drop-down-list/material3.scss
index 84409d0..bb8b567 100644
--- a/components/dropdowns/styles/drop-down-list/material3.scss
+++ b/components/dropdowns/styles/drop-down-list/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/dropdowns/styles/material3.scss b/components/dropdowns/styles/material3.scss
index 4710e5e..13aca5d 100644
--- a/components/dropdowns/styles/material3.scss
+++ b/components/dropdowns/styles/material3.scss
@@ -1,5 +1,2 @@
-@import '../base/themes/material3.scss';
-@import 'drop-down-base/material3-definition.scss';
-@import 'drop-down-base/all.scss';
-@import 'drop-down-list/material3-definition.scss';
-@import 'drop-down-list/all.scss';
+@import 'drop-down-base/material3.scss';
+@import 'drop-down-list/material3.scss';
diff --git a/components/grids/CHANGELOG.md b/components/grid/CHANGELOG.md
similarity index 100%
rename from components/grids/CHANGELOG.md
rename to components/grid/CHANGELOG.md
diff --git a/components/grids/README.md b/components/grid/README.md
similarity index 100%
rename from components/grids/README.md
rename to components/grid/README.md
diff --git a/components/grids/gulpfile.js b/components/grid/gulpfile.js
similarity index 66%
rename from components/grids/gulpfile.js
rename to components/grid/gulpfile.js
index b1bf280..a451969 100644
--- a/components/grids/gulpfile.js
+++ b/components/grid/gulpfile.js
@@ -1,5 +1,7 @@
var gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
+const glob = require('glob');
+const fs = (global.fs = global.fs || require("fs"));
/**
* Compile ts files
@@ -45,8 +47,22 @@ gulp.task('styles', function (done) {
});
});
+/**
+* Remove css variables for CSS files
+*/
+gulp.task('remove-css', function (done) {
+ var getCss = glob.sync('./styles/**/*.css');
+ for (var i = 0; i < getCss.length; i++) {
+ var cssContent = fs.readFileSync(getCss[i], 'utf8');
+ cssContent = cssContent.replace(/(:root\s*{[^}]*})|(\:root, .sf-light-mode\s*{[^}]*})|(\.sf-dark-mode\s*{[^}]*})/g, '');
+ cssContent = cssContent.replace(/^\s*[\r\n]/gm, '');
+ fs.writeFileSync(getCss[i], cssContent, 'utf8');
+ }
+ done();
+});
+
/**
* Build ts and scss files
*/
-gulp.task('build', gulp.series('scripts', 'styles'));
+gulp.task('build', gulp.series('scripts', 'styles', 'remove-css'));
diff --git a/components/grids/license b/components/grid/license
similarity index 100%
rename from components/grids/license
rename to components/grid/license
diff --git a/components/grids/package.json b/components/grid/package.json
similarity index 100%
rename from components/grids/package.json
rename to components/grid/package.json
diff --git a/components/grids/src/grid/components/Column.tsx b/components/grid/src/grid/components/Column.tsx
similarity index 100%
rename from components/grids/src/grid/components/Column.tsx
rename to components/grid/src/grid/components/Column.tsx
diff --git a/components/grids/src/grid/components/Grid.tsx b/components/grid/src/grid/components/Grid.tsx
similarity index 100%
rename from components/grids/src/grid/components/Grid.tsx
rename to components/grid/src/grid/components/Grid.tsx
diff --git a/components/grids/src/grid/components/Row.tsx b/components/grid/src/grid/components/Row.tsx
similarity index 100%
rename from components/grids/src/grid/components/Row.tsx
rename to components/grid/src/grid/components/Row.tsx
diff --git a/components/grids/src/grid/components/index.ts b/components/grid/src/grid/components/index.ts
similarity index 100%
rename from components/grids/src/grid/components/index.ts
rename to components/grid/src/grid/components/index.ts
diff --git a/components/grids/src/grid/contexts/GridProviders.tsx b/components/grid/src/grid/contexts/GridProviders.tsx
similarity index 100%
rename from components/grids/src/grid/contexts/GridProviders.tsx
rename to components/grid/src/grid/contexts/GridProviders.tsx
diff --git a/components/grids/src/grid/contexts/index.ts b/components/grid/src/grid/contexts/index.ts
similarity index 100%
rename from components/grids/src/grid/contexts/index.ts
rename to components/grid/src/grid/contexts/index.ts
diff --git a/components/grids/src/grid/grid/_all.scss b/components/grid/src/grid/grid/_all.scss
similarity index 100%
rename from components/grids/src/grid/grid/_all.scss
rename to components/grid/src/grid/grid/_all.scss
diff --git a/components/grids/src/grid/grid/_layout.scss b/components/grid/src/grid/grid/_layout.scss
similarity index 100%
rename from components/grids/src/grid/grid/_layout.scss
rename to components/grid/src/grid/grid/_layout.scss
diff --git a/components/grids/src/grid/grid/_material3-definition.scss b/components/grid/src/grid/grid/_material3-definition.scss
similarity index 100%
rename from components/grids/src/grid/grid/_material3-definition.scss
rename to components/grid/src/grid/grid/_material3-definition.scss
diff --git a/components/grids/src/grid/grid/_theme.scss b/components/grid/src/grid/grid/_theme.scss
similarity index 100%
rename from components/grids/src/grid/grid/_theme.scss
rename to components/grid/src/grid/grid/_theme.scss
diff --git a/components/grids/src/grid/hooks/index.ts b/components/grid/src/grid/hooks/index.ts
similarity index 100%
rename from components/grids/src/grid/hooks/index.ts
rename to components/grid/src/grid/hooks/index.ts
diff --git a/components/grids/src/grid/hooks/useColumn.ts b/components/grid/src/grid/hooks/useColumn.ts
similarity index 100%
rename from components/grids/src/grid/hooks/useColumn.ts
rename to components/grid/src/grid/hooks/useColumn.ts
diff --git a/components/grids/src/grid/hooks/useEdit.ts b/components/grid/src/grid/hooks/useEdit.ts
similarity index 100%
rename from components/grids/src/grid/hooks/useEdit.ts
rename to components/grid/src/grid/hooks/useEdit.ts
diff --git a/components/grids/src/grid/hooks/useEditDialog.ts b/components/grid/src/grid/hooks/useEditDialog.ts
similarity index 100%
rename from components/grids/src/grid/hooks/useEditDialog.ts
rename to components/grid/src/grid/hooks/useEditDialog.ts
diff --git a/components/grids/src/grid/hooks/useFilter.ts b/components/grid/src/grid/hooks/useFilter.ts
similarity index 100%
rename from components/grids/src/grid/hooks/useFilter.ts
rename to components/grid/src/grid/hooks/useFilter.ts
diff --git a/components/grids/src/grid/hooks/useFocusStrategy.ts b/components/grid/src/grid/hooks/useFocusStrategy.ts
similarity index 100%
rename from components/grids/src/grid/hooks/useFocusStrategy.ts
rename to components/grid/src/grid/hooks/useFocusStrategy.ts
diff --git a/components/grids/src/grid/hooks/useGrid.tsx b/components/grid/src/grid/hooks/useGrid.tsx
similarity index 100%
rename from components/grids/src/grid/hooks/useGrid.tsx
rename to components/grid/src/grid/hooks/useGrid.tsx
diff --git a/components/grids/src/grid/hooks/useRender.tsx b/components/grid/src/grid/hooks/useRender.tsx
similarity index 100%
rename from components/grids/src/grid/hooks/useRender.tsx
rename to components/grid/src/grid/hooks/useRender.tsx
diff --git a/components/grids/src/grid/hooks/useScroll.tsx b/components/grid/src/grid/hooks/useScroll.tsx
similarity index 100%
rename from components/grids/src/grid/hooks/useScroll.tsx
rename to components/grid/src/grid/hooks/useScroll.tsx
diff --git a/components/grids/src/grid/hooks/useSearch.ts b/components/grid/src/grid/hooks/useSearch.ts
similarity index 100%
rename from components/grids/src/grid/hooks/useSearch.ts
rename to components/grid/src/grid/hooks/useSearch.ts
diff --git a/components/grids/src/grid/hooks/useSelection.ts b/components/grid/src/grid/hooks/useSelection.ts
similarity index 100%
rename from components/grids/src/grid/hooks/useSelection.ts
rename to components/grid/src/grid/hooks/useSelection.ts
diff --git a/components/grids/src/grid/hooks/useSort.ts b/components/grid/src/grid/hooks/useSort.ts
similarity index 100%
rename from components/grids/src/grid/hooks/useSort.ts
rename to components/grid/src/grid/hooks/useSort.ts
diff --git a/components/grids/src/grid/hooks/useToolbar.ts b/components/grid/src/grid/hooks/useToolbar.ts
similarity index 100%
rename from components/grids/src/grid/hooks/useToolbar.ts
rename to components/grid/src/grid/hooks/useToolbar.ts
diff --git a/components/grids/src/grid/index.ts b/components/grid/src/grid/index.ts
similarity index 100%
rename from components/grids/src/grid/index.ts
rename to components/grid/src/grid/index.ts
diff --git a/components/grids/src/grid/models/index.ts b/components/grid/src/grid/models/index.ts
similarity index 100%
rename from components/grids/src/grid/models/index.ts
rename to components/grid/src/grid/models/index.ts
diff --git a/components/grids/src/grid/models/useData.ts b/components/grid/src/grid/models/useData.ts
similarity index 100%
rename from components/grids/src/grid/models/useData.ts
rename to components/grid/src/grid/models/useData.ts
diff --git a/components/grids/src/grid/services/index.ts b/components/grid/src/grid/services/index.ts
similarity index 100%
rename from components/grids/src/grid/services/index.ts
rename to components/grid/src/grid/services/index.ts
diff --git a/components/grids/src/grid/services/service-locator.ts b/components/grid/src/grid/services/service-locator.ts
similarity index 100%
rename from components/grids/src/grid/services/service-locator.ts
rename to components/grid/src/grid/services/service-locator.ts
diff --git a/components/grids/src/grid/services/value-formatter.ts b/components/grid/src/grid/services/value-formatter.ts
similarity index 100%
rename from components/grids/src/grid/services/value-formatter.ts
rename to components/grid/src/grid/services/value-formatter.ts
diff --git a/components/grids/src/grid/types/aggregate.interfaces.ts b/components/grid/src/grid/types/aggregate.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/aggregate.interfaces.ts
rename to components/grid/src/grid/types/aggregate.interfaces.ts
diff --git a/components/grids/src/grid/types/column.interfaces.ts b/components/grid/src/grid/types/column.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/column.interfaces.ts
rename to components/grid/src/grid/types/column.interfaces.ts
diff --git a/components/grids/src/grid/types/edit.interfaces.ts b/components/grid/src/grid/types/edit.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/edit.interfaces.ts
rename to components/grid/src/grid/types/edit.interfaces.ts
diff --git a/components/grids/src/grid/types/enum.ts b/components/grid/src/grid/types/enum.ts
similarity index 100%
rename from components/grids/src/grid/types/enum.ts
rename to components/grid/src/grid/types/enum.ts
diff --git a/components/grids/src/grid/types/filter.interfaces.ts b/components/grid/src/grid/types/filter.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/filter.interfaces.ts
rename to components/grid/src/grid/types/filter.interfaces.ts
diff --git a/components/grids/src/grid/types/focus.interfaces.ts b/components/grid/src/grid/types/focus.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/focus.interfaces.ts
rename to components/grid/src/grid/types/focus.interfaces.ts
diff --git a/components/grids/src/grid/types/grid.interfaces.ts b/components/grid/src/grid/types/grid.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/grid.interfaces.ts
rename to components/grid/src/grid/types/grid.interfaces.ts
diff --git a/components/grids/src/grid/types/index.ts b/components/grid/src/grid/types/index.ts
similarity index 100%
rename from components/grids/src/grid/types/index.ts
rename to components/grid/src/grid/types/index.ts
diff --git a/components/grids/src/grid/types/interfaces.ts b/components/grid/src/grid/types/interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/interfaces.ts
rename to components/grid/src/grid/types/interfaces.ts
diff --git a/components/grids/src/grid/types/page.interfaces.ts b/components/grid/src/grid/types/page.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/page.interfaces.ts
rename to components/grid/src/grid/types/page.interfaces.ts
diff --git a/components/grids/src/grid/types/search.interfaces.ts b/components/grid/src/grid/types/search.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/search.interfaces.ts
rename to components/grid/src/grid/types/search.interfaces.ts
diff --git a/components/grids/src/grid/types/selection.interfaces.ts b/components/grid/src/grid/types/selection.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/selection.interfaces.ts
rename to components/grid/src/grid/types/selection.interfaces.ts
diff --git a/components/grids/src/grid/types/sort.interfaces.ts b/components/grid/src/grid/types/sort.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/sort.interfaces.ts
rename to components/grid/src/grid/types/sort.interfaces.ts
diff --git a/components/grids/src/grid/types/toolbar.interfaces.ts b/components/grid/src/grid/types/toolbar.interfaces.ts
similarity index 100%
rename from components/grids/src/grid/types/toolbar.interfaces.ts
rename to components/grid/src/grid/types/toolbar.interfaces.ts
diff --git a/components/grids/src/grid/utils/index.ts b/components/grid/src/grid/utils/index.ts
similarity index 100%
rename from components/grids/src/grid/utils/index.ts
rename to components/grid/src/grid/utils/index.ts
diff --git a/components/grids/src/grid/utils/utils.ts b/components/grid/src/grid/utils/utils.ts
similarity index 100%
rename from components/grids/src/grid/utils/utils.ts
rename to components/grid/src/grid/utils/utils.ts
diff --git a/components/grids/src/grid/views/Aggregate.tsx b/components/grid/src/grid/views/Aggregate.tsx
similarity index 100%
rename from components/grids/src/grid/views/Aggregate.tsx
rename to components/grid/src/grid/views/Aggregate.tsx
diff --git a/components/grids/src/grid/views/ContentPanel.tsx b/components/grid/src/grid/views/ContentPanel.tsx
similarity index 100%
rename from components/grids/src/grid/views/ContentPanel.tsx
rename to components/grid/src/grid/views/ContentPanel.tsx
diff --git a/components/grids/src/grid/views/ContentRows.tsx b/components/grid/src/grid/views/ContentRows.tsx
similarity index 100%
rename from components/grids/src/grid/views/ContentRows.tsx
rename to components/grid/src/grid/views/ContentRows.tsx
diff --git a/components/grids/src/grid/views/ContentTable.tsx b/components/grid/src/grid/views/ContentTable.tsx
similarity index 100%
rename from components/grids/src/grid/views/ContentTable.tsx
rename to components/grid/src/grid/views/ContentTable.tsx
diff --git a/components/grids/src/grid/views/FilterBar.tsx b/components/grid/src/grid/views/FilterBar.tsx
similarity index 100%
rename from components/grids/src/grid/views/FilterBar.tsx
rename to components/grid/src/grid/views/FilterBar.tsx
diff --git a/components/grids/src/grid/views/FooterPanel.tsx b/components/grid/src/grid/views/FooterPanel.tsx
similarity index 100%
rename from components/grids/src/grid/views/FooterPanel.tsx
rename to components/grid/src/grid/views/FooterPanel.tsx
diff --git a/components/grids/src/grid/views/FooterRows.tsx b/components/grid/src/grid/views/FooterRows.tsx
similarity index 100%
rename from components/grids/src/grid/views/FooterRows.tsx
rename to components/grid/src/grid/views/FooterRows.tsx
diff --git a/components/grids/src/grid/views/FooterTable.tsx b/components/grid/src/grid/views/FooterTable.tsx
similarity index 100%
rename from components/grids/src/grid/views/FooterTable.tsx
rename to components/grid/src/grid/views/FooterTable.tsx
diff --git a/components/grids/src/grid/views/HeaderPanel.tsx b/components/grid/src/grid/views/HeaderPanel.tsx
similarity index 100%
rename from components/grids/src/grid/views/HeaderPanel.tsx
rename to components/grid/src/grid/views/HeaderPanel.tsx
diff --git a/components/grids/src/grid/views/HeaderRows.tsx b/components/grid/src/grid/views/HeaderRows.tsx
similarity index 100%
rename from components/grids/src/grid/views/HeaderRows.tsx
rename to components/grid/src/grid/views/HeaderRows.tsx
diff --git a/components/grids/src/grid/views/HeaderTable.tsx b/components/grid/src/grid/views/HeaderTable.tsx
similarity index 100%
rename from components/grids/src/grid/views/HeaderTable.tsx
rename to components/grid/src/grid/views/HeaderTable.tsx
diff --git a/components/grids/src/grid/views/PagerPanel.tsx b/components/grid/src/grid/views/PagerPanel.tsx
similarity index 100%
rename from components/grids/src/grid/views/PagerPanel.tsx
rename to components/grid/src/grid/views/PagerPanel.tsx
diff --git a/components/grids/src/grid/views/Render.tsx b/components/grid/src/grid/views/Render.tsx
similarity index 100%
rename from components/grids/src/grid/views/Render.tsx
rename to components/grid/src/grid/views/Render.tsx
diff --git a/components/grids/src/grid/views/editing/ConfirmDialog.tsx b/components/grid/src/grid/views/editing/ConfirmDialog.tsx
similarity index 100%
rename from components/grids/src/grid/views/editing/ConfirmDialog.tsx
rename to components/grid/src/grid/views/editing/ConfirmDialog.tsx
diff --git a/components/grids/src/grid/views/editing/EditCell.tsx b/components/grid/src/grid/views/editing/EditCell.tsx
similarity index 100%
rename from components/grids/src/grid/views/editing/EditCell.tsx
rename to components/grid/src/grid/views/editing/EditCell.tsx
diff --git a/components/grids/src/grid/views/editing/InlineEditForm.tsx b/components/grid/src/grid/views/editing/InlineEditForm.tsx
similarity index 100%
rename from components/grids/src/grid/views/editing/InlineEditForm.tsx
rename to components/grid/src/grid/views/editing/InlineEditForm.tsx
diff --git a/components/grids/src/grid/views/editing/ToolBar.tsx b/components/grid/src/grid/views/editing/ToolBar.tsx
similarity index 100%
rename from components/grids/src/grid/views/editing/ToolBar.tsx
rename to components/grid/src/grid/views/editing/ToolBar.tsx
diff --git a/components/grids/src/grid/views/editing/ValidationTooltips.tsx b/components/grid/src/grid/views/editing/ValidationTooltips.tsx
similarity index 100%
rename from components/grids/src/grid/views/editing/ValidationTooltips.tsx
rename to components/grid/src/grid/views/editing/ValidationTooltips.tsx
diff --git a/components/grids/src/grid/views/index.ts b/components/grid/src/grid/views/index.ts
similarity index 100%
rename from components/grids/src/grid/views/index.ts
rename to components/grid/src/grid/views/index.ts
diff --git a/components/grids/src/index.ts b/components/grid/src/index.ts
similarity index 100%
rename from components/grids/src/index.ts
rename to components/grid/src/index.ts
diff --git a/components/grids/styles/grid/_all.scss b/components/grid/styles/grid/_all.scss
similarity index 100%
rename from components/grids/styles/grid/_all.scss
rename to components/grid/styles/grid/_all.scss
diff --git a/components/grids/styles/grid/_layout.scss b/components/grid/styles/grid/_layout.scss
similarity index 100%
rename from components/grids/styles/grid/_layout.scss
rename to components/grid/styles/grid/_layout.scss
diff --git a/components/grids/styles/grid/_material3-definition.scss b/components/grid/styles/grid/_material3-definition.scss
similarity index 100%
rename from components/grids/styles/grid/_material3-definition.scss
rename to components/grid/styles/grid/_material3-definition.scss
diff --git a/components/grids/styles/grid/_theme.scss b/components/grid/styles/grid/_theme.scss
similarity index 100%
rename from components/grids/styles/grid/_theme.scss
rename to components/grid/styles/grid/_theme.scss
diff --git a/components/grid/styles/grid/material3.scss b/components/grid/styles/grid/material3.scss
new file mode 100644
index 0000000..0835abe
--- /dev/null
+++ b/components/grid/styles/grid/material3.scss
@@ -0,0 +1,15 @@
+@import 'react-base/styles/themes/material3.scss';
+@import 'react-inputs/styles/input/material3-definition.scss';
+@import 'react-inputs/styles/numerictextbox/material3-definition.scss';
+@import 'react-buttons/styles/button/material3-definition.scss';
+@import 'react-buttons/styles/radio-button/material3-definition.scss';
+@import 'react-buttons/styles/check-box/material3-definition.scss';
+@import 'react-dropdowns/styles/drop-down-list/material3-definition.scss';
+@import 'react-popups/styles/spinner/material3-definition.scss';
+@import 'react-popups/styles/tooltip/material3-definition.scss';
+@import 'react-navigations/styles/toolbar/material3-definition.scss';
+@import 'react-navigations/styles/context-menu/material3-definition.scss';
+@import 'react-notifications/styles/skeleton/material3-definition.scss';
+@import 'react-pager/styles/pager/material3-definition.scss';
+@import 'material3-definition.scss';
+@import 'all.scss';
diff --git a/components/grid/styles/material3.scss b/components/grid/styles/material3.scss
new file mode 100644
index 0000000..6e0685b
--- /dev/null
+++ b/components/grid/styles/material3.scss
@@ -0,0 +1 @@
+@import 'grid/material3.scss';
\ No newline at end of file
diff --git a/components/grids/tsconfig.json b/components/grid/tsconfig.json
similarity index 100%
rename from components/grids/tsconfig.json
rename to components/grid/tsconfig.json
diff --git a/components/grids/styles/grid/material3.scss b/components/grids/styles/grid/material3.scss
deleted file mode 100644
index 5e1a144..0000000
--- a/components/grids/styles/grid/material3.scss
+++ /dev/null
@@ -1,15 +0,0 @@
-@import '../../base/themes/material3.scss';
-@import '../../inputs/input/material3-definition.scss';
-@import '../../inputs/numerictextbox/material3-definition.scss';
-@import '../../buttons/button/material3-definition.scss';
-@import '../../buttons/radio-button/material3-definition.scss';
-@import '../../buttons/check-box/material3-definition.scss';
-@import '../../dropdowns/drop-down-list/material3-definition.scss';
-@import '../../popups/spinner/material3-definition.scss';
-@import '../../popups/tooltip/material3-definition.scss';
-@import '../../navigations/toolbar/material3-definition.scss';
-@import '../../navigations/context-menu/material3-definition.scss';
-@import '../../notifications/skeleton/material3-definition.scss';
-@import '../../pager/pager/material3-definition.scss';
-@import 'material3-definition.scss';
-@import 'all.scss';
diff --git a/components/grids/styles/material3.scss b/components/grids/styles/material3.scss
deleted file mode 100644
index a7d84b9..0000000
--- a/components/grids/styles/material3.scss
+++ /dev/null
@@ -1,15 +0,0 @@
-@import '../base/themes/material3.scss';
-@import '../inputs/input/material3-definition.scss';
-@import '../inputs/numerictextbox/material3-definition.scss';
-@import '../buttons/button/material3-definition.scss';
-@import '../buttons/radio-button/material3-definition.scss';
-@import '../buttons/check-box/material3-definition.scss';
-@import '../dropdowns/drop-down-list/material3-definition.scss';
-@import '../popups/spinner/material3-definition.scss';
-@import '../popups/tooltip/material3-definition.scss';
-@import '../navigations/toolbar/material3-definition.scss';
-@import '../navigations/context-menu/material3-definition.scss';
-@import '../notifications/skeleton/material3-definition.scss';
-@import '../pager/pager/material3-definition.scss';
-@import 'grid/material3-definition.scss';
-@import 'grid/all.scss';
diff --git a/components/inputs/gulpfile.js b/components/inputs/gulpfile.js
index b1bf280..a451969 100644
--- a/components/inputs/gulpfile.js
+++ b/components/inputs/gulpfile.js
@@ -1,5 +1,7 @@
var gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
+const glob = require('glob');
+const fs = (global.fs = global.fs || require("fs"));
/**
* Compile ts files
@@ -45,8 +47,22 @@ gulp.task('styles', function (done) {
});
});
+/**
+* Remove css variables for CSS files
+*/
+gulp.task('remove-css', function (done) {
+ var getCss = glob.sync('./styles/**/*.css');
+ for (var i = 0; i < getCss.length; i++) {
+ var cssContent = fs.readFileSync(getCss[i], 'utf8');
+ cssContent = cssContent.replace(/(:root\s*{[^}]*})|(\:root, .sf-light-mode\s*{[^}]*})|(\.sf-dark-mode\s*{[^}]*})/g, '');
+ cssContent = cssContent.replace(/^\s*[\r\n]/gm, '');
+ fs.writeFileSync(getCss[i], cssContent, 'utf8');
+ }
+ done();
+});
+
/**
* Build ts and scss files
*/
-gulp.task('build', gulp.series('scripts', 'styles'));
+gulp.task('build', gulp.series('scripts', 'styles', 'remove-css'));
diff --git a/components/inputs/styles/input/material3.scss b/components/inputs/styles/input/material3.scss
index 84409d0..bb8b567 100644
--- a/components/inputs/styles/input/material3.scss
+++ b/components/inputs/styles/input/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/inputs/styles/material3.scss b/components/inputs/styles/material3.scss
index e63cab5..3e7d4f1 100644
--- a/components/inputs/styles/material3.scss
+++ b/components/inputs/styles/material3.scss
@@ -1,9 +1,4 @@
-@import '../base/themes/material3.scss';
-@import 'input/material3-definition.scss';
-@import 'input/all.scss';
-@import 'numerictextbox/material3-definition.scss';
-@import 'numerictextbox/all.scss';
-@import 'textbox/material3-definition.scss';
-@import 'textbox/all.scss';
-@import 'textarea/material3-definition.scss';
-@import 'textarea/all.scss';
+@import 'input/material3.scss';
+@import 'numerictextbox/material3.scss';
+@import 'textbox/material3.scss';
+@import 'textarea/material3.scss';
diff --git a/components/inputs/styles/numerictextbox/material3.scss b/components/inputs/styles/numerictextbox/material3.scss
index a762609..789b95e 100644
--- a/components/inputs/styles/numerictextbox/material3.scss
+++ b/components/inputs/styles/numerictextbox/material3.scss
@@ -1,4 +1,4 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import '../input/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/inputs/styles/textarea/material3.scss b/components/inputs/styles/textarea/material3.scss
index 015a163..56a65e0 100644
--- a/components/inputs/styles/textarea/material3.scss
+++ b/components/inputs/styles/textarea/material3.scss
@@ -1,4 +1,4 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import '../input/material3-definition.scss';
@import '../textbox/material3-definition.scss';
@import 'material3-definition.scss';
diff --git a/components/inputs/styles/textbox/material3.scss b/components/inputs/styles/textbox/material3.scss
index a762609..789b95e 100644
--- a/components/inputs/styles/textbox/material3.scss
+++ b/components/inputs/styles/textbox/material3.scss
@@ -1,4 +1,4 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import '../input/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/lists/gulpfile.js b/components/lists/gulpfile.js
index b1bf280..a451969 100644
--- a/components/lists/gulpfile.js
+++ b/components/lists/gulpfile.js
@@ -1,5 +1,7 @@
var gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
+const glob = require('glob');
+const fs = (global.fs = global.fs || require("fs"));
/**
* Compile ts files
@@ -45,8 +47,22 @@ gulp.task('styles', function (done) {
});
});
+/**
+* Remove css variables for CSS files
+*/
+gulp.task('remove-css', function (done) {
+ var getCss = glob.sync('./styles/**/*.css');
+ for (var i = 0; i < getCss.length; i++) {
+ var cssContent = fs.readFileSync(getCss[i], 'utf8');
+ cssContent = cssContent.replace(/(:root\s*{[^}]*})|(\:root, .sf-light-mode\s*{[^}]*})|(\.sf-dark-mode\s*{[^}]*})/g, '');
+ cssContent = cssContent.replace(/^\s*[\r\n]/gm, '');
+ fs.writeFileSync(getCss[i], cssContent, 'utf8');
+ }
+ done();
+});
+
/**
* Build ts and scss files
*/
-gulp.task('build', gulp.series('scripts', 'styles'));
+gulp.task('build', gulp.series('scripts', 'styles', 'remove-css'));
diff --git a/components/lists/styles/list-base/material3.scss b/components/lists/styles/list-base/material3.scss
index 84409d0..bb8b567 100644
--- a/components/lists/styles/list-base/material3.scss
+++ b/components/lists/styles/list-base/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/lists/styles/list-view/material3.scss b/components/lists/styles/list-view/material3.scss
index ad10d49..216a8af 100644
--- a/components/lists/styles/list-view/material3.scss
+++ b/components/lists/styles/list-view/material3.scss
@@ -1,4 +1,4 @@
-@import '../../base/themes/material3.scss';
-@import '../../buttons/check-box/material3-definition.scss';
+@import 'react-base/styles/themes/material3.scss';
+@import 'react-buttons/styles/check-box/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/lists/styles/material3.scss b/components/lists/styles/material3.scss
index ba72874..8280002 100644
--- a/components/lists/styles/material3.scss
+++ b/components/lists/styles/material3.scss
@@ -1,6 +1,2 @@
-@import '../base/themes/material3.scss';
-@import '../buttons/check-box/material3-definition.scss';
-@import 'list-view/material3-definition.scss';
-@import 'list-view/all.scss';
-@import 'list-base/material3-definition.scss';
-@import 'list-base/all.scss';
+@import 'list-view/material3.scss';
+@import 'list-base/material3.scss';
diff --git a/components/navigations/gulpfile.js b/components/navigations/gulpfile.js
index b1bf280..a451969 100644
--- a/components/navigations/gulpfile.js
+++ b/components/navigations/gulpfile.js
@@ -1,5 +1,7 @@
var gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
+const glob = require('glob');
+const fs = (global.fs = global.fs || require("fs"));
/**
* Compile ts files
@@ -45,8 +47,22 @@ gulp.task('styles', function (done) {
});
});
+/**
+* Remove css variables for CSS files
+*/
+gulp.task('remove-css', function (done) {
+ var getCss = glob.sync('./styles/**/*.css');
+ for (var i = 0; i < getCss.length; i++) {
+ var cssContent = fs.readFileSync(getCss[i], 'utf8');
+ cssContent = cssContent.replace(/(:root\s*{[^}]*})|(\:root, .sf-light-mode\s*{[^}]*})|(\.sf-dark-mode\s*{[^}]*})/g, '');
+ cssContent = cssContent.replace(/^\s*[\r\n]/gm, '');
+ fs.writeFileSync(getCss[i], cssContent, 'utf8');
+ }
+ done();
+});
+
/**
* Build ts and scss files
*/
-gulp.task('build', gulp.series('scripts', 'styles'));
+gulp.task('build', gulp.series('scripts', 'styles', 'remove-css'));
diff --git a/components/navigations/styles/context-menu/material3.scss b/components/navigations/styles/context-menu/material3.scss
index 84409d0..bb8b567 100644
--- a/components/navigations/styles/context-menu/material3.scss
+++ b/components/navigations/styles/context-menu/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/navigations/styles/h-scroll/material3.scss b/components/navigations/styles/h-scroll/material3.scss
index 84409d0..bb8b567 100644
--- a/components/navigations/styles/h-scroll/material3.scss
+++ b/components/navigations/styles/h-scroll/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/navigations/styles/material3.scss b/components/navigations/styles/material3.scss
index 84db3fa..7c20c46 100644
--- a/components/navigations/styles/material3.scss
+++ b/components/navigations/styles/material3.scss
@@ -1,10 +1,4 @@
-@import '../base/themes/material3.scss';
-@import '../buttons/button/material3-definition.scss';
-@import 'context-menu/material3-definition.scss';
-@import 'context-menu/all.scss';
-@import 'h-scroll/material3-definition.scss';
-@import 'h-scroll/all.scss';
-@import 'toolbar/material3-definition.scss';
-@import 'toolbar/all.scss';
-@import 'v-scroll/material3-definition.scss';
-@import 'v-scroll/all.scss';
+@import 'context-menu/material3.scss';
+@import 'h-scroll/material3.scss';
+@import 'toolbar/material3.scss';
+@import 'v-scroll/material3.scss';
diff --git a/components/navigations/styles/toolbar/material3.scss b/components/navigations/styles/toolbar/material3.scss
index 4388f2e..6fa20ef 100644
--- a/components/navigations/styles/toolbar/material3.scss
+++ b/components/navigations/styles/toolbar/material3.scss
@@ -1,6 +1,6 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import '../v-scroll/material3-definition.scss';
@import '../h-scroll/material3-definition.scss';
-@import '../../buttons/button/material3-definition.scss';
+@import 'react-buttons/styles/button/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/navigations/styles/v-scroll/material3.scss b/components/navigations/styles/v-scroll/material3.scss
index 84409d0..bb8b567 100644
--- a/components/navigations/styles/v-scroll/material3.scss
+++ b/components/navigations/styles/v-scroll/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/notifications/gulpfile.js b/components/notifications/gulpfile.js
index b1bf280..a451969 100644
--- a/components/notifications/gulpfile.js
+++ b/components/notifications/gulpfile.js
@@ -1,5 +1,7 @@
var gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
+const glob = require('glob');
+const fs = (global.fs = global.fs || require("fs"));
/**
* Compile ts files
@@ -45,8 +47,22 @@ gulp.task('styles', function (done) {
});
});
+/**
+* Remove css variables for CSS files
+*/
+gulp.task('remove-css', function (done) {
+ var getCss = glob.sync('./styles/**/*.css');
+ for (var i = 0; i < getCss.length; i++) {
+ var cssContent = fs.readFileSync(getCss[i], 'utf8');
+ cssContent = cssContent.replace(/(:root\s*{[^}]*})|(\:root, .sf-light-mode\s*{[^}]*})|(\.sf-dark-mode\s*{[^}]*})/g, '');
+ cssContent = cssContent.replace(/^\s*[\r\n]/gm, '');
+ fs.writeFileSync(getCss[i], cssContent, 'utf8');
+ }
+ done();
+});
+
/**
* Build ts and scss files
*/
-gulp.task('build', gulp.series('scripts', 'styles'));
+gulp.task('build', gulp.series('scripts', 'styles', 'remove-css'));
diff --git a/components/notifications/styles/material3.scss b/components/notifications/styles/material3.scss
index 8054494..e87c0b0 100644
--- a/components/notifications/styles/material3.scss
+++ b/components/notifications/styles/material3.scss
@@ -1,8 +1,3 @@
-@import '../base/themes/material3.scss';
-@import '../buttons/button/material3-definition.scss';
-@import 'toast/material3-definition.scss';
-@import 'toast/all.scss';
-@import 'message/material3-definition.scss';
-@import 'message/all.scss';
-@import 'skeleton/material3-definition.scss';
-@import 'skeleton/all.scss';
+@import 'toast/material3.scss';
+@import 'message/material3.scss';
+@import 'skeleton/material3.scss';
diff --git a/components/notifications/styles/message/material3.scss b/components/notifications/styles/message/material3.scss
index 84409d0..bb8b567 100644
--- a/components/notifications/styles/message/material3.scss
+++ b/components/notifications/styles/message/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/notifications/styles/skeleton/material3.scss b/components/notifications/styles/skeleton/material3.scss
index 84409d0..bb8b567 100644
--- a/components/notifications/styles/skeleton/material3.scss
+++ b/components/notifications/styles/skeleton/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/notifications/styles/toast/material3.scss b/components/notifications/styles/toast/material3.scss
index ddbe045..74ac8f8 100644
--- a/components/notifications/styles/toast/material3.scss
+++ b/components/notifications/styles/toast/material3.scss
@@ -1,4 +1,4 @@
-@import '../../base/themes/material3.scss';
-@import '../../buttons/button/material3-definition.scss';
+@import 'react-base/styles/themes/material3.scss';
+@import 'react-buttons/styles/button/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/pager/gulpfile.js b/components/pager/gulpfile.js
index b1bf280..a451969 100644
--- a/components/pager/gulpfile.js
+++ b/components/pager/gulpfile.js
@@ -1,5 +1,7 @@
var gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
+const glob = require('glob');
+const fs = (global.fs = global.fs || require("fs"));
/**
* Compile ts files
@@ -45,8 +47,22 @@ gulp.task('styles', function (done) {
});
});
+/**
+* Remove css variables for CSS files
+*/
+gulp.task('remove-css', function (done) {
+ var getCss = glob.sync('./styles/**/*.css');
+ for (var i = 0; i < getCss.length; i++) {
+ var cssContent = fs.readFileSync(getCss[i], 'utf8');
+ cssContent = cssContent.replace(/(:root\s*{[^}]*})|(\:root, .sf-light-mode\s*{[^}]*})|(\.sf-dark-mode\s*{[^}]*})/g, '');
+ cssContent = cssContent.replace(/^\s*[\r\n]/gm, '');
+ fs.writeFileSync(getCss[i], cssContent, 'utf8');
+ }
+ done();
+});
+
/**
* Build ts and scss files
*/
-gulp.task('build', gulp.series('scripts', 'styles'));
+gulp.task('build', gulp.series('scripts', 'styles', 'remove-css'));
diff --git a/components/pager/styles/material3.scss b/components/pager/styles/material3.scss
index d981c73..c1cd1c1 100644
--- a/components/pager/styles/material3.scss
+++ b/components/pager/styles/material3.scss
@@ -1,3 +1 @@
-@import '../base/themes/material3.scss';
-@import 'pager/material3-definition.scss';
-@import 'pager/all.scss';
+@import 'pager/material3.scss';
diff --git a/components/pager/styles/pager/material3.scss b/components/pager/styles/pager/material3.scss
index 84409d0..bb8b567 100644
--- a/components/pager/styles/pager/material3.scss
+++ b/components/pager/styles/pager/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/popups/styles/dialog/material3.scss b/components/popups/styles/dialog/material3.scss
index ddbe045..74ac8f8 100644
--- a/components/popups/styles/dialog/material3.scss
+++ b/components/popups/styles/dialog/material3.scss
@@ -1,4 +1,4 @@
-@import '../../base/themes/material3.scss';
-@import '../../buttons/button/material3-definition.scss';
+@import 'react-base/styles/themes/material3.scss';
+@import 'react-buttons/styles/button/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/popups/styles/material3.scss b/components/popups/styles/material3.scss
index 2dae3f5..edb943f 100644
--- a/components/popups/styles/material3.scss
+++ b/components/popups/styles/material3.scss
@@ -1,10 +1,4 @@
-@import '../base/themes/material3.scss';
-@import '../buttons/button/material3-definition.scss';
-@import 'popup/material3-definition.scss';
-@import 'popup/all.scss';
-@import 'tooltip/material3-definition.scss';
-@import 'tooltip/all.scss';
-@import 'spinner/material3-definition.scss';
-@import 'spinner/all.scss';
-@import 'dialog/material3-definition.scss';
-@import 'dialog/all.scss';
+@import 'popup/material3.scss';
+@import 'tooltip/material3.scss';
+@import 'spinner/material3.scss';
+@import 'dialog/material3.scss';
diff --git a/components/popups/styles/popup/material3.scss b/components/popups/styles/popup/material3.scss
index 84409d0..bb8b567 100644
--- a/components/popups/styles/popup/material3.scss
+++ b/components/popups/styles/popup/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/popups/styles/spinner/material3.scss b/components/popups/styles/spinner/material3.scss
index 84409d0..bb8b567 100644
--- a/components/popups/styles/spinner/material3.scss
+++ b/components/popups/styles/spinner/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/popups/styles/tooltip/material3.scss b/components/popups/styles/tooltip/material3.scss
index 84409d0..bb8b567 100644
--- a/components/popups/styles/tooltip/material3.scss
+++ b/components/popups/styles/tooltip/material3.scss
@@ -1,3 +1,3 @@
-@import '../../base/themes/material3.scss';
+@import 'react-base/styles/themes/material3.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/splitbuttons/gulpfile.js b/components/splitbuttons/gulpfile.js
index b1bf280..a451969 100644
--- a/components/splitbuttons/gulpfile.js
+++ b/components/splitbuttons/gulpfile.js
@@ -1,5 +1,7 @@
var gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
+const glob = require('glob');
+const fs = (global.fs = global.fs || require("fs"));
/**
* Compile ts files
@@ -45,8 +47,22 @@ gulp.task('styles', function (done) {
});
});
+/**
+* Remove css variables for CSS files
+*/
+gulp.task('remove-css', function (done) {
+ var getCss = glob.sync('./styles/**/*.css');
+ for (var i = 0; i < getCss.length; i++) {
+ var cssContent = fs.readFileSync(getCss[i], 'utf8');
+ cssContent = cssContent.replace(/(:root\s*{[^}]*})|(\:root, .sf-light-mode\s*{[^}]*})|(\.sf-dark-mode\s*{[^}]*})/g, '');
+ cssContent = cssContent.replace(/^\s*[\r\n]/gm, '');
+ fs.writeFileSync(getCss[i], cssContent, 'utf8');
+ }
+ done();
+});
+
/**
* Build ts and scss files
*/
-gulp.task('build', gulp.series('scripts', 'styles'));
+gulp.task('build', gulp.series('scripts', 'styles', 'remove-css'));
diff --git a/components/splitbuttons/styles/drop-down-button/material3.scss b/components/splitbuttons/styles/drop-down-button/material3.scss
index ddbe045..74ac8f8 100644
--- a/components/splitbuttons/styles/drop-down-button/material3.scss
+++ b/components/splitbuttons/styles/drop-down-button/material3.scss
@@ -1,4 +1,4 @@
-@import '../../base/themes/material3.scss';
-@import '../../buttons/button/material3-definition.scss';
+@import 'react-base/styles/themes/material3.scss';
+@import 'react-buttons/styles/button/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
diff --git a/components/splitbuttons/styles/material3.scss b/components/splitbuttons/styles/material3.scss
index b7e520e..5758fa6 100644
--- a/components/splitbuttons/styles/material3.scss
+++ b/components/splitbuttons/styles/material3.scss
@@ -1,6 +1,2 @@
-@import '../base/themes/material3.scss';
-@import '../buttons/button/material3-definition.scss';
-@import 'drop-down-button/material3-definition.scss';
-@import 'drop-down-button/all.scss';
-@import 'split-button/material3-definition.scss';
-@import 'split-button/all.scss';
+@import 'drop-down-button/material3.scss';
+@import 'split-button/material3.scss';
diff --git a/components/splitbuttons/styles/split-button/material3.scss b/components/splitbuttons/styles/split-button/material3.scss
index 485f827..e843936 100644
--- a/components/splitbuttons/styles/split-button/material3.scss
+++ b/components/splitbuttons/styles/split-button/material3.scss
@@ -1,5 +1,5 @@
-@import '../../base/themes/material3.scss';
-@import '../../buttons/button/material3-definition.scss';
+@import 'react-base/styles/themes/material3.scss';
+@import 'react-buttons/styles/button/material3-definition.scss';
@import '../drop-down-button/material3-definition.scss';
@import 'material3-definition.scss';
@import 'all.scss';
|