@crownpeak/dqm-react-component-dev-mcp 1.2.0

package/README.md

@@ -0,0 +1,138 @@
+# @crownpeak/dqm-react-component-dev-mcp
+
+MCP Server for Crownpeak DQM React Component documentation - powered by [Probe](https://probeai.dev/).
+
+This MCP server provides intelligent documentation search for AI assistants, enabling them to find information about DQMSidebar configuration, overlay detection, backend authentication, widget integration, and more.
+
+## Features
+
+- **Powered by Probe**: Uses the [Probe](https://probeai.dev/) search engine for fast, relevant results
+- **Pre-built Documentation**: All DQM documentation is bundled into the package
+- **Zero Configuration**: Just run with `npx` - no setup required
+- **AI Integration**: Seamlessly integrates with AI assistants via Model Context Protocol (MCP)
+
+## Quick Start
+
+### Claude Desktop
+
+Add to your Claude Desktop configuration (`~/Library/Application Support/Claude/claude_desktop_config.json` on macOS):
+
+```json
+{
+  "mcpServers": {
+    "dqm-docs": {
+      "command": "npx",
+      "args": [
+        "-y",
+        "@crownpeak/dqm-react-component-dev-mcp@latest"
+      ]
+    }
+  }
+}
+```
+
+### VS Code Copilot
+
+Add to your VS Code MCP configuration (`.vscode/mcp.json`):
+
+```json
+{
+  "servers": {
+    "dqm-docs": {
+      "command": "npx",
+      "args": ["-y", "@crownpeak/dqm-react-component-dev-mcp@latest"]
+    }
+  }
+}
+```
+
+### Cline
+
+Add to your project's `.cline/mcp_config.json`:
+
+```json
+{
+  "mcpServers": {
+    "dqm-docs": {
+      "command": "npx",
+      "args": ["-y", "@crownpeak/dqm-react-component-dev-mcp@latest"]
+    }
+  }
+}
+```
+
+### OpenAI Codex CLI
+
+Add to your project's `codex.toml` or global `~/.codex/config.toml`:
+
+```toml
+[mcp_servers.dqm-docs]
+command = "npx"
+args = ["-y", "@crownpeak/dqm-react-component-dev-mcp@latest"]
+```
+
+## Usage
+
+Once configured, you can ask your AI assistant questions about DQM:
+
+- "How do I configure overlay detection in DQMSidebar?"
+- "What props does DQMSidebar accept?"
+- "How do I set up backend authentication?"
+- "How do I integrate the widget bundle?"
+- "What is manualOffset and when should I use it?"
+
+The AI will use the `search_dqm_docs` tool to find relevant documentation.
+
+## Example Queries
+
+```
+"DQMSidebar overlayConfig"
+"backend authentication setup"
+"widget bundle integration"
+"manualOffset configuration"
+"z-index issues"
+```
+
+## Dynamic Usage (Alternative)
+
+Instead of the pre-built package, you can point directly to the GitHub repository:
+
+```json
+{
+  "mcpServers": {
+    "dqm-docs": {
+      "command": "npx",
+      "args": [
+        "-y",
+        "@probelabs/docs-mcp@latest",
+        "--gitUrl",
+        "https://github.com/Crownpeak/dqm-react-component",
+        "--toolName",
+        "search_dqm_docs",
+        "--toolDescription",
+        "Search Crownpeak DQM React Component documentation"
+      ]
+    }
+  }
+}
+```
+
+## Documentation Coverage
+
+This MCP server indexes all documentation including:
+
+- **README.md** - Overview and quick start
+- **docs/** - Full documentation (QUICKSTART, DEVELOPMENT, SERVER, EXAMPLES, etc.)
+- **src/** - Source code with JSDoc comments
+- **.github/copilot-instructions.md** - AI agent integration guide
+
+## Related
+
+- [DQM React Component](https://github.com/Crownpeak/dqm-react-component)
+- [Probe Search Engine](https://probeai.dev/)
+- [Model Context Protocol](https://modelcontextprotocol.io/)
+- [@probelabs/docs-mcp](https://github.com/probelabs/docs-mcp)
+
+## License
+
+MIT © Crownpeak Technology GmbH

package/data/.env.example

@@ -0,0 +1,22 @@
+# Server Configuration
+PORT=3001
+
+# CORS Origins (comma-separated)
+CORS_ORIGINS=http://localhost:5173,http://localhost:3000
+
+# Crownpeak DQM API
+DQM_API_BASE_URL=https://api.crownpeak.net/dqm-cms/v1
+
+# JWT Secret (for session tokens)
+# Generate a secure secret: openssl rand -base64 32
+JWT_SECRET=your-secret-key-change-in-production
+
+# Redis Configuration (Optional - for persistent sessions)
+# If not set, will use in-memory storage (sessions lost on restart)
+# REDIS_URL=redis://localhost:6379
+# For Redis Cloud: redis://username:password@host:port
+# For AWS ElastiCache: redis://your-elasticache-endpoint:6379
+
+# Crownpeak DQM Credentials
+WEBSITE_ID=<your-website-id>
+API_KEY=<your-api-key>

package/data/.gitattributes

@@ -0,0 +1,47 @@
+# Auto detect text files and perform LF normalization
+* text=auto
+
+# Source code
+*.js text eol=lf
+*.jsx text eol=lf
+*.ts text eol=lf
+*.tsx text eol=lf
+*.json text eol=lf
+*.css text eol=lf
+*.scss text eol=lf
+*.html text eol=lf
+*.xml text eol=lf
+*.md text eol=lf
+*.yaml text eol=lf
+*.yml text eol=lf
+
+# Scripts
+*.sh text eol=lf
+*.bash text eol=lf
+
+# Windows scripts
+*.bat text eol=crlf
+*.cmd text eol=crlf
+*.ps1 text eol=crlf
+
+# Binary files
+*.png binary
+*.jpg binary
+*.jpeg binary
+*.gif binary
+*.ico binary
+*.mov binary
+*.mp4 binary
+*.mp3 binary
+*.flv binary
+*.fla binary
+*.swf binary
+*.gz binary
+*.zip binary
+*.7z binary
+*.ttf binary
+*.eot binary
+*.woff binary
+*.woff2 binary
+*.pyc binary
+*.pdf binary

package/data/.glfrc.json

@@ -0,0 +1,7 @@
+{
+  "inputs": ["./package.json", "./mcp-server/package.json"],
+  "output": "./THIRD_PARTY_LICENSES.txt",
+  "lineEnding": "lf",
+  "omitVersions": false,
+  "eol": "lf"
+}

package/data/.husky/pre-commit

@@ -0,0 +1,5 @@
+# Run license compliance check before commit
+npm run licenses:check
+
+# Run tests
+npm run test:run

package/data/.nvmrc

@@ -0,0 +1 @@
+22

package/data/CHANGELOG.md

@@ -0,0 +1,75 @@
+# Crownpeak DQM React Component - Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [1.2.0] - 2026-01-07
+
+### Added
+- **Internationalization (i18n)**: Full multi-language support using i18next
+  - Supported languages: English (default), German, Spanish
+  - Language switcher component in sidebar footer
+  - URL parameter override (`?dqmUiLang=de`)
+  - Browser language auto-detection
+  - LocalStorage persistence of user preference (`dqm_locale`)
+  - Regional variant fallbacks (e.g., `de-AT` → `de` → `en`)
+- **New Exports**: 
+  - `i18n`, `resolveLanguage` from `./i18n`
+  - `SUPPORTED_LOCALES`, `DEFAULT_LOCALE`, `normalizeLocale` from `./locale`
+  - Types: `SupportedLocale`, `AvailableLanguage`
+- **Comprehensive i18n documentation** in `I18N.md`
+
+## [1.1.0] - 2025-12-17
+
+### Added
+- **Overlay Configuration**: New `overlayConfig` option in `DQMConfig` for customizing overlay/toolbar detection
+  - `selector`: Custom CSS selector for overlay elements
+  - `validateIframe`: Option to validate iFrame contentWindow availability
+  - `pollMs`: Configurable polling interval for cross-origin iFrame detection
+  - `manualOffset`: Manual offset configuration for cases where auto-detection fails
+- **Enhanced `useDomPresence` Hook**: Now returns comprehensive element information including:
+  - `rect`: Element bounding rectangle (height, width, top, bottom, left, right)
+  - `position`: Detected position ('top', 'bottom', 'left', 'right', 'center')
+  - `contentOffset`: Ready-to-use offsets for positioning UI elements
+- **New Exports**: 
+  - `useOverlayResistant` hook for advanced overlay handling
+  - `OverlayConfig`, `OverlayOffsetPosition`, `OverlayInfo`, `OverlayPosition` types
+- **Standalone Widget Bundle**: New widget build (IIFE + ESM) with `initDQMWidget`, Shadow DOM isolation, and Emotion cache binding for safe embedding on any site.
+- **Widget Tooling & Types**: Added loader utilities, TypeScript declarations, and public exports for widget consumers.
+- **Integration Demos**: New demo pages for IIFE, ESM, dynamic loading, and standalone widget usage to test the bundled widget end-to-end.
+- **Config Option `disableLogout`**: Allows host apps to hide the sidebar logout control when session lifecycle is managed externally.
+
+### Changed
+- `useOverlayResistant` hook now accepts configuration options
+- `OverlayInfo` interface now includes `isManualOffset` flag
+- Sidebar header, content, footer, skeleton, and FAB now respect overlay offsets for consistent spacing around external toolbars.
+
+## [1.0.1] - 2025-12-08
+
+### Fixed
+- Resolved issue with error highlighting in certain browsers
+- Fixed TypeScript type definition for DQMSidebar props
+
+## [1.0.0] - 2025-10-30
+
+### Added
+- Initial release of @crownpeak/dqm-react-component
+- DQMSidebar component for quality analysis
+- ErrorBoundary component for error handling
+- Full TypeScript support with type definitions
+- Material-UI integration
+- Real-time quality analysis dashboard
+- Browser and source view for error highlighting
+- Category-based filtering
+- Accessibility compliance checking
+- Comprehensive documentation
+
+### Features
+- Quality scoring and checkpoint validation
+- WCAG 2.1 compliance checking
+- Visual error highlighting
+- Mobile responsive design
+- Export functionality for highlighted errors
+

package/data/CODE_OF_CONDUCT.md

@@ -0,0 +1,129 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+We as members, contributors, and leaders pledge to make participation in our
+community a harassment-free experience for everyone, regardless of age, body
+size, visible or invisible disability, ethnicity, sex characteristics, gender
+identity and expression, level of experience, education, socio-economic status,
+nationality, personal appearance, race, religion, or sexual identity
+and orientation.
+
+We pledge to act and interact in ways that contribute to an open, welcoming,
+diverse, inclusive, and healthy community.
+
+## Our Standards
+
+Examples of behavior that contributes to a positive environment for our
+community include:
+
+* Demonstrating empathy and kindness toward other people
+* Being respectful of differing opinions, viewpoints, and experiences
+* Giving and gracefully accepting constructive feedback
+* Accepting responsibility and apologizing to those affected by our mistakes,
+  and learning from the experience
+* Focusing on what is best not just for us as individuals, but for the
+  overall community
+
+Examples of unacceptable behavior include:
+
+* The use of sexualized language or imagery, and sexual attention or
+  advances of any kind
+* Trolling, insulting or derogatory comments, and personal or political attacks
+* Public or private harassment
+* Publishing others' private information, such as a physical or email
+  address, without their explicit permission
+* Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Enforcement Responsibilities
+
+Community leaders are responsible for clarifying and enforcing our standards of
+acceptable behavior and will take appropriate and fair corrective action in
+response to any behavior that they deem inappropriate, threatening, offensive,
+or harmful.
+
+Community leaders have the right and responsibility to remove, edit, or reject
+comments, commits, code, wiki edits, issues, and other contributions that are
+not aligned to this Code of Conduct, and will communicate reasons for moderation
+decisions when appropriate.
+
+## Scope
+
+This Code of Conduct applies within all community spaces, and also applies when
+an individual is officially representing the community in public spaces.
+Examples of representing our community include using an official e-mail address,
+posting via an official social media account, or acting as an appointed
+representative at an online or offline event.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported to the community leaders responsible for enforcement at
+**conduct@crownpeak.com**.
+
+All complaints will be reviewed and investigated promptly and fairly.
+
+All community leaders are obligated to respect the privacy and security of the
+reporter of any incident.
+
+## Enforcement Guidelines
+
+Community leaders will follow these Community Impact Guidelines in determining
+the consequences for any action they deem in violation of this Code of Conduct:
+
+### 1. Correction
+
+**Community Impact**: Use of inappropriate language or other behavior deemed
+unprofessional or unwelcome in the community.
+
+**Consequence**: A private, written warning from community leaders, providing
+clarity around the nature of the violation and an explanation of why the
+behavior was inappropriate. A public apology may be requested.
+
+### 2. Warning
+
+**Community Impact**: A violation through a single incident or series
+of actions.
+
+**Consequence**: A warning with consequences for continued behavior. No
+interaction with the people involved, including unsolicited interaction with
+those enforcing the Code of Conduct, for a specified period of time. This
+includes avoiding interactions in community spaces as well as external channels
+like social media. Violating these terms may lead to a temporary or
+permanent ban.
+
+### 3. Temporary Ban
+
+**Community Impact**: A serious violation of community standards, including
+sustained inappropriate behavior.
+
+**Consequence**: A temporary ban from any sort of interaction or public
+communication with the community for a specified period of time. No public or
+private interaction with the people involved, including unsolicited interaction
+with those enforcing the Code of Conduct, is allowed during this period.
+Violating these terms may lead to a permanent ban.
+
+### 4. Permanent Ban
+
+**Community Impact**: Demonstrating a pattern of violation of community
+standards, including sustained inappropriate behavior, harassment of an
+individual, or aggression toward or disparagement of classes of individuals.
+
+**Consequence**: A permanent ban from any sort of public interaction within
+the community.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage],
+version 2.0, available at
+https://www.contributor-covenant.org/version/2/0/code_of_conduct.html.
+
+Community Impact Guidelines were inspired by [Mozilla's code of conduct
+enforcement ladder](https://github.com/mozilla/diversity).
+
+[homepage]: https://www.contributor-covenant.org
+
+For answers to common questions about this code of conduct, see the FAQ at
+https://www.contributor-covenant.org/faq. Translations are available at
+https://www.contributor-covenant.org/translations.

package/data/CONTRIBUTING.md

@@ -0,0 +1,203 @@
+# Contributing to Crownpeak DQM React Component
+
+Thank you for your interest in contributing! This document provides guidelines for contributing to this project.
+
+## Table of Contents
+
+- [Code of Conduct](#code-of-conduct)
+- [Getting Started](#getting-started)
+- [Development Workflow](#development-workflow)
+- [Pull Request Process](#pull-request-process)
+- [Coding Standards](#coding-standards)
+- [Commit Messages](#commit-messages)
+
+## Code of Conduct
+
+Please be respectful and constructive in all interactions. We aim to foster an inclusive and welcoming community.
+
+## Getting Started
+
+1. **Fork the repository** on GitHub
+2. **Clone your fork** locally:
+   ```bash
+   git clone https://github.com/YOUR_USERNAME/crownpeak-dqm-react-component.git
+   cd dqm-react-component
+   ```
+3. **Install dependencies**:
+   ```bash
+   npm install
+   ```
+4. **Create a branch** for your changes:
+   ```bash
+   git checkout -b feature/your-feature-name
+   ```
+
+## Development Workflow
+
+### Running Development Server
+
+```bash
+npm run dev
+```
+
+This starts:
+- Frontend + Backend on `http://localhost:5173` (Vite dev server with integrated backend)
+- Backend routes (`/auth/*`, `/dqm/*`) handled by Vite plugin
+
+### Building
+
+```bash
+# Build everything
+npm run build
+
+# Build library only
+npm run build:lib
+
+# Build server only
+npm run build:server
+
+# Build auth UI only
+npm run build:auth-ui
+```
+
+### Linting
+
+```bash
+npm run lint
+```
+
+### Testing Your Changes
+
+1. Test in development mode: `npm run dev`
+2. Test build: `npm run build`
+3. Test as package: `npm pack` and install in test project
+
+## Pull Request Process
+
+1. **Update documentation** if you change APIs or add features
+2. **Update CHANGELOG.md** with your changes
+3. **Ensure all builds pass**: `npm run build`
+4. **Lint your code**: `npm run lint`
+5. **Create a pull request** with a clear description of changes
+6. **Link any related issues** in the PR description
+7. **Wait for review** - maintainers will review your PR
+
+### PR Title Format
+
+Use conventional commits format:
+- `feat: Add new feature`
+- `fix: Fix bug in component`
+- `docs: Update documentation`
+- `refactor: Refactor code`
+- `test: Add tests`
+- `chore: Update dependencies`
+
+## Coding Standards
+
+### TypeScript
+
+- Use TypeScript for all new code
+- Properly type all functions and variables
+- Export types for public APIs
+- Use interfaces for component props
+
+### React
+
+- Use functional components with hooks
+- Follow React best practices
+- Keep components small and focused
+- Use Material-UI components consistently
+
+### Code Style
+
+- Use ESLint configuration provided
+- 2 spaces for indentation
+- Single quotes for strings
+- Semicolons required
+- Trailing commas in multi-line objects/arrays
+
+### File Organization
+
+```
+src/
+├── components/         # React components
+│   ├── auth/          # Authentication components
+│   ├── cards/         # Card components
+│   ├── common/        # Shared components
+│   ├── renderers/     # HTML renderers
+│   └── sidebar/       # Sidebar components
+├── types/             # TypeScript types
+└── utils/             # Utility functions
+```
+
+## Commit Messages
+
+Follow conventional commits:
+
+```
+<type>(<scope>): <subject>
+
+<body>
+
+<footer>
+```
+
+**Types:**
+- `feat`: New feature
+- `fix`: Bug fix
+- `docs`: Documentation only
+- `style`: Code style (formatting, no code change)
+- `refactor`: Code refactoring
+- `test`: Adding tests
+- `chore`: Maintenance tasks
+
+**Examples:**
+```
+feat(sidebar): Add keyboard navigation support
+
+Add arrow key navigation for checkpoint list.
+Press Enter to expand/collapse categories.
+
+Closes #123
+```
+
+```
+fix(auth): Resolve session timeout issue
+
+Session was expiring too early due to incorrect
+timestamp calculation in Redis store.
+
+Fixes #456
+```
+
+## Areas for Contribution
+
+### High Priority
+- Add unit tests (React Testing Library)
+- Improve accessibility (ARIA labels, keyboard navigation)
+- Add internationalization (i18n)
+- Performance optimizations
+
+### Documentation
+- More usage examples
+- Integration guides for different frameworks
+- API documentation improvements
+- Video tutorials
+
+### Features
+- Additional authentication methods
+- Custom theming support
+- Export analysis reports
+- Offline mode support
+
+## Questions?
+
+- Open an issue for bugs or feature requests
+- Check existing issues before creating new ones
+- Tag your issues appropriately (bug, enhancement, question)
+
+## License
+
+By contributing, you agree that your contributions will be licensed under the MIT License.
+
+Thank you for contributing!