summit-registration-lite 7.0.5 → 7.0.7

package/.claude/rules/summit-registration-lite-step-flow.md

@@ -1,77 +0,0 @@
-# Multi-Step Registration Flow
-
-## When to Apply
-
-Adding step-specific logic, modifying step transitions, or rendering step-dependent UI.
-
-## Step Constants
-
-Defined in `src/utils/constants.js`:
-
-```javascript
-export const STEP_SELECT_TICKET_TYPE = 0;  // Ticket selection + promo code
-export const STEP_PERSONAL_INFO = 1;       // Attendee details + ticket assignment
-export const STEP_PAYMENT = 2;             // Payment form (Stripe/LawPay)
-export const STEP_COMPLETE = 3;            // Order confirmation
-```
-
-## Step Transitions
-
-**Forward flow (happy path):**
-
-```
-STEP_SELECT_TICKET_TYPE → (Next/validate promo) → STEP_PERSONAL_INFO
-STEP_PERSONAL_INFO → (submit form) → reserveTicket → STEP_PAYMENT
-STEP_PAYMENT → (pay) → payTicketWithProvider → STEP_COMPLETE
-```
-
-**Special cases:**
-
-| Scenario | Transition |
-|----------|------------|
-| Free ticket (cost === 0) | `STEP_PERSONAL_INFO` → skip payment → `STEP_COMPLETE` |
-| Pre-paid ticket | `STEP_PERSONAL_INFO` → skip payment → `STEP_COMPLETE` |
-| Payment failure | `STEP_PAYMENT` → `removeReservedTicket()` → `STEP_PERSONAL_INFO` |
-| No ticket selected + back | Any step → `STEP_SELECT_TICKET_TYPE` |
-
-**Back navigation:**
-
-- From `STEP_PERSONAL_INFO`: `changeStep(step - 1)`
-- From `STEP_PAYMENT`: `removeReservedTicket()` (clears reservation, reducer resets to `STEP_PERSONAL_INFO`)
-
-## Redux Integration
-
-```javascript
-// Action
-export const changeStep = (step) => (dispatch, getState) => {
-    dispatch(createAction(CHANGE_STEP)(step));
-};
-
-// Reducer
-case CHANGE_STEP: {
-    return { ...state, step: payload };
-}
-```
-
-Default state: `step: STEP_SELECT_TICKET_TYPE`
-
-## Rendering Pattern
-
-In `registration-lite.js`, each step renders conditionally:
-
-```javascript
-<StepComponent isActive={step === STEP_SELECT_TICKET_TYPE} ... />
-<StepComponent isActive={step === STEP_PERSONAL_INFO} ... />
-<StepComponent isActive={step === STEP_PAYMENT} ... />
-{step === STEP_COMPLETE && <PurchaseCompleteComponent ... />}
-```
-
-- Steps 0-2 share layout with `ButtonBarComponent`
-- Step 3 (complete) has its own layout, no button bar
-- Button bar renders step-specific buttons based on current `step` value
-
-## Common Mistakes
-
-- Skipping `removeReservedTicket()` when going back from payment (leaves stale reservation)
-- Not checking `reservation` existence before allowing forward navigation
-- Adding steps without updating `ButtonBarComponent` (buttons won't render for new step)

package/.claude/rules/summit-registration-lite-testing.md

@@ -1,97 +0,0 @@
-# Testing Patterns
-
-## When to Apply
-
-Writing new component tests or maintaining existing tests.
-
-## Pattern
-
-**Test Structure:**
-
-```javascript
-import React from 'react';
-import { render, fireEvent, waitFor, screen } from '@testing-library/react';
-import '@testing-library/jest-dom';
-import ComponentName from '..';
-
-const mockCallback = jest.fn();
-
-afterEach(() => {
-    jest.clearAllMocks();  // Reset mocks between tests
-});
-
-it('describes expected behavior', () => {
-    const { getByTestId, getAllByTestId, queryByText } = render(
-        <ComponentName prop1={value1} callback={mockCallback} />
-    );
-
-    // Arrange: find elements
-    const button = getByTestId('button-id');
-
-    // Act: interact
-    fireEvent.click(button);
-
-    // Assert: verify outcome
-    expect(mockCallback).toHaveBeenCalledWith(expectedArg);
-});
-```
-
-**Common Queries:**
-
-```javascript
-// Single element (throws if not found)
-getByTestId('id')          // data-testid attribute
-getByText('text')          // visible text content
-getByRole('button')        // ARIA role
-
-// Multiple elements
-getAllByTestId('id')       // returns array
-
-// Nullable queries (returns null if not found)
-queryByText('text')        // useful for "expect().toBeFalsy()"
-
-// From screen utility
-screen.queryByText('text')
-```
-
-**Async Testing:**
-
-```javascript
-it('handles async behavior', async () => {
-    const { getByTestId } = render(<Component />);
-
-    fireEvent.click(getByTestId('async-button'));
-
-    await waitFor(() => {
-        expect(getByTestId('result')).toBeInTheDocument();
-    });
-});
-```
-
-## Key Points
-
-- Tests live in `__tests__/` directories alongside components
-- Use `data-testid` attributes for reliable element selection
-- Mock callbacks with `jest.fn()`, verify with `.toHaveBeenCalled()` or `.toHaveBeenCalledWith()`
-- Use `queryBy*` for negative assertions (`expect().toBeFalsy()`)
-- Use `getBy*` for positive assertions (throws if element missing)
-- `@testing-library/react` auto-cleanup enabled (no manual unmount needed)
-- CSS/SCSS mocked via `identity-obj-proxy` (className checks work)
-- Static assets (images) mocked via `src/__mocks__/fileMock.js`
-
-## Test Organization
-
-```
-src/components/my-component/
-├── index.js
-├── my-component.module.scss
-└── __tests__/
-    └── my-component.test.js
-```
-
-## Common Mistakes
-
-- Using brittle selectors (text content that changes) instead of `data-testid`
-- Forgetting `@testing-library/jest-dom` import (causes `.toBeInTheDocument()` to fail)
-- Not awaiting async operations (tests pass locally, fail in CI due to timing)
-- Testing implementation details instead of user behavior (prefer user interactions over internal state checks)

package/.claude/rules/summit-registration-lite-utils.md

@@ -1,71 +0,0 @@
-# Utility Functions
-
-## When to Apply
-
-Working with ticket pricing, order status checks, payment provider resolution, or UI color logic.
-
-## Key Functions (`src/utils/utils.js`)
-
-### Order/Ticket Status Checks
-
-```javascript
-isFreeOrder(reservation)        // reservation.amount === 0
-isPrePaidOrder(reservation)     // status === 'Paid' && payment_method === 'Offline'
-isPrePaidTicketType(ticketType) // ticketType.sub_type === 'PrePaid'
-hasDiscountApplied(ticketType)  // has cost_with_applied_discount !== cost
-```
-
-Used in payment providers to decide whether to skip the payment gateway.
-
-### Pricing Display
-
-```javascript
-getTicketCost(ticket, quantity)  // Returns JSX: strikethrough original + discounted price, or just price
-getTicketTaxes(ticket, taxes)    // Returns tax label string: " plus Tax A & Tax B"
-formatCurrency(amount, { currency })  // From helpers/ — locale-aware currency formatting
-```
-
-### Payment Provider Resolution
-
-```javascript
-getCurrentProvider(summit)
-// Iterates summit.payment_profiles for application_type === 'Registration'
-// Returns { publicKey, provider } — uses test vs live key based on test_mode_enabled
-```
-
-### UI Helpers
-
-```javascript
-getContrastingTextColor(bgColor, lightColor, darkColor)  // WCAG luminance contrast
-parseColor(input, element)       // Resolves CSS variables to RGB
-removeWhiteSpaces(value)         // Strip all whitespace
-isEmptyString(val)               // Trim-aware empty check
-```
-
-### Error Tracking
-
-```javascript
-handleSentryException(err)       // Sends to Sentry if window.SENTRY_DSN is set, else console.log
-```
-
-### Analytics
-
-```javascript
-buildTrackEvent(data, ticketQuantity, promoCode)
-// Builds GA4-style event data with currency, items_array, discount
-```
-
-## Helper Exports (`src/helpers/`)
-
-Barrel export from `src/helpers/index.js`:
-
-- `capitalizeFirstLetter` — text formatting
-- `formatCurrency` — locale-aware currency display
-- `formatErrorMessage` — error message normalization
-- `getTicketMaxQuantity` — ticket quantity constraints
-
-## Common Mistakes
-
-- Using `reservation.amount === 0` directly instead of `isFreeOrder()` (misses edge cases)
-- Forgetting `isPrePaidOrder()` check alongside `isFreeOrder()` in payment flows
-- Not handling `getCurrentProvider()` returning `{ publicKey: null, provider: '' }` when no payment profile exists

package/.claude/skills/summit-registration-lite-add-provider/SKILL.md

@@ -1,155 +0,0 @@
----
-name: summit-registration-lite-add-provider
-version: 1.0.0
-description: Scaffold new payment provider with factory registration
-triggers:
-  - add payment provider
-  - new payment gateway
-  - integrate payment
----
-
-# Add Payment Provider Workflow
-
-Scaffolds a new payment provider class with factory registration, error handling, and test template.
-
-## Steps
-
-1. **Ask for provider details**
-   - Provider name (e.g., "PayPal", "Square")
-   - Provider constant (e.g., "PAYMENT_PROVIDER_PAYPAL")
-   - Gateway-specific fields needed (API keys, client IDs, etc.)
-
-2. **Add constant to utils/constants.js**
-   ```javascript
-   export const PAYMENT_PROVIDER_NEWNAME = 'new_provider_name';
-   ```
-
-3. **Create provider class**
-   File: `src/utils/payment-providers/{name}-provider.js`
-
-   Use StripeProvider as template:
-   - Constructor receives: `{ reservation, summitId, userProfile, access_token, apiBaseUrl, dispatch }`
-   - Implement `payTicket` method with signature:
-     ```javascript
-     payTicket = ({ /* gateway-specific params */, onError = () => {} }) => async (dispatch) => {
-       // Implementation
-     }
-     ```
-   - Handle free/prepaid orders (skip gateway, call `/checkout` directly)
-   - Custom error handler for HTTP status codes (404 → VALIDATION, 500 → ERROR)
-   - Success flow: checkout → CLEAR_RESERVATION → changeStep(STEP_COMPLETE)
-   - Failure flow: removeReservedTicket → changeStep(STEP_PERSONAL_INFO)
-
-4. **Register in factory**
-   File: `src/utils/payment-providers/payment-provider-factory.js`
-
-   Add import and case:
-   ```javascript
-   import { NewProvider } from './new-provider';
-
-   case PAYMENT_PROVIDER_NEWNAME: {
-       currentProvider = new NewProvider({...params});
-       break;
-   }
-   ```
-
-5. **Add provider component** (if custom UI needed)
-   File: `src/components/{name}-component/index.js`
-
-   Handles gateway-specific UI (payment form, buttons, etc.).
-
-6. **Create test file**
-   File: `src/utils/payment-providers/__tests__/{name}-provider.test.js`
-
-   Mock patterns:
-   - Mock API calls (putRequest)
-   - Mock gateway SDK (if any)
-   - Test free/prepaid flow
-   - Test error handling
-
-7. **Update PaymentComponent**
-   File: `src/components/payment/index.js`
-
-   Add conditional rendering for new provider UI.
-
-## Provider Template
-
-```javascript
-import { createAction, putRequest, authErrorHandler } from 'openstack-uicore-foundation/lib/utils/actions';
-import { CLEAR_RESERVATION, PAY_RESERVATION } from '../../actions';
-import { changeStep, removeReservedTicket, startWidgetLoading, stopWidgetLoading } from '../../actions';
-import { isFreeOrder, isPrePaidOrder } from '../utils';
-import { ERROR_TYPE_ERROR, ERROR_TYPE_VALIDATION, STEP_COMPLETE, STEP_PERSONAL_INFO } from '../constants';
-
-export class NewProvider {
-    constructor({ reservation, summitId, userProfile, access_token, apiBaseUrl, dispatch }) {
-        this.reservation = reservation;
-        this.summitId = summitId;
-        this.userProfile = userProfile;
-        this.access_token = access_token;
-        this.apiBaseUrl = apiBaseUrl;
-        this.dispatch = dispatch;
-    }
-
-    payTicket = ({ /* custom params */, onError = () => {} }) => async (dispatch) => {
-        const errorHandler = (err, res) => (dispatch, state) => {
-            let code = err.status;
-            switch (code) {
-                case 404: onError({type: ERROR_TYPE_VALIDATION, msg: res.body.message, exception: null}); break;
-                case 500: onError({type: ERROR_TYPE_ERROR, msg: res.body.message, exception: null}); break;
-                default: authErrorHandler(err, res)(dispatch, state); break;
-            }
-        };
-
-        const normalizedEntity = {
-            billing_address_1: this.userProfile?.address1 || '',
-            billing_address_2: this.userProfile?.address2 || '',
-            billing_address_city: this.userProfile?.locality || '',
-            billing_address_state: this.userProfile?.region || '',
-            billing_address_country: this.userProfile?.country || ''
-        };
-
-        dispatch(startWidgetLoading());
-
-        // Free/prepaid orders
-        if (isFreeOrder(this.reservation) || isPrePaidOrder(this.reservation)) {
-            return this.checkout(normalizedEntity, errorHandler, onError);
-        }
-
-        // Gateway-specific payment flow here
-        // Then call this.checkout() on success
-    };
-
-    checkout = (normalizedEntity, errorHandler, onError) => {
-        const params = { access_token: this.access_token, expand: 'tickets,tickets.owner,...' };
-
-        return putRequest(
-            null,
-            createAction(PAY_RESERVATION),
-            `${this.apiBaseUrl}/api/v1/summits/${this.summitId}/orders/${this.reservation.hash}/checkout`,
-            normalizedEntity,
-            errorHandler
-        )(params)(this.dispatch)
-            .then((payload) => {
-                this.dispatch(stopWidgetLoading());
-                this.dispatch(createAction(CLEAR_RESERVATION)({}));
-                this.dispatch(changeStep(STEP_COMPLETE));
-                return payload;
-            })
-            .catch(e => {
-                this.dispatch(stopWidgetLoading());
-                this.dispatch(removeReservedTicket());
-                this.dispatch(changeStep(STEP_PERSONAL_INFO));
-                onError({type: ERROR_TYPE_ERROR, msg: e?.message, exception: e});
-                return e;
-            });
-    };
-}
-```
-
-## Testing
-
-Run provider tests:
-```bash
-yarn test payment-providers
-```

package/.claude/skills/summit-registration-lite-dev-setup/SKILL.md

@@ -1,67 +0,0 @@
----
-name: summit-registration-lite-dev-setup
-version: 1.0.0
-description: Clean install and start development server
-triggers:
-  - setup dev environment
-  - start dev server
-  - clean install
----
-
-# Development Setup Workflow
-
-Cleans existing installation and starts fresh development environment.
-
-## Steps
-
-### Option 1: Clean Setup (Recommended for Issues)
-
-1. **Clean all build artifacts and dependencies**
-   ```bash
-   yarn clean
-   ```
-   Removes `dist/` and `node_modules/`, then reinstalls with `yarn`.
-
-2. **Start dev server**
-   ```bash
-   yarn serve
-   ```
-   Starts webpack-dev-server on default port (usually 8080). Opens browser automatically.
-
-### Option 2: Quick Start (No Clean)
-
-1. **Install dependencies** (if `node_modules/` missing)
-   ```bash
-   yarn
-   ```
-
-2. **Start dev server**
-   ```bash
-   yarn serve
-   ```
-
-## Development Configuration
-
-- **Webpack config:** `webpack.dev.js` (extends `webpack.common.js`)
-- **Environment variables:**
-  - `API_BASE_URL` - API endpoint for development
-  - `ACCESS_TOKEN` - Auth token for standalone testing (stored in localStorage)
-
-Set these in shell or `.env` file:
-```bash
-export API_BASE_URL=https://api.dev.example.com
-export ACCESS_TOKEN=your_dev_token
-```
-
-## Standalone Testing
-
-The widget supports standalone mode in development. Set environment variables before running `yarn serve` to test without parent app.
-
-## Troubleshooting
-
-| Issue | Solution |
-|-------|----------|
-| Port already in use | Kill process: `lsof -ti:8080 | xargs kill` or change port in webpack.dev.js |
-| Stale cache | Run `yarn clean` |
-| Module not found | Delete `node_modules/` and `yarn.lock`, then `yarn` |
-| Hot reload not working | Check webpack-dev-server config, ensure `watchFiles` configured |

package/.claude/skills/summit-registration-lite-publish/SKILL.md

@@ -1,64 +0,0 @@
----
-name: summit-registration-lite-publish
-version: 1.0.0
-description: Build and publish package to NPM registry
-triggers:
-  - publish to npm
-  - release package
-  - deploy widget
----
-
-# Package Publishing Workflow
-
-Builds the production bundle and publishes to NPM registry.
-
-## Steps
-
-1. **Verify clean state**
-   ```bash
-   git status
-   ```
-   Ensure no uncommitted changes. If changes exist, ask user to commit or stash first.
-
-2. **Verify version**
-   ```bash
-   cat package.json | grep '"version"'
-   ```
-   Confirm version with user before publishing. Ask if version should be bumped (patch/minor/major).
-
-3. **Build production bundle**
-   ```bash
-   yarn build
-   ```
-   Compiles with webpack.prod.js. Output goes to `dist/`.
-
-4. **Verify build output**
-   ```bash
-   ls -lh dist/
-   ```
-   Check that `index.js` and `index.css` exist.
-
-5. **Publish to NPM**
-   ```bash
-   yarn publish
-   ```
-   Prompts for new version (if not already updated). Requires NPM authentication.
-
-## Alternative: Combined Command
-
-The `yarn publish-package` script combines build and publish:
-```bash
-yarn publish-package
-```
-
-## Prerequisites
-
-- NPM authentication configured (`npm login`)
-- Write access to `summit-registration-lite` package on NPM
-- Clean git working directory (or committed changes)
-
-## Post-Publish
-
-- Tag the release in git: `git tag v{version}`
-- Push tag: `git push origin v{version}`
-- Update CHANGELOG.md with release notes

package/.claude/skills/summit-registration-lite-scaffold-component/SKILL.md

@@ -1,152 +0,0 @@
----
-name: summit-registration-lite-scaffold-component
-version: 1.0.0
-description: Create new component with folder structure, test file, and SCSS module
-triggers:
-  - create new component
-  - scaffold component
-  - add component
----
-
-# Component Scaffolding Workflow
-
-Creates a new React component with proper folder structure, SCSS module, and test boilerplate.
-
-## Steps
-
-1. **Ask for component details**
-   - Component name (PascalCase, e.g., "TicketSelector")
-   - Purpose/description
-   - Key props (if known)
-
-2. **Create directory structure**
-   ```
-   src/components/{component-name}/
-   ├── index.js
-   ├── {component-name}.module.scss
-   └── __tests__/
-       └── {component-name}.test.js
-   ```
-
-3. **Generate component file**
-   File: `src/components/{component-name}/index.js`
-
-   Template:
-   ```javascript
-   import React from 'react';
-   import PropTypes from 'prop-types';
-   import styles from './{component-name}.module.scss';
-
-   const ComponentName = ({ prop1, prop2 }) => {
-       return (
-           <div className={styles.container}>
-               {/* Component content */}
-           </div>
-       );
-   };
-
-   ComponentName.propTypes = {
-       prop1: PropTypes.string.isRequired,
-       prop2: PropTypes.func,
-   };
-
-   ComponentName.defaultProps = {
-       prop2: () => {},
-   };
-
-   export default ComponentName;
-   ```
-
-4. **Generate SCSS module**
-   File: `src/components/{component-name}/{component-name}.module.scss`
-
-   Template:
-   ```scss
-   .container {
-       // Component styles
-   }
-   ```
-
-5. **Generate test file**
-   File: `src/components/{component-name}/__tests__/{component-name}.test.js`
-
-   Template:
-   ```javascript
-   import React from 'react';
-   import { render, fireEvent, screen } from '@testing-library/react';
-   import '@testing-library/jest-dom';
-   import ComponentName from '..';
-
-   const mockCallback = jest.fn();
-
-   afterEach(() => {
-       jest.clearAllMocks();
-   });
-
-   describe('ComponentName', () => {
-       it('renders without crashing', () => {
-           const { getByTestId } = render(
-               <ComponentName prop1="test" prop2={mockCallback} />
-           );
-           expect(getByTestId('component-container')).toBeInTheDocument();
-       });
-
-       it('calls callback on interaction', () => {
-           const { getByTestId } = render(
-               <ComponentName prop1="test" prop2={mockCallback} />
-           );
-           fireEvent.click(getByTestId('test-button'));
-           expect(mockCallback).toHaveBeenCalled();
-       });
-   });
-   ```
-
-6. **Add data-testid attributes**
-   Remind user to add `data-testid` attributes to key elements for testing.
-
-## Component Conventions
-
-- **Props:** Use PropTypes for validation, provide defaultProps for optional props
-- **Styles:** Use CSS modules (`.module.scss`) for scoped styles
-- **Testing:** Use `data-testid` for reliable element selection
-- **Exports:** Default export for component, named exports for sub-components/utils if needed
-
-## Redux-Connected Components
-
-For components that need Redux state, use `connect`:
-
-```javascript
-import { connect } from 'react-redux';
-import { someAction } from '../../actions';
-
-const ComponentName = ({ stateValue, someAction }) => {
-    // Component implementation
-};
-
-const mapStateToProps = ({ registration }) => ({
-    stateValue: registration.stateValue,
-});
-
-export default connect(mapStateToProps, { someAction })(ComponentName);
-```
-
-## Testing Redux Components
-
-Wrap in Provider for testing:
-```javascript
-import { Provider } from 'react-redux';
-import { getStore } from '../../store';
-
-const renderWithStore = (component) => {
-    const store = getStore('test-client', 'http://api.test', () => 'mock-token');
-    return render(<Provider store={store}>{component}</Provider>);
-};
-```
-
-## Next Steps After Scaffolding
-
-1. Implement component logic
-2. Add styles
-3. Write tests (aim for key interactions)
-4. Import and use in parent component
-5. Verify in dev server