@heroku/ember-hk-components 0.21.2 → 1.21.4

package/.github/dependabot.yml

@@ -0,0 +1,12 @@
+# To get started with Dependabot version updates, you'll need to specify which
+# package ecosystems to update and where the package manifests are located.
+# Please see the documentation for all configuration options:
+# https://docs.github.com/github/administering-a-repository/configuration-options-for-dependency-updates
+
+version: 2
+updates:
+  - package-ecosystem: "npm" # Note: Dependabot doesn't have native pnpm support yet, but works with pnpm projects
+    directory: "/"
+    open-pull-requests-limit: 5
+    schedule:
+      interval: "weekly"

package/.github/workflows/push_dependabot_metadata.yml

@@ -0,0 +1,18 @@
+name: Send data to Security Alerts
+
+on:
+  workflow_dispatch:
+  schedule:
+    - cron: '0 10 * * *'
+
+jobs:
+  send-alerts:
+    runs-on: sfdc-hk-ubuntu-latest
+    steps:
+      - name: Send data to Security Alerts
+        uses: heroku/security-alerts-action@stable
+        with:
+          gh-app-id: ${{ secrets.SECURITY_ALERTS_GH_APP_ID }}
+          gh-app-privkey: ${{ secrets.SECURITY_ALERTS_GH_APP_PRIVKEY }}
+          webhook-url: ${{ secrets.SECURITY_ALERTS_WEBHOOK_URL }}
+          sa-token: ${{ secrets.SECURITY_ALERTS_TOKEN }}

package/.github/workflows/sync_component_metadata.yml

@@ -0,0 +1,25 @@
+name: "Send data to Components Inventory"
+on:
+  workflow_dispatch:
+  push:
+    branches:
+      - "main"
+    paths:
+      - ".heroku/components-inventory/*.json"
+  pull_request:
+    types:
+      - opened
+      - synchronize
+    paths:
+      - ".heroku/components-inventory/*.json"
+jobs:
+  action:
+    runs-on: sfdc-hk-ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Send data to Components Inventory
+        uses: heroku/components-action@main
+        with:
+          COMPONENTS_GHA_APP_ID: ${{ secrets.COMPONENTS_GHA_APP_ID}}
+          COMPONENTS_GHA_APP_PRIVATE_KEY: ${{ secrets.COMPONENTS_GHA_APP_PRIVATE_KEY}}
+          COMPONENTS_GHA_JSON_TOKEN: ${{ secrets.COMPONENTS_GHA_JSON_TOKEN}}

package/.heroku/components-inventory/ember-hk-component.json

@@ -0,0 +1,33 @@
+
+{
+  "slug": "ember-hk-component",
+  "name": "ember-hk-component",
+  "description": "This is an ember addon for reusable components using the Purple3 CSS framework and Malibu",
+  "language": "Ember",
+  "lifecycle_status": "Production",
+  "pipeline_uuid": "dd836945-b702-4c1b-980f-55977011c176",
+  "repository_url": "https://github.com/heroku/ember-hk-components",
+  "stack": "Platform",
+  "stack_type": "Package",
+  "documentation_url": null,
+  "metrics_url": null,
+  "sox": false,
+  "soc2": false,
+  "customer_facing": true,
+  "pager_duty_service_code": "PEB4QAI",
+  "component_tier": "Not a Service",
+  "github_actions": false,
+  "github_release": true,
+  "github_actions_ci_workflow": null,
+  "authentication": null,
+  "platform": null,
+  "team_name": "Front-End",
+  "planned_maintenance_severity": null,
+  "gus_team": "https://gus.lightning.force.com/lightning/r/ADM_Scrum_Team__c/a00B0000000qQ8HIAU/view",
+  "pci_tier": "TBD",
+  "consumer_type": "N/A",
+  "content_cacheable": "N/A",
+  "blast_radius": "No impact",
+  "audit_findings_url": null,
+  "last_audit": null
+}

package/BABEL_TRAVERSE_VULNERABILITY_GUIDE.md

