one-north-cla 0.0.6 → 0.0.10

package/README.md

@@ -41,11 +41,11 @@ npm run build
 ```
 OneNorthCLA/
 ├── src/
-│   ├── components/   
-│   │   ├── composites/ 
+│   ├── components/
+│   │   ├── composites/
 │   │   │   ├── ContentCarouselMultiple/
 │   │   │   └──ContentPrimaryFeatureDetail/
-│   │   └── foundations/  
+│   │   └── foundations/
 │   │       ├── BackgroundVideo/
 │   │       ├── Button/
 │   │       ├── ButtonSocial/
@@ -57,6 +57,8 @@ OneNorthCLA/
 │   │   ├── hooks/
 │   │   └── utils/
 │   └── assets/              # Static assets
+├── docs/                    # Documentation
+│   └── TESTING.md          # Testing guide
 └── public/                  # Public assets
 ```
 
@@ -76,8 +78,6 @@ This project follows a clean architecture pattern that separates concerns:
 3. **Type Safety**: Full TypeScript support throughout the codebase
 4. **Storybook Integration**: Comprehensive documentation and testing via Storybook
 
-## 🧩 Available Components
-
 ## 🛠️ Development
 
 ### Prerequisites
@@ -93,12 +93,19 @@ This project follows a clean architecture pattern that separates concerns:
 npm run dev              # Start Vite dev server
 npm run storybook        # Start Storybook
 
+# Testing
+npm test                 # Run tests in watch mode
+npm run test:run         # Run tests once (CI mode)
+npm run test:coverage    # Run tests with coverage
+npm run test:ui          # Run tests with interactive UI
+
 # Building
 npm run build            # Build for production
 npm run build-storybook  # Build Storybook
 
 # Quality
 npm run lint             # Run ESLint
+npm run lint:strict      # Run ESLint with no warnings allowed
 npm run preview          # Preview production build
 npm run type-check       # Run TSC
 ```
@@ -120,6 +127,7 @@ npm run type-check       # Run TSC
 
 - **Storybook**: Run `npm run storybook` for interactive component documentation
 - **TypeScript**: Full type definitions for all components
+- **Testing**: See [docs/TESTING.md](./docs/TESTING.md) for testing guide and best practices
 
 ## 🔧 Configuration
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "one-north-cla",
-  "version": "0.0.6",
+  "version": "0.0.10",
   "type": "module",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",
@@ -25,29 +25,35 @@
     "dev": "vite",
     "build": "vite build",
     "lint": "eslint .",
-    "lint:strict": "eslint . --max-warnings=0",
+    "lint:strict": "eslint 'src/**/*.{ts,tsx}' --ignore-pattern '**/*.test.*' --max-warnings=0 && eslint 'src/**/*.test.{ts,tsx}'",
     "preview": "vite preview",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
     "prepare": "husky",
-    "type-check": "tsc -b --noEmit"
+    "type-check": "tsc -b --noEmit",
+    "test": "vitest",
+    "test:ui": "vitest --ui",
+    "test:run": "vitest run",
+    "test:coverage": "vitest run --coverage"
   },
   "peerDependencies": {
     "react": ">=18",
     "react-dom": ">=18"
   },
   "dependencies": {
+    "@ark-ui/react": "^5.34.1",
+    "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-popover": "^1.1.15",
+    "@radix-ui/react-select": "^2.2.6",
     "@radix-ui/react-slot": "^1.2.4",
     "@sitecore-jss/sitecore-jss-react": "^22.7",
+    "@types/jest": "^30.0.0",
     "@vimeo/player": "^2.30.1",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
-    "common-tags": "^1.8.2",
     "embla-carousel-react": "^8.6.0",
     "lucide-react": "^0.562.0",
     "tailwind-merge": "^3.4.0",
-    "uuid": "^11.1.0",
     "youtube-player": "^5.6.0"
   },
   "devDependencies": {
@@ -55,6 +61,9 @@
     "@storybook/addon-docs": "^10.1.10",
     "@storybook/react-vite": "^10.1.10",
     "@tailwindcss/vite": "^4.1.7",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
+    "@testing-library/user-event": "^14.6.1",
     "@types/common-tags": "^1.8.4",
     "@types/node": "^24.0.10",
     "@types/react": "^19.1.2",
@@ -64,6 +73,7 @@
     "@typescript-eslint/eslint-plugin": "^8.50.1",
     "@typescript-eslint/parser": "^8.50.1",
     "@vitejs/plugin-react": "^4.4.1",
+    "@vitest/ui": "^4.0.18",
     "ajv": "^8",
     "ajv-draft-04": "^1",
     "ajv-keywords": "^5",
@@ -75,8 +85,10 @@
     "eslint-plugin-react-hooks": "^7.0.1",
     "eslint-plugin-react-refresh": "^0.4.19",
     "eslint-plugin-storybook": "^10.1.10",
+    "eslint-plugin-testing-library": "^7.15.4",
     "globals": "^16.0.0",
     "husky": "^9.1.7",
+    "jsdom": "^28.0.0",
     "lint-staged": "^16.2.7",
     "prettier": "^3.7.4",
     "storybook": "^10.1.10",
@@ -86,12 +98,14 @@
     "typescript-eslint": "^8.30.1",
     "vite": "^6.3.5",
     "vite-plugin-dts": "^4.5.4",
-    "vite-plugin-svgr": "^4.3.0"
+    "vite-plugin-svgr": "^4.3.0",
+    "vitest": "^4.0.18"
   },
   "lint-staged": {
     "*.{ts,tsx,js,jsx}": [
-      "eslint --fix --max-warnings=0",
-      "prettier --write"
+      "bash -c '[[ \"$0\" =~ \\.test\\. ]] && eslint --fix \"$0\" || eslint --fix --max-warnings=0 \"$0\"'",
+      "prettier --write",
+      "vitest related --run"
     ]
   }
 }