chore: refactor scripts

.github/disabled-workflows/ci_next.yml

@@ -45,10 +45,10 @@ jobs:
         run: npm ci --no-audit --no-fund
 
       - name: Lint scripts
-        run: npm run eslint
+        run: npm run lint:scripts
 
       - name: Lint styles
-        run: npm run stylelint
+        run: npm run lint:styles
 
       - name: Build docs
         run: npm run docs

.github/workflows/_lint-scripts.yml

@@ -38,8 +38,8 @@ jobs:
 
       - name: Lint scripts
         run: |
-          npm run eslint
+          npm run lint:scripts
 
       - name: Check types
         run: |
-          npm run check-types
+          npm run typecheck -w packages/html

.github/workflows/_lint-styles.yml

@@ -42,5 +42,5 @@ jobs:
 
       - name: Lint styles
         run: |
-          npm run stylelint
+          npm run lint:styles
 

.github/workflows/_render-test-pages.yml

@@ -114,7 +114,7 @@ jobs:
         env:
           HEADLESS: 'true'
         run: |
-          npm run render-test-pages
+          npm run test:render-test-pages
 
       - name: Pack test pages
         env:

.github/workflows/_test-contrast.yml

@@ -73,7 +73,7 @@ jobs:
         run: find .tmp -name "*.tar" -type f -exec tar -xf {} \;
 
       - name: Test contrast (${{ matrix.chunk }} of ${{ matrix.max-chunks }})
-        run: xvfb-run --auto-servernum --server-args="-screen 0, 1366x768x24" npm run test-contrast
+        run: xvfb-run --auto-servernum --server-args="-screen 0, 1366x768x24" npm run test:contrast
         env:
           MAX_CHUNKS: ${{ inputs.max-chunks }}
           CURRENT_CHUNK: ${{ matrix.chunk }}

.github/workflows/ci_weekly.yml

@@ -42,23 +42,23 @@ jobs:
 
       - name: Lint scripts
         run: |
-          npm run eslint
+          npm run lint:scripts
 
       - name: Check types
         run: |
-          npm run check-types
+          npm run typecheck -w packages/html
 
       - name: Build scripts
         run: |
-          npm run build:scripts
+          npm run build
 
       - name: Build test pages
         run: |
           npm run build:tests
 
       - name: Lint styles
         run: |
-          npm run stylelint
+          npm run lint:styles
 
       - name: Build themes for dist
         run: |

.husky/pre-commit

@@ -1 +1 @@
-npm run lint-staged
+npm run lint:staged

README.md

@@ -59,28 +59,10 @@ To guard against regressions and make pull request reviews easier, the CI build
 To generate screenshots for a specific theme:
 
 1. Build the theme with `npm run sass`
-1. Run `npm run create-screenshots <theme>`, substituting `<theme>` with a theme name.
+1. Run `npm run test:create-screenshots <theme>`, substituting `<theme>` with a theme name.
 
 These steps will create new screenshots in `tests/_output`. Note that due to platform differences, all of the files will be marked as changed.
 