@@ -0,0 +1,245 @@
+# Resolving Babel-Traverse Critical Vulnerability in Ember Projects
+
+## Overview
+
+This guide documents how to resolve the critical `babel-traverse` vulnerability (GHSA-67hx-6x53-jw92) in Ember.js projects without breaking compatibility or requiring major version upgrades.
+
+**Vulnerability Details:**
+- **Package**: `babel-traverse` (versions < 7.23.2)
+- **Severity**: Critical
+- **Issue**: Arbitrary code execution when compiling malicious code
+- **CVE**: Related to babel-traverse 6.x series used in legacy toolchains
+
+## The Problem
+
+The `babel-traverse` vulnerability appears in Ember projects through multiple dependency chains:
+
+### Common Vulnerability Paths
+
+1. **Via Consolidate (Most Common)**:
+   ```
+   ember-cli → testem → consolidate → babel-core → babel-traverse (6.26.0)
+   ```
+
+2. **Via ember-cli-chai**:
+   ```
+   ember-cli-chai → babel-preset-env → babel-plugin-transform-async-to-generator → 
+   babel-helper-remap-async-to-generator → babel-traverse (6.26.0)
+   ```
+
+3. **Via ember-a11y-testing** (older versions):
+   ```
+   ember-a11y-testing → ember-auto-import → babel-core → babel-traverse (6.26.0)
+   ```
+
+### Why Standard Solutions Don't Work
+
+- **Ember CLI versions**: Even the latest Ember CLI (6.7.0) still uses vulnerable dependencies
+- **Resolution conflicts**: Forcing `babel-traverse` to `@babel/traverse` breaks API compatibility
+- **Build-time errors**: Old babel plugins expect 6.x API methods like `path.inShadow()`
+
+## The Solution: Package Resolutions
+
+### 1. Fix Consolidate Vulnerability (Primary Solution)
+
+The most effective fix is to replace the vulnerable `consolidate` package with `@ladjs/consolidate`, which has **zero dependencies** and eliminates the entire babel-traverse chain.
+
+**Add to package.json resolutions:**
+
+```json
+{
+  "resolutions": {
+    "consolidate": "npm:@ladjs/consolidate@^1.0.4"
+  }
+}
+```
+
+**Why this works:**
+- `consolidate@0.16.0` → has `babel-core` dependency → vulnerable
+- `@ladjs/consolidate@1.0.4` → **zero dependencies** → secure
+
+### 2. Handle ember-cli-chai Vulnerability
+
+If you're still seeing vulnerabilities after the consolidate fix, it's likely coming from `ember-cli-chai`.
+
+#### Option A: Remove ember-cli-chai (Recommended)
+
+```bash
+# Remove ember-cli-chai
+pnpm remove ember-cli-chai
+
+# Use chai directly with ember-qunit
+pnpm add --save-dev chai
+```
+
+Update your tests to import chai directly:
+```javascript
+import { expect } from 'chai';
+// Instead of using this.expect from ember-cli-chai
+```
+
+#### Option B: Add Additional Resolution (If keeping ember-cli-chai)
+
+```json
+{
+  "resolutions": {
+    "consolidate": "npm:@ladjs/consolidate@^1.0.4",
+    "babel-traverse": "npm:@babel/traverse@^7.23.2"
+  }
+}
+```
+
+**⚠️ Warning**: This may cause build-time compatibility issues requiring additional patches.
+
+### 3. Update ember-a11y-testing
+
+Ensure you're using a compatible version:
+
+```json
+{
+  "devDependencies": {
+    "ember-a11y-testing": "^5.2.1"
+  }
+}
+```
+
+## Complete Resolution Example
+
+Here's a complete `package.json` resolutions section that addresses all common vulnerability paths:
+
+```json
+{
+  "resolutions": {
+    "lodash.template": "npm:lodash@^4.17.21",
+    "braces": "npm:braces@^3.0.3",
+    "rollup": "^4.50.1",
+    "json5": "^2.2.3",
+    "ansi-html": "^0.0.8",
+    "consolidate": "npm:@ladjs/consolidate@^1.0.4"
+  }
+}
+```
+
+## Implementation Steps
+
+### Step 1: Audit Current Vulnerabilities
+```bash
+pnpm audit --audit-level critical
+```
+
+### Step 2: Add Consolidate Resolution
+```json
+{
+  "resolutions": {
+    "consolidate": "npm:@ladjs/consolidate@^1.0.4"
+  }
+}
+```
+
+### Step 3: Install Dependencies
+```bash
+pnpm install
+```
+
+### Step 4: Verify Fix
+```bash
+pnpm audit --audit-level critical
+```
+
+### Step 5: Test Application
+```bash
+pnpm test
+```
+
+## Troubleshooting
+
+### Build Errors After Adding babel-traverse Resolution
+
+If you see errors like `path.inShadow is not a function`, you have API compatibility issues:
+
+1. **Remove the babel-traverse resolution**:
+   ```json
+   {
+     "resolutions": {
+       // Remove this line if it causes issues
+       // "babel-traverse": "npm:@babel/traverse@^7.23.2"
+     }
+   }
+   ```
+
+2. **Focus on the consolidate resolution only** (this resolves most cases)
+
+3. **Consider removing ember-cli-chai** if it's the remaining vulnerability source
+
+### Peer Dependency Warnings
+
+You may see warnings about peer dependencies when updating packages. These are usually safe to ignore if tests pass.
+
+### Alternative: Ember CLI Upgrade Path
+
+For long-term security, consider upgrading to newer Ember CLI versions, but note:
+- Requires significant compatibility testing
+- May need dependency updates across the board
+- ember-cli-eyeglass compatibility issues with newer versions
+
+## Verification
+
+After implementing the fix, verify success:
+
+### 1. Check Audit Results
+```bash
+pnpm audit --audit-level critical
+# Should show: "0 vulnerabilities found" or no critical ones
+```
+
+### 2. Verify Dependency Resolution
+```bash
+find node_modules -name "*consolidate*" -type d
+# Should show @ladjs/consolidate instead of old consolidate
+```
+
+### 3. Test Application
+```bash
+pnpm test
+# All tests should pass without babel-traverse errors
+```
+
+## Why This Approach Works
+
+1. **Non-breaking**: Doesn't require major version upgrades
+2. **Targeted**: Addresses the root cause without changing API surface
+3. **Maintainable**: Uses actively maintained packages
+4. **Compatible**: Works with existing Ember CLI 3.x and 4.x projects
+
+## Additional Security Improvements
+
+While fixing babel-traverse, consider addressing these related vulnerabilities:
+
+```json
+{
+  "resolutions": {
+    "consolidate": "npm:@ladjs/consolidate@^1.0.4",
+    "rollup": "^4.50.1",
+    "json5": "^2.2.3",
+    "ansi-html": "^0.0.8",
+    "braces": "npm:braces@^3.0.3",
+    "lodash.template": "npm:lodash@^4.17.21"
+  }
+}
+```
+
+## Key Takeaways
+
+1. **@ladjs/consolidate is the key**: This single resolution eliminates the most common babel-traverse vulnerability path
+2. **Avoid forcing babel-traverse resolutions**: They often cause API compatibility issues
+3. **Test thoroughly**: Always run your test suite after applying security fixes
+4. **Consider removing ember-cli-chai**: Direct chai usage is often cleaner and more secure
+5. **Package resolutions are powerful**: They allow surgical fixes without major upgrades
+
+## Resources
+
+- [babel-traverse vulnerability details](https://github.com/advisories/GHSA-67hx-6x53-jw92)
+- [@ladjs/consolidate package](https://www.npmjs.com/package/@ladjs/consolidate)
+- [PNPM resolutions documentation](https://pnpm.io/package_json#resolutions)
+- [Ember CLI upgrade guide](https://cli.emberjs.com/release/)
+

package/CLAUDE.md

@@ -0,0 +1,122 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Development Commands
+
+### Prerequisites
+- Node.js (version specified in `.tool-versions`)
+- pnpm (package manager - enforced via `preinstall` script)
+
+### Installation and Setup
+```bash
+# Clone the repository
+git clone https://github.com/heroku/ember-hk-components
+cd ember-hk-components
+
+# Install dependencies (must use pnpm)
+pnpm install
+```
+
+### Development Server
+```bash
+# Start development server
+ember serve
+# or
+pnpm start
+
+# Visit app at http://localhost:4200
+```
+
+### Testing
+```bash
+# Run all tests
+pnpm test              # Runs ember test
+ember test             # Direct ember test command
+ember test --server    # Run tests in watch mode
+
+# Run compatibility tests across Ember versions
+pnpm run test:ember-compatibility
+# or
+ember try:each
+```
+
+### Linting
+```bash
+# Run all linting
+pnpm run lint          # Runs both JS and HBS linting
+
+# Individual linting commands
+pnpm run lint:js       # ESLint for JavaScript
+pnpm run lint:hbs      # ember-template-lint for Handlebars templates
+pnpm run lint:hbs:fix  # Auto-fix template lint issues
+```
+
+### Building
+```bash
+# Build the addon
+pnpm run build
+# or
+ember build
+```
+
+### Local Development with Another App
+```bash
+# In ember-hk-components directory
+pnpm link
+
+# In consuming app directory  
+pnpm link @heroku/ember-hk-components
+
+# To unlink
+pnpm unlink @heroku/ember-hk-components
+```
+
+## Architecture Overview
+
+### Project Type
+This is an **Ember addon** that provides reusable UI components for Heroku applications. It's built on Ember 3.28 (Octane edition) and assumes usage of the Purple3 CSS framework and Malibu icon system.
+
+### Key Dependencies
+- **Purple3 CSS Framework**: Required CSS framework for styling
+- **@heroku/ember-malibu-icon**: Icon system integration
+- **ember-freestyle**: Component showcase and documentation system
+- **ember-changeset**: Form state management
+- **ember-power-select**: Advanced select component
+
+### Directory Structure
+- `addon/`: Core addon code (components, services, etc.)
+- `addon/components/`: Reusable UI components (hk-button, hk-select, etc.)
+- `app/`: App-specific re-exports and styles
+- `app/styles/ember-hk-components/`: SCSS stylesheets for components
+- `tests/dummy/`: Demo application showcasing components
+- `tests/`: Test files
+
+### Component Architecture
+Components follow Ember Octane patterns with some legacy Classic components still present (migration in progress). Key component families:
+
+- **Form Components**: `hk-input`, `hk-select`, `hk-textarea`, `hk-form-group`
+- **UI Components**: `hk-button`, `hk-slide-panel`, `hk-well`
+- **Utility Components**: `async-button`, `hk-autofocus-input`, `hk-validation-errors-list`
+
+### CSS Integration
+Styles are organized per-component in `app/styles/ember-hk-components/`. Components can be imported individually or all at once:
+
+```scss
+// Import all components
+@import "ember-hk-components/ember-hk-components";
+
+// Import specific component
+@import "ember-hk-components/hk-slide-panel";
+```
+
+### Demo Application
+The `tests/dummy/` directory contains a demo application using ember-freestyle to showcase all components. This serves as both documentation and development environment.
+
+### Special Features
+- **Slide Panel**: Uses a special DOM insertion point (`#hk-slide-panels`) added via addon's `index.js`
+- **Accessibility**: Includes ember-a11y-testing for accessibility validation
+- **Validation**: Integrated with ember-changeset for form validation patterns
+
+### Legacy Considerations  
+The codebase is transitioning from Ember Classic to Octane patterns. ESLint is configured to warn about classic patterns in `app/` and `addon/` directories while maintaining compatibility.

package/CODEOWNERS

@@ -0,0 +1,5 @@
+# Lines starting with '#' are comments.
+# Each line is a file pattern followed by one or more owners.
+
+# These owners will be the default owners for everything in the repo.
+* @heroku/front-end