Updated package to support the latest version of Ignite UI Web components

* Streamlined build process and removed deprecated dependencies
* Fixed issues around deprecated API usage for dependent packages
* Added a shim for the now internal `@themes` decorator from the Ignite UI package
* Aligned component registration and dynamic theme changes API
* Refactored the test suite

Author: rkaraivanov

.browserslistrc

@@ -18,7 +18,7 @@ on:
     # The branches below must be a subset of the branches above
     branches: [master]
   schedule:
-    - cron: '33 4 * * 4'
+    - cron: '24 4 * * 0'
 
 jobs:
   analyze:
@@ -39,11 +39,11 @@ jobs:
 
     steps:
       - name: Checkout repository
-        uses: actions/checkout@v2
+        uses: actions/checkout@v4
 
       # Initializes the CodeQL tools for scanning.
       - name: Initialize CodeQL
-        uses: github/codeql-action/init@v2
+        uses: github/codeql-action/init@v3
         with:
           languages: ${{ matrix.language }}
           # If you wish to specify custom queries, you can do so here or in a config file.
@@ -54,7 +54,7 @@ jobs:
       # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
       # If this step fails, then you should remove it and run the build manually (see below)
       - name: Autobuild
-        uses: github/codeql-action/autobuild@v2
+        uses: github/codeql-action/autobuild@v3
 
       # ℹ️ Command-line programs to run using the OS shell.
       # 📚 https://git.io/JvXDl
@@ -68,4 +68,4 @@ jobs:
       #   make release
 
       - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@v2
+        uses: github/codeql-action/analyze@v3

.eslintignore

@@ -15,22 +15,24 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [16.x, 18.x]
+        node-version: [20.x, 22.x]
         # See supported Node.js release schedule at https://nodejs.org/en/about/releases/
 
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
+          cache: 'npm'
       - run: npm ci
+      - run: npx playwright install --with-deps --only-shell chromium
       - run: npm run lint
       - run: npm run build
       - run: npm run test
       - name: Publish to coveralls.io
-        if: matrix.node-version == '16.x'
-        uses: coverallsapp/github-action@v1.1.2
+        if: matrix.node-version == '20.x'
+        uses: coverallsapp/github-action@v2
         with:
           github-token: ${{ github.token }}
-          path-to-lcov: ./dist/test/coverage/lcov.info
+          path-to-lcov: ./coverage/lcov.info

.eslintrc.json

@@ -11,10 +11,11 @@ jobs:
   publish-npm:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
         with:
-          node-version: 16
+          node-version: '20'
+          cache: 'npm'
           registry-url: https://registry.npmjs.org/
       - run: npm ci
       - run: npm run build

.github/workflows/codeql-analysis.yml

@@ -20,7 +20,6 @@ __snapshots__
 screenshots/.current
 screenshots/.diff
 
-
 ## build
 _site
 dist
@@ -30,3 +29,6 @@ build
 *.tgz
 *.tsbuildinfo
 storybook-static
+
+custom-elements.json
+*.css.ts

.github/workflows/node.js.yml

@@ -1,4 +1 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
-
 npx lint-staged

.github/workflows/npm-publish.yml

@@ -1,31 +1,25 @@
 {
-  "extends": "stylelint-config-standard-scss",
-  "plugins": ["stylelint-scss"],
+  "extends": ["stylelint-config-standard-scss"],
+  "plugins": ["stylelint-scss", "stylelint-prettier"],
   "rules": {
     "at-rule-disallowed-list": [
       "debug",
       {
         "severity": "warning"
       }
     ],
-    "block-closing-brace-empty-line-before": "never",
-    "block-closing-brace-newline-after": "always-single-line",
     "block-no-empty": true,
-    "color-hex-case": "lower",
     "color-hex-length": "short",
     "color-no-invalid-hex": true,
     "comment-no-empty": true,
     "custom-property-pattern": "(?:igc-)?.+",
     "declaration-block-no-duplicate-properties": true,
     "declaration-block-no-shorthand-property-overrides": true,
     "declaration-block-single-line-max-declarations": 1,
-    "declaration-colon-space-after": "always-single-line",
     "font-family-no-duplicate-names": true,
     "font-family-no-missing-generic-family-keyword": true,
     "font-weight-notation": "numeric",
     "function-calc-no-unspaced-operator": true,
-    "function-comma-space-after": "always-single-line",
-    "indentation": 4,
     "length-zero-no-unit": true,
     "max-nesting-depth": [
       3,
@@ -36,11 +30,7 @@
     "no-descending-specificity": null,
     "no-duplicate-at-import-rules": true,
     "no-duplicate-selectors": true,
-    "no-extra-semicolons": true,
     "no-invalid-double-slash-comments": true,
-    "no-missing-end-of-source-newline": true,
-    "number-leading-zero": "never",
-    "number-no-trailing-zeros": true,
     "property-no-unknown": true,
     "rule-empty-line-before": [
       "always-multi-line",
@@ -50,16 +40,7 @@
       }
     ],
     "selector-attribute-quotes": "always",
-    "selector-attribute-operator-space-after": "never",
-    "selector-attribute-operator-space-before": "never",
-    "selector-combinator-space-after": "always",
-    "selector-combinator-space-before": "always",
-    "selector-descendant-combinator-no-non-space": true,
-    "selector-list-comma-newline-after": "always",
-    "selector-pseudo-class-case": "lower",
     "selector-pseudo-class-no-unknown": true,
-    "selector-pseudo-class-parentheses-space-inside": "never",
-    "selector-pseudo-element-case": "lower",
     "selector-pseudo-element-colon-notation": "double",
     "selector-pseudo-element-no-unknown": true,
     "selector-type-case": "lower",
@@ -70,10 +51,7 @@
       }
     ],
     "shorthand-property-no-redundant-values": true,