-### Embedding Resources
-
-To avoid hosting-related issues in projects that use the themes, the resources are embedded by encoding them in the output CSS. For more details, refer to [this issue](https://github.com/telerik/kendo-theme-default/issues/41#issuecomment-258472183).
-
-To embed the latest resources:
-
-1. Run the `npm run embed-assets` task. The task generates a file with the same name which registers a Base64-encoded version in the `$data-uris` SCSS map. For example, the `foo.woff` font file will be encoded in a `foo.scss` file which can later be imported through `@import './font/foo';`.
-1. Inline the encoded file inside the CSS through `map-get( $data-uris, 'foo.woff' )`. For example:
-
-```scss
-$web-font-uri: map-get( $data-uris, 'WebComponentsIcons.woff' );
-
-@font-face {
-    font-family: 'WebComponentsIcons';
-    src: url( $web-font-uri ) format( "woff" );
-}
-```
-
 ### Documenting Variables
 
 The available variables for customizing each theme are listed in the article on customization for each theme (`docs/customization.md`) The file is generated from the SCSS source files by running the `npm run docs` command.

package.json

@@ -51,25 +51,23 @@
   "scripts": {
     "prepare": "husky",
     "start": "node ./scripts/start-dev-server.js",
-    "clean": "find . -name \"node_modules\" -type d -prune | xargs rm -rf",
+    "lint": "npm run lint:scripts && npm run lint:styles",
+    "lint:scripts": "eslint \"**/*.{js,jsx,ts,tsx,mjs}\"",
+    "lint:styles": "stylelint \"**/*.scss\"",
+    "lint:staged": "lint-staged --verbose",
+    "build": "nx run @progress/kendo-themes-html:build",
+    "build:tests": "nx run @progress/kendo-themes-html:build:tests",
+    "sass": "nx run-many -t sass",
+    "sass:dist": "nx run-many -t sass:dist",
+    "docs": "nx run-many -t docs",
+    "docs:check": "npm run docs -- git diff --exit-code -- docs/",
+    "test:render-test-pages": "node ./scripts/render-test-pages.mjs",
+    "test:contrast": "node ./scripts/test-contrast.mjs",
+    "test:create-screenshots": "./build/create-screenshots.sh",
+    "test:integrations": "npm run build --prefix integrations",
+    "clean": "nx reset && find . -name \"node_modules\" -type d -prune | xargs rm -rf",
     "clean:dist": "find ./packages -name \"dist\" -type d -prune -maxdepth 2 | xargs rm -rf",
-    "clean:tests": "node ./scripts/cleanup-test-results.js",
-    "sass": "npm run sass -ws --if-present",
-    "sass:dist": "npm run sass:dist -ws --if-present",
-    "build": "npm run sass && npm run build:scripts",
-    "build:scripts": "npm run build --prefix packages/html",
-    "build:tests": "npm run build:tests --prefix packages/html",
-    "eslint": "eslint",
-    "check-types": "npm run check-types --prefix packages/html",
-    "stylelint": "stylelint \"**/*.scss\"",
-    "lint": "npm run eslint && npm run stylelint",
-    "lint-staged": "lint-staged --verbose",
-    "docs": "npm run docs -ws --if-present",
-    "docs:check": "npm run docs -ws --if-present -- git diff --exit-code --quiet -- docs/",
-    "render-test-pages": "node ./scripts/render-test-pages.mjs",
-    "create-screenshots": "./build/create-screenshots.sh",
-    "test-contrast": "node ./scripts/test-contrast.mjs",
-    "test:integrations": "npm run build --prefix integrations"
+    "clean:tests": "node ./scripts/cleanup-test-results.js"
   },
   "engines": {
     "node": "^20"

packages/html/package.json

@@ -40,9 +40,9 @@
   "scripts": {
     "start": "node ./scripts/start",
     "build": "node ./scripts/build.js && npm run typegen",
-    "typegen": "tsc --emitDeclarationOnly --declaration --declarationDir dist/types/",
+    "typegen": "npx tsc --emitDeclarationOnly --declaration --declarationDir dist/types/",
+    "typecheck": "npx tsc --noEmit --emitDeclarationOnly false --project tsconfig.json ",
     "build:tests": "node ./scripts/build-tests.js",
-    "check-types": "npx tsc --noEmit --emitDeclarationOnly false --project tsconfig.json ",
     "prepublishOnly": "npm run build"
   },
   "dependencies": {

tests/README.md

@@ -18,7 +18,7 @@ The output pages contain static HTML that represents:
 To generate screenshots for a specific theme:
 
 1. Build the theme with `npm run sass`.
-1. Run `npm run create-screenshots <theme>`, substituting `<theme>` with a theme name.
+1. Run `npm run test:create-screenshots <theme>`, substituting `<theme>` with a theme name.
 
 These steps will create new screenshots in `tests/_output`. Note that due to platform differences, all of the files will be marked as changed.