feat: Publish to pf npm

nicolethoen · web-flow · commit 328dbf993431 · 2025-11-21T10:48:29.000-05:00
diff --git a/.github/workflows/README.md b/.github/workflows/README.md
@@ -0,0 +1,92 @@
+# GitHub Actions Workflows
+
+This directory contains the CI/CD workflows for automatically releasing `@patternfly/context-for-ai` to NPM.
+
+## Workflows
+
+### build-lint-test.yml
+Runs on pull requests and pushes to main. This workflow:
+- Type checks the code
+- Runs ESLint
+- Runs Jest tests
+- Builds the distribution files
+
+### release.yml
+Runs on pushes to the `main` branch. This workflow:
+- Calls the build-lint-test workflow first
+- Uses semantic-release to automatically version and publish to NPM
+- Creates GitHub releases with changelogs
+
+## Required Secrets
+
+You need to set up the following secrets in your GitHub repository:
+
+### NPM_TOKEN
+1. Log in to npm and go to https://www.npmjs.com/settings/YOUR_USERNAME/tokens
+2. Click "Generate New Token" → "Classic Token"
+3. Select "Automation" type
+4. Copy the token
+5. In your GitHub repo, go to Settings → Secrets and variables → Actions
+6. Click "New repository secret"
+7. Name: `NPM_TOKEN`
+8. Value: Your npm token
+9. Click "Add secret"
+
+### GITHUB_TOKEN
+This is automatically provided by GitHub Actions, no setup needed.
+
+## Semantic Release
+
+The release process uses [semantic-release](https://semantic-release.gitbook.io/) which automates version management and package publishing based on commit messages.
+
+### Commit Message Format
+
+Use conventional commits to trigger releases:
+
+- `fix: ...` → Patch release (1.0.0 → 1.0.1)
+- `feat: ...` → Minor release (1.0.0 → 1.1.0)
+- `feat!: ...` or `BREAKING CHANGE:` in body → Major release (1.0.0 → 2.0.0)
+
+Examples:
+```
+fix: resolve button styling issue
+feat: add new Card component
+feat!: rename all component props (breaking change)
+```
+
+### First Release
+
+For your first release, you may want to run:
+```bash
+npm version 1.0.0
+git add package.json
+git commit -m "chore: initial release setup"
+git push
+```
+
+Or let semantic-release handle it automatically based on commits.
+
+## Testing Locally
+
+Before pushing to main, you can test the workflow:
+
+```bash
+# Run all checks locally
+npm run type-check
+npm run lint
+npm test
+npm run build
+```
+
+## Troubleshooting
+
+### Release not triggering
+- Ensure your commit messages follow the conventional commit format
+- Check the Actions tab in GitHub for error messages
+- Verify NPM_TOKEN is set correctly
+
+### NPM publish fails
+- Verify the package name `@patternfly/context-for-ai` is available/you have access
+- Ensure NPM_TOKEN has publish permissions
+- Check if you need to be added to the @patternfly organization on npm
+
diff --git a/.github/workflows/build-lint-test.yml b/.github/workflows/build-lint-test.yml
@@ -0,0 +1,47 @@
+name: Build, Lint, and Test
+
+on:
+  workflow_call:
+  pull_request:
+    branches:
+      - main
+  push:
+    branches:
+      - main
+
+jobs:
+  build-lint-test:
+    runs-on: ubuntu-latest
+    
+    steps:
+      - uses: actions/checkout@v4
+      
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+      
+      - name: Cache node modules
+        uses: actions/cache@v4
+        id: npm-cache
+        with:
+          path: node_modules
+          key: ${{ runner.os }}-node-20-${{ hashFiles('package-lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-node-20-
+      
+      - name: Install dependencies
+        if: steps.npm-cache.outputs.cache-hit != 'true'
+        run: npm ci
+      
+      - name: Run type check
+        run: npm run type-check
+      
+      - name: Run linter
+        run: npm run lint
+      
+      - name: Run tests
+        run: npm test
+      
+      - name: Build
+        run: npm run build
+
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
@@ -0,0 +1,59 @@
+name: Release
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  call-build-lint-test-workflow:
+    uses: ./.github/workflows/build-lint-test.yml
+
+  deploy:
+    runs-on: ubuntu-latest
+    needs: [call-build-lint-test-workflow]
+    env:
+      NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+      GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+    
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+          persist-credentials: false
+      
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          registry-url: 'https://registry.npmjs.org'
+      
+      - name: Cache node modules
+        uses: actions/cache@v4
+        id: npm-cache
+        with:
+          path: node_modules
+          key: ${{ runner.os }}-node-20-${{ hashFiles('package-lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-node-20-
+      
+      - name: Install dependencies
+        if: steps.npm-cache.outputs.cache-hit != 'true'
+        run: npm ci
+      
+      - name: Cache dist
+        uses: actions/cache@v4
+        id: dist
+        with:
+          path: dist
+          key: ${{ runner.os }}-dist-${{ hashFiles('package-lock.json', 'package.json', 'src/**/*', 'rollup.config.js', 'tsconfig.json') }}
+      
+      - name: Build dist
+        run: npm run build
+        if: steps.dist.outputs.cache-hit != 'true'
+      
+      - name: Release to NPM
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+        run: npx semantic-release
+
diff --git a/.releaserc.json b/.releaserc.json
@@ -0,0 +1,17 @@
+{
+  "branches": ["main"],
+  "plugins": [
+    "@semantic-release/commit-analyzer",
+    "@semantic-release/release-notes-generator",
+    "@semantic-release/npm",
+    [
+      "@semantic-release/git",
+      {
+        "assets": ["package.json"],
+        "message": "chore(release): ${nextRelease.version} [skip ci]\n\n${nextRelease.notes}"
+      }
+    ],
+    "@semantic-release/github"
+  ]
+}
+
diff --git a/README.md b/README.md
@@ -2,8 +2,8 @@
 
 > **⚠️ Important**: This is a **codemod tool only**. You do NOT need to import or use any library components. Simply install the package and run the codemod to transform your existing PatternFly components. The library code in this repository is for reference/development purposes only.
 
-**📦 Install from npm**: `npm install -D @kelseamann/semantic-ui-layer`  
-**🔗 Package**: [@kelseamann/semantic-ui-layer on npm](https://www.npmjs.com/package/@kelseamann/semantic-ui-layer)
+**📦 Install from npm**: `npm install -D @patternfly/context-for-ai`  
+**🔗 Package**: [@patternfly/context-for-ai on npm](https://www.npmjs.com/package/@patternfly/context-for-ai)
 
 A codemod tool that automatically adds standardized semantic `data-*` attributes to **all PatternFly components** in your codebase, making them AI-friendly and easier for AI tools to understand.
 
@@ -38,10 +38,10 @@ This tool transforms your existing PatternFly components by adding semantic meta
 Install from npm as a dev dependency (recommended):
 
 ```bash
-npm install -D @kelseamann/semantic-ui-layer
+npm install -D @patternfly/context-for-ai
 ```
 
-**📦 Package**: [@kelseamann/semantic-ui-layer on npm](https://www.npmjs.com/package/@kelseamann/semantic-ui-layer)
+**📦 Package**: [@patternfly/context-for-ai on npm](https://www.npmjs.com/package/@patternfly/context-for-ai)
 
 > **Note**:
 > - Installed as a dev dependency (`-D`) since it's only needed during development
@@ -55,23 +55,21 @@ You have two options:
 
 **Option A: Using npx with jscodeshift (recommended)**
 ```bash
-npx jscodeshift -t node_modules/@kelseamann/semantic-ui-layer/codemod/transform.js --extensions=ts,tsx,js,jsx --parser=tsx src/
+npx jscodeshift -t node_modules/@patternfly/context-for-ai/codemod/transform.js --extensions=ts,tsx,js,jsx --parser=tsx src/
 ```
 
 **Option B: Using the provided script**
 ```bash
-./node_modules/@kelseamann/semantic-ui-layer/codemod/add-semantic-attributes.sh src/
+./node_modules/@patternfly/context-for-ai/codemod/add-semantic-attributes.sh src/
 ```
 
-> **Note**: Option A uses `npx` which automatically downloads and runs jscodeshift without requiring a global install!
-
 ### Setup on a New Computer
 
 If you're setting up the codemod on a new computer:
 
 1. **Install Node.js** (if not already installed)
-2. **Install @kelseamann/semantic-ui-layer** in your project: `npm install -D @kelseamann/semantic-ui-layer`
-3. **Run the codemod** using `npx jscodeshift` (see options above)
+2. **Install @patternfly/context-for-ai** in your project: `npm install -D @patternfly/context-for-ai`
+3. **Run the codemod** using npx (recommended) or the bash script above
 
 The codemod is a standalone tool - you don't need to import or use any library components. It simply transforms your existing PatternFly components by adding semantic attributes.
 
@@ -97,22 +95,23 @@ Into:
   data-role="card"
   data-purpose="clickable"
   data-variant="default"
-  data-context="default"
+  data-context="page"
   data-state="active"
 >
   <CardBody
     data-role="card-body"
     data-purpose="display"
     data-variant="default"
-    data-context="default"
-    data-state="default"
+    data-context="page"
+    data-state="active"
   >
     <Button 
       variant="danger"
       data-role="button"
       data-purpose="action"
       data-variant="danger"
-      data-context="default"
+      data-context="page"
+      data-action-type="destructive"
       data-state="active"
     >
       Cancel
@@ -163,10 +162,10 @@ Every PatternFly component gets the same 7 attributes that appear on rendered DO
 Install the package from npm as a dev dependency:
 
 ```bash
-npm install -D @kelseamann/semantic-ui-layer
+npm install -D @patternfly/context-for-ai
 ```
 
-**📦 Package**: [@kelseamann/semantic-ui-layer on npm](https://www.npmjs.com/package/@kelseamann/semantic-ui-layer)
+**📦 Package**: [@patternfly/context-for-ai on npm](https://www.npmjs.com/package/@patternfly/context-for-ai)
 
 **Note**:
 - This installs the codemod tool as a dev dependency since it's only needed during development
@@ -182,15 +181,15 @@ npm install -D @kelseamann/semantic-ui-layer
 The codemod is distributed as an npm package. To check if you have the latest version:
 
 ```bash
-npm outdated @kelseamann/semantic-ui-layer
+npm outdated @patternfly/context-for-ai
 ```
 
 ### Updating the Codemod
 
 ```bash
-npm update @kelseamann/semantic-ui-layer
-# or for latest version
-npm install -D @kelseamann/semantic-ui-layer@latest
+npm update @patternfly/context-for-ai
+# or
+npm install -D @patternfly/context-for-ai@latest
 ```
 
 ### When to Re-run the Codemod
@@ -225,32 +224,32 @@ Check the commit history or GitHub releases to see what improvements were made i
 ### Transform Entire Directory
 
 ```bash
-npx jscodeshift -t node_modules/@kelseamann/semantic-ui-layer/codemod/transform.js --extensions=ts,tsx,js,jsx --parser=tsx src/
+jscodeshift -t node_modules/@patternfly/context-for-ai/codemod/transform.js --extensions=ts,tsx,js,jsx --parser=tsx src/
 ```
 
 ### Transform Specific File
 
 ```bash
-npx jscodeshift -t node_modules/@kelseamann/semantic-ui-layer/codemod/transform.js src/components/MyComponent.tsx
+jscodeshift -t node_modules/@patternfly/context-for-ai/codemod/transform.js src/components/MyComponent.tsx
 ```
 
 ### Preview Changes (Dry Run)
 
 ```bash
-npx jscodeshift -t node_modules/@kelseamann/semantic-ui-layer/codemod/transform.js --dry src/
+jscodeshift -t node_modules/@patternfly/context-for-ai/codemod/transform.js --dry src/
 ```
 
 ### Using the Bash Script
 
 ```bash
 # Transform all files in src/
-./node_modules/@kelseamann/semantic-ui-layer/codemod/add-semantic-attributes.sh src/
+./node_modules/@patternfly/context-for-ai/codemod/add-semantic-attributes.sh src/
 
 # Transform a specific file
-./node_modules/@kelseamann/semantic-ui-layer/codemod/add-semantic-attributes.sh src/components/MyComponent.tsx
+./node_modules/@patternfly/context-for-ai/codemod/add-semantic-attributes.sh src/components/MyComponent.tsx
 
 # Transform current directory
-./node_modules/semantic-ui-layer/codemod/add-semantic-attributes.sh
+./node_modules/@patternfly/context-for-ai/codemod/add-semantic-attributes.sh
 ```
 
 ## Supported PatternFly Packages
@@ -587,8 +586,8 @@ If you're using this package, you should only use the codemod tool - ignore any
 
 ```bash
 # Clone the repository
-git clone https://github.com/kelseamann/semantic-UI.git
-cd semantic-ui-layer
+git clone https://github.com/patternfly/context-for-ai.git
+cd context-for-ai
 
 # Install dependencies
 npm install
diff --git a/package.json b/package.json