-    "string-quotes": "single",
-    "unit-case": "lower",
     "value-keyword-case": "lower",
-    "value-list-comma-space-after": "always-single-line",
     "value-no-vendor-prefix": true,
     "scss/at-mixin-pattern": null,
     "scss/at-function-pattern": null,
@@ -83,7 +61,7 @@
     "scss/at-else-empty-line-before": "never",
     "scss/at-if-closing-brace-newline-after": "always-last-in-chain",
     "scss/at-if-closing-brace-space-after": "always-intermediate",
-    "scss/at-import-no-partial-leading-underscore": true,
+    "scss/load-no-partial-leading-underscore": true,
     "scss/at-mixin-argumentless-call-parentheses": "always",
     "scss/at-mixin-parentheses-space-before": "never",
     "scss/at-rule-no-unknown": true,

.gitignore

@@ -0,0 +1,91 @@
+{
+  "$schema": "https://biomejs.dev/schemas/2.0.6/schema.json",
+  "vcs": {
+    "enabled": true,
+    "clientKind": "git",
+    "useIgnoreFile": true
+  },
+  "files": {
+    "includes": ["src/**/*.ts", "test/**/*.ts", "scripts/**/*.js"],
+    "ignoreUnknown": true
+  },
+  "formatter": {
+    "enabled": true,
+    "formatWithErrors": false,
+    "indentStyle": "space",
+    "indentWidth": 2,
+    "lineEnding": "lf",
+    "lineWidth": 100,
+    "attributePosition": "auto",
+    "bracketSameLine": false,
+    "bracketSpacing": true,
+    "expand": "auto",
+    "useEditorconfig": false
+  },
+  "linter": {
+    "enabled": true,
+    "rules": {
+      "recommended": true,
+      "complexity": {
+        "noForEach": "warn",
+        "noStaticOnlyClass": "off"
+      },
+      "correctness": {
+        "noUnusedVariables": "error",
+        "noUnusedFunctionParameters": "error",
+        "noUnusedImports": "error",
+        "noUnusedPrivateClassMembers": "error",
+        "useImportExtensions": {
+          "level": "error",
+          "options": { "forceJsExtensions": true }
+        }
+      },
+      "style": {
+        "noNamespace": "error",
+        "useCollapsedElseIf": "error",
+        "noNonNullAssertion": "off",
+        "noParameterAssign": "error",
+        "useAsConstAssertion": "error",
+        "useDefaultParameterLast": "error",
+        "useEnumInitializers": "error",
+        "useSelfClosingElements": "error",
+        "useSingleVarDeclarator": "error",
+        "noUnusedTemplateLiteral": "error",
+        "useNumberNamespace": "error",
+        "noInferrableTypes": "error",
+        "noUselessElse": "error"
+      },
+      "suspicious": {
+        "noConsole": "error",
+        "noDebugger": "error",
+        "noExplicitAny": "off"
+      }
+    }
+  },
+  "javascript": {
+    "formatter": {
+      "jsxQuoteStyle": "double",
+      "quoteProperties": "asNeeded",
+      "trailingCommas": "es5",
+      "semicolons": "always",
+      "arrowParentheses": "always",
+      "bracketSameLine": false,
+      "quoteStyle": "single",
+      "attributePosition": "auto",
+      "bracketSpacing": true
+    }
+  },
+  "html": {
+    "formatter": {
+      "selfCloseVoidElements": "always"
+    }
+  },
+  "assist": {
+    "enabled": true,
+    "actions": {
+      "source": {
+        "organizeImports": "on"
+      }
+    }
+  }
+}