feat!: modernize library with functional components and style props API

BREAKING CHANGES:
 - Component styling now uses style props (containerStyle, canvasStyle, etc.)
    instead of CSS classes
 - canvasWidth/canvasHeight props now apply to CSS display size
 - Replaced webpack with rollup for builds
 - Restructured exports from src/components/*

Changes:
 - Refactor all components to functional React with hooks
 - Add customizable style props for all components
 - Add dev-only logger utility (stripped in production)
 - Add comprehensive unit tests
 - Add example app with Vite
 - Update i18n structure with JSON locale files

Author: madhavilosetty-intel

.claude/settings.local.json

@@ -0,0 +1,5 @@
+{
+  "permissions": {
+    "allow": ["Bash(npm outdated:*)"]
+  }
+}

.eslintrc.json

@@ -1,29 +1,30 @@
-<!--🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅
-Hello there! 😄
-To expedite issue processing please search open and closed issues before submitting a new one.
-Existing issues often contain information about workarounds, resolution, or progress updates.
-🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅-->
-**Describe the bug** 🪲
-A clear and concise description of what the bug is.
-
-
-**To Reproduce** 🪜
-Steps to reproduce the behavior:
-1. Go to '...'
-2. Click on '....'
-3. Scroll down to '....'
-4. See error
-
-**Expected behavior**
-A clear and concise description of what you expected to happen.
-
-**Screenshots** 🖼️
-If applicable, add screenshots to help explain your problem.
-
-**Browser Information (please complete the following information):** 🖥️
- - OS: [e.g. Windows 10 build 21H1, Ubuntu 20.04 LTS]
- - Browser and Version: [e.g. IE Edge 95.0.1020.40 ]
-
-
-**Additional context**
-Add any other context about the problem here. 
+<!--🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅
+Hello there! 😄
+To expedite issue processing please search open and closed issues before submitting a new one.
+Existing issues often contain information about workarounds, resolution, or progress updates.
+🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅-->
+
+**Describe the bug** 🪲
+A clear and concise description of what the bug is.
+
+**To Reproduce** 🪜
+Steps to reproduce the behavior:
+
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+**Expected behavior**
+A clear and concise description of what you expected to happen.
+
+**Screenshots** 🖼️
+If applicable, add screenshots to help explain your problem.
+
+**Browser Information (please complete the following information):** 🖥️
+
+- OS: [e.g. Windows 10 build 21H1, Ubuntu 20.04 LTS]
+- Browser and Version: [e.g. IE Edge 95.0.1020.40 ]
+
+**Additional context**
+Add any other context about the problem here.

.github/ISSUE_TEMPLATE.md

@@ -1,15 +1,15 @@
 ## PR Checklist
+
 <!-- Please check if your PR fulfills the following requirements: -->
 
 - [ ] Unit Tests have been added for new changes
 - [ ] API tests have been updated if applicable
 - [ ] All commented code has been removed
 - [ ] If you've added a dependency, you've ensured license is compatible with Apache 2.0 and clearly outlined the added dependency.
 
-
 ## What are you changing?
-<!-- Please provide a short description of the updates that are in the PR -->
 
+<!-- Please provide a short description of the updates that are in the PR -->
 
 ## Anything the reviewer should know when reviewing this PR?
 

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,11 +1,11 @@
 module.exports = {
-    extends: ['@commitlint/config-conventional'],
-    rules: {
-        'body-max-line-length': [2, 'always', 200],
-        'subject-case': [
-            1,
-            'never',
-            ['sentence-case', 'start-case', 'pascal-case', 'upper-case'],
-        ],
-    }
-}
+  extends: ['@commitlint/config-conventional'],
+  rules: {
+    'body-max-line-length': [2, 'always', 200],
+    'subject-case': [
+      1,
+      'never',
+      ['sentence-case', 'start-case', 'pascal-case', 'upper-case']
+    ]
+  }
+}

.github/commitlint.config.cjs

@@ -1,10 +1,10 @@
 version: 2
 updates:
   # Maintain dependencies for npm modules
-  - package-ecosystem: "npm"
-    directory: "/"
+  - package-ecosystem: 'npm'
+    directory: '/'
     schedule:
-      interval: "daily"
+      interval: 'daily'
 
   - package-ecosystem: github-actions
     directory: /

.github/dependabot.yml

@@ -22,7 +22,7 @@ jobs:
   build:
     # The type of runner that the job will run on
     permissions:
-      contents: write  # for Git to git push
+      contents: write # for Git to git push
     runs-on: ubuntu-latest
 
     # Steps represent a sequence of tasks that will be executed as part of the job
@@ -38,32 +38,19 @@ jobs:
         uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
         with:
           node-version: 24.x
-      - name: Run NPM CI
-        run: npm install
+      - name: Install Dependencies
+        run: npm ci
 
       - name: Run Lint
         run: npm run lint
 
-      - name: Run Test
-        run: npm run test
+      - name: Run Tests with Coverage
+        run: npm run test:coverage
 
-      - name: Run Coverage
-        run: npm run coverage
-
-      - uses: codecov/codecov-action@671740ac38dd9b0130fbe1cec585b89eea48d3de # v5.5.2
-        name: Upload Coverage Results
+      - name: Upload Coverage Results
+        uses: codecov/codecov-action@671740ac38dd9b0130fbe1cec585b89eea48d3de # v5.5.2
         with:
           directory: ./coverage/
 
-      - name: Run Build Dev
+      - name: Run Build
         run: npm run build
-
-      - name: Run Build Externals
-        run: npm run build-ext
-
-      - run: mv junit.xml ui-toolkit-react-unit.xml
-      - name: Upload JEST Results
-        uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6.0.0
-        with:
-          name: ui-toolkit-react-unit
-          path: ui-toolkit-react-unit.xml

.github/workflows/ci.yml

@@ -9,10 +9,10 @@
 # the `language` matrix defined below to confirm you have the correct set of
 # supported CodeQL languages.
 #
-name: "CodeQL"
+name: 'CodeQL'
 
 on:
-  workflow_dispatch:  
+  workflow_dispatch:
   release:
     types:
       - created
@@ -22,7 +22,7 @@ on:
     # The branches below must be a subset of the branches above
     branches: [main]
   schedule:
-    - cron: "18 2 * * 6"
+    - cron: '18 2 * * 6'
 
 permissions:
   contents: read
@@ -39,7 +39,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        language: ["javascript"]
+        language: ['javascript']
         # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python' ]
         # Learn more:
         # https://docs.github.com/en/free-pro-team@latest/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#changing-the-languages-that-are-analyzed
@@ -98,4 +98,4 @@ jobs:
         continue-on-error: true
         with:
           name: report
-          path: ./*.pdf
+          path: ./*.pdf

.github/workflows/codeql-analysis.yml

@@ -19,7 +19,7 @@ jobs:
     runs-on: ubuntu-latest
     permissions:
       id-token: write
-      contents: write  # for Git to git push
+      contents: write # for Git to git push
     steps:
       - name: Harden Runner
         uses: step-security/harden-runner@20cf305ff2072d973412fa9b1e3a4f227bda3c76 # v2.14.0
@@ -33,9 +33,9 @@ jobs:
       - name: Use Node.js 24.x
         uses: actions/setup-node@395ad3262231945c25e8478fd5baf05154b1d79f # v6.1.0
         with:
-          node-version: "24.x"
+          node-version: '24.x'
       - run: npm ci
-      - run: npm run build-ext --if-present
+      - run: npm run build
       - run: rsync -a package.json README.md ./dist/
       - name: Semantic Release
         id: semantic
@@ -48,8 +48,8 @@ jobs:
         if: steps.semantic.outputs.new_release_published == 'true'
         run: |
           echo "Publishing @device-management-toolkit/ui-toolkit-react@${{ steps.semantic.outputs.new_release_version }}"
-          
+
           sed -i 's/"@open-amt-cloud-toolkit\/ui-toolkit-react"/"@device-management-toolkit\/ui-toolkit-react"/' dist/package.json
           sed -i 's/"version": "[^"]*"/"version": "${{ steps.semantic.outputs.new_release_version }}"/' dist/package.json
           cd dist
-          npm publish
+          npm publish

.github/workflows/release.yml

@@ -12,7 +12,7 @@ on:
   schedule:
     - cron: '44 11 * * 6'
   push:
-    branches: [ "main" ]
+    branches: ['main']
 
 # Declare default permissions as read only.
 permissions: read-all
@@ -36,12 +36,12 @@ jobs:
         with:
           egress-policy: audit
 
-      - name: "Checkout code"
+      - name: 'Checkout code'
         uses: actions/checkout@8e8c483db84b4bee98b60c0593521ed34d9990e8 # v6.0.1
         with:
           persist-credentials: false
 
-      - name: "Run analysis"
+      - name: 'Run analysis'
         uses: ossf/scorecard-action@4eaacf0543bb3f2c246792bd56e8cdeffafb205a # v2.4.3
         with:
           results_file: results.sarif
@@ -63,15 +63,15 @@ jobs:
 
       # Upload the results as artifacts (optional). Commenting out will disable uploads of run results in SARIF
       # format to the repository Actions tab.
-      - name: "Upload artifact"
+      - name: 'Upload artifact'
         uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v3.1.0
         with:
           name: SARIF file
           path: results.sarif
           retention-days: 5
 
       # Upload the results to GitHub's code scanning dashboard.
-      - name: "Upload to code-scanning"
+      - name: 'Upload to code-scanning'
         uses: github/codeql-action/upload-sarif@cdefb33c0f6224e58673d9004f47f7cb3e328b89 # v2.1.27
         with:
           sarif_file: results.sarif