@capillarytech/blaze-ui 5.20.0 → 5.22.0

package/CapStatus/Status.md

@@ -1,40 +0,0 @@
-# Migration Status: CapStatus
-
-**Last Updated**: 2026-01-31 18:20:33
-
-## Migration Steps
-
-- [x] **Step 0**: Setup branch and remote tracking
-- [x] **Step 1**: Migration Prompt 1 (Main migration)
-- [x] **Step 2**: Migration Prompt 2 (Storybook support)
-- [x] **Step 3**: Migration Prompt 3 (Unit tests)
-- [x] **Step 4**: Migration Prompt 4 (Visual test cases)
-- [x] **Step 5**: Linting (ESLint)
-- [x] **Step 6**: Pre-build Validation
-- [x] **Step 7**: Build blaze-ui
-- [x] **Step 8**: Visual Testing
-- [x] **Step 9**: CSS Analysis (if mismatches found)
-- [x] **Step 9.5**: CSS Analysis Completed
-- [x] **Step 10**: Git Commit & Push to branch (pre-commit hook will run tests)
-- [x] **Step 11**: Create Pull Request
-
-## Visual Testing Results
-
-**Last Test**: 2026-01-31 18:20:33
-**Maximum Mismatch**: 0%
-
-### Mismatched Variants:
-- 
-
-
-## CSS Fixes Applied
-
-**Date**: 2026-01-31 12:18:54
-**Summary**: CSS fixes applied based on visual testing analysis.
-
-_See full analysis in: `/Users/sarahkhader/repos/migration/blaze-ui/tools/visual-testing/report/CapStatus/css-fix-analysis.md`_
-
-
-## Notes
-
-_No notes yet._

package/CapSteps/Status.md

@@ -1,40 +0,0 @@
-# Migration Status: CapSteps
-
-**Last Updated**: 2026-02-12 10:50:49
-
-## Migration Steps
-
-- [x] **Step 0**: Setup branch and remote tracking
-- [x] **Step 1**: Migration Prompt 1 (Main migration)
-- [x] **Step 2**: Migration Prompt 2 (Storybook support)
-- [x] **Step 3**: Migration Prompt 3 (Unit tests)
-- [x] **Step 4**: Migration Prompt 4 (Visual test cases)
-- [x] **Step 5**: Linting (ESLint)
-- [x] **Step 6**: Pre-build Validation
-- [] **Step 7**: Build blaze-ui
-- [] **Step 8**: Visual Testing
-- [] **Step 9**: CSS Analysis (if mismatches found)
-- [] **Step 9.5**: CSS Analysis Completed
-- [] **Step 10**: Git Commit & Push to branch (pre-commit hook will run tests)
-- [] **Step 11**: Create Pull Request
-
-## Visual Testing Results
-
-**Last Test**: 2026-02-12 10:50:49
-**Maximum Mismatch**: 0%
-
-### Mismatched Variants:
-- 
-
-
-## CSS Fixes Applied
-
-**Date**: 2026-01-27 04:07:39
-**Summary**: CSS fixes applied based on visual testing analysis.
-
-_See full analysis in: `/Users/sarahkhader/repos/migration/blaze-ui/tools/visual-testing/report/CapSteps/css-fix-analysis.md`_
-
-
-## Notes
-
-_No notes yet._

package/CapStepsAccordian/README.md

@@ -1,305 +0,0 @@
-# CapStepsAccordian Component
-
-A steps-based accordion component built on Ant Design Collapse, featuring numbered steps with completion and error states.
-
-## Migration from Ant Design v3 to v6
-
-### Summary of Changes
-
-This component has been migrated from Ant Design v3 to v6 with the following improvements:
-
-1. **TypeScript Conversion**
-   - Converted from JavaScript to TypeScript
-   - Added comprehensive TypeScript interfaces in `types.ts`
-   - Replaced PropTypes with TypeScript types
-   - Proper type exports for component and item interfaces
-
-2. **Ant Design v6 Migration**
-   - Updated to use `antd-v5` (Ant Design v6)
-   - Replaced `Icon` component with `CapIcon` component
-   - Icon rotation handled via `CapIcon`'s `rotate` prop with CSS transition
-   - Updated Collapse API usage
-
-3. **Styling Improvements**
-   - Removed all `.ant-` class selectors from SCSS
-   - Migrated border color to theme config (`getCapThemeConfig.ts`)
-   - Added wrapper classes for content padding
-   - Uses SCSS variables for spacing and colors
-
-### Breaking Changes
-
-**No breaking changes** - The component maintains backward compatibility with the previous API.
-
-### API Changes
-
-| Old API | New API | Notes |
-|---------|---------|-------|
-| `import { Icon } from 'antd'` | `import CapIcon from '../CapIcon'` | Icon component replaced with CapIcon |
-| `Icon type="caret-right" rotate={90}` | `CapIcon type="caret-right" rotate={90}` | Rotation handled via CapIcon's rotate prop |
-| `import { Collapse } from 'antd'` | `import { Collapse } from 'antd-v5'` | Updated import path |
-
-### Deprecated Props
-
-#### Cap Component Props
-
-**None** - All CapStepsAccordian-specific props (`items`, `showNumberSteps`, `isChevronIcon`, `className`) remain supported and unchanged.
-
-#### Ant Design Collapse Props
-
-This component passes through all Ant Design Collapse props via the `...collapseProps` spread. The following Ant Design Collapse props are deprecated in v6 but still supported for backward compatibility:
-
-| Deprecated Prop | Replacement | Ant Design Component | Status | Migration Example |
-|----------------|-------------|---------------------|--------|-------------------|
-| `visible` | `open` | Collapse | ⚠️ Deprecated | See example below |
-| `onVisibleChange` | `onOpenChange` | Collapse | ⚠️ Deprecated | See example below |
-| `destroyInactivePanel` | Removed (no replacement) | Collapse.Panel | ⚠️ Deprecated | Behavior removed in v6 |
-| `expandIconPosition` | Removed (no replacement) | Collapse | ⚠️ Deprecated | Use CSS to position expand icon |
-
-**Migration Examples:**
-
-**1. `visible` → `open` (Collapse component)**
-
-```tsx
-// ❌ Deprecated
-<CapStepsAccordian 
-  items={items} 
-  visible={true}
-  onVisibleChange={(visible) => console.log(visible)}
-/>
-
-// ✅ Recommended
-<CapStepsAccordian 
-  items={items} 
-  open={true}
-  onOpenChange={(open) => console.log(open)}
-/>
-```
-
-**2. `onVisibleChange` → `onOpenChange` (Collapse component)**
-
-```tsx
-// ❌ Deprecated
-<CapStepsAccordian 
-  items={items} 
-  onVisibleChange={(visible) => setVisible(visible)}
-/>
-
-// ✅ Recommended
-<CapStepsAccordian 
-  items={items} 
-  onOpenChange={(open) => setOpen(open)}
-/>
-```
-
-**3. `destroyInactivePanel` (Collapse.Panel - removed)**
-
-The `destroyInactivePanel` prop on `Collapse.Panel` has been removed in Ant Design v6. If you were using this prop, you'll need to handle panel content destruction manually if needed.
-
-```tsx
-// ❌ Deprecated (no longer supported)
-<CapStepsAccordian 
-  items={[
-    {
-      key: '1',
-      header: 'Panel 1',
-      content: <div>Content</div>,
-      destroyInactivePanel: true, // This prop is removed
-    }
-  ]}
-/>
-
-// ✅ Recommended
-// Remove the prop - Ant Design v6 handles panel lifecycle differently
-<CapStepsAccordian 
-  items={[
-    {
-      key: '1',
-      header: 'Panel 1',
-      content: <div>Content</div>,
-    }
-  ]}
-/>
-```
-
-**4. `expandIconPosition` (Collapse - removed)**
-
-The `expandIconPosition` prop has been removed in Ant Design v6. Use CSS to position the expand icon if needed.
-
-```tsx
-// ❌ Deprecated (no longer supported)
-<CapStepsAccordian 
-  items={items} 
-  expandIconPosition="right" // This prop is removed
-/>
-
-// ✅ Recommended
-// Use CSS classes or custom expandIcon to control position
-<CapStepsAccordian 
-  items={items} 
-  className="custom-collapse-position"
-/>
-```
-
-**Notes:**
-- Deprecated props will show console warnings in development mode when passed through `collapseProps`
-- The component uses Ant Design v6 Collapse API internally
-- All deprecated props are handled by Ant Design itself - the component passes them through directly
-- The component internally migrated from Ant Design's deprecated `Icon` component to `CapIcon` component. Icon rotation is handled via `CapIcon`'s `rotate` prop with CSS transition. This is an internal implementation detail and does not affect the component's public API.
-- For complete list of deprecated Collapse props, refer to the [Ant Design v6 Migration Guide](https://ant.design/docs/react/migration-v6)
-
-### Props
-
-| Prop Name | Type | Default | Description |
-|-----------|------|---------|-------------|
-| `items` | `CapStepsAccordianItem[]` | **Required** | Array of accordion items |
-| `showNumberSteps` | `boolean` | `true` | Whether to show numbered steps |
-| `isChevronIcon` | `boolean` | `undefined` | Whether to use chevron icon instead of caret icon |
-| `className` | `string` | `undefined` | Additional CSS class name |
-| `...rest` | `CollapseProps` | - | All standard Ant Design Collapse props |
-
-### CapStepsAccordianItem Interface
-
-| Property | Type | Description |
-|----------|------|-------------|
-| `header` | `React.ReactNode` | Header content for the accordion panel |
-| `key` | `string` | Unique key for the panel |
-| `content` | `React.ReactNode` | Content to display when panel is expanded |
-| `icon` | `React.ReactNode` | Optional custom icon to display instead of number step |
-| `completed` | `boolean` | Whether this step is completed (shows checkmark) |
-| `error` | `boolean` | Whether this step has an error (shows error icon) |
-
-### Usage Examples
-
-#### Basic Usage
-
-```tsx
-import { CapStepsAccordian } from '@capillarytech/blaze-ui';
-
-function MyComponent() {
-  const items = [
-    {
-      key: '1',
-      header: 'Step 1: Setup',
-      content: <div>Setup content here</div>,
-    },
-    {
-      key: '2',
-      header: 'Step 2: Configuration',
-      content: <div>Configuration content here</div>,
-    },
-  ];
-
-  return <CapStepsAccordian items={items} />;
-}
-```
-
-#### With Completed Steps
-
-```tsx
-import { CapStepsAccordian } from '@capillarytech/blaze-ui';
-
-function MyComponent() {
-  const items = [
-    {
-      key: '1',
-      header: 'Step 1: Setup',
-      content: <div>Setup content</div>,
-      completed: true,
-    },
-    {
-      key: '2',
-      header: 'Step 2: Configuration',
-      content: <div>Configuration content</div>,
-      error: true,
-    },
-    {
-      key: '3',
-      header: 'Step 3: Review',
-      content: <div>Review content</div>,
-    },
-  ];
-
-  return <CapStepsAccordian items={items} showNumberSteps={true} />;
-}
-```
-
-#### With Custom Icons
-
-```tsx
-import { CapStepsAccordian } from '@capillarytech/blaze-ui';
-import { UserOutlined } from '@ant-design-v5/icons';
-
-function MyComponent() {
-  const items = [
-    {
-      key: '1',
-      header: 'User Setup',
-      content: <div>User setup content</div>,
-      icon: <UserOutlined />,
-    },
-  ];
-
-  return <CapStepsAccordian items={items} showNumberSteps={false} />;
-}
-```
-
-#### With Chevron Icons
-
-```tsx
-import { CapStepsAccordian } from '@capillarytech/blaze-ui';
-
-function MyComponent() {
-  const items = [
-    {
-      key: '1',
-      header: 'Step 1',
-      content: <div>Content</div>,
-    },
-  ];
-
-  return <CapStepsAccordian items={items} isChevronIcon={true} />;
-}
-```
-
-#### Without Numbered Steps
-
-```tsx
-import { CapStepsAccordian } from '@capillarytech/blaze-ui';
-
-function MyComponent() {
-  const items = [
-    {
-      key: '1',
-      header: 'Section 1',
-      content: <div>Content</div>,
-    },
-  ];
-
-  return <CapStepsAccordian items={items} showNumberSteps={false} />;
-}
-```
-
-### Theme Configuration
-
-The component uses Ant Design v6's theme system. Border colors are configured via `getCapThemeConfig.ts`:
-
-```typescript
-components: {
-  Collapse: {
-    colorBorder: '#dfe2e7', // CAP_G07
-  },
-}
-```
-
-### Styling Notes
-
-- Content padding is handled via wrapper classes (40px default, 58px with steps)
-- Number step icons use circular backgrounds with completion/error states
-- Border styles are handled via Ant Design theme tokens
-- All custom styles use component-specific classes (no `.ant-` selectors)
-
-### Migration Notes
-
-- Icon rotation is now handled via CSS `transform` instead of the `rotate` prop
-- Content padding is applied via wrapper divs instead of targeting Ant Design internal classes
-- Border colors are configured via theme tokens instead of SCSS overrides

package/CapStepsAccordian/Status.md

@@ -1,48 +0,0 @@
-# Migration Status: CapStepsAccordian
-
-**Last Updated**: 2026-01-31 21:08:56
-
-## Migration Steps
-
-- [x] **Step 0**: Setup branch and remote tracking
-- [x] **Step 1**: Migration Prompt 1 (Main migration)
-- [x] **Step 1.5**: Export component in blaze-ui/components/index.ts
-- [x] **Step 2**: Migration Prompt 2 (Storybook support)
-- [x] **Step 3**: Migration Prompt 3 (Unit tests)
-- [x] **Step 4**: Migration Prompt 4 (Visual test cases)
-- [x] **Step 5**: Linting (ESLint)
-- [x] **Step 6**: Pre-build Validation
-- [x] **Step 7**: Build blaze-ui
-- [x] **Step 8**: Visual Testing
-- [x] **Step 9**: CSS Analysis (if mismatches found)
-- [x] **Step 9.5**: CSS Analysis Completed
-- [x] **Step 10**: Git Commit & Push to branch (pre-commit hook will run tests)
-- [x] **Step 11**: Create Pull Request
-
-## Visual Testing Results
-
-**Last Test**: 2026-01-31 21:07:54
-**Maximum Mismatch**: 94.05%
-
-### Mismatched Variants:
-- default:2.55%
-- selected:2.48%
-- completed:3.74%
-- error:3.77%
-- with-icon:94.05%
-- chevron-icon:2.50%
-- panel-open (with 2 interactions):2.53%
-
-
-## CSS Fixes Applied
-
-**Date**: 2026-01-31 21:07:54
-**Summary**: CSS fixes applied based on visual testing analysis.
-
-_See full analysis in: `/Users/sarahkhader/repos/migration/blaze-ui/tools/visual-testing/report/CapStepsAccordian/css-fix-analysis.md`_
-
-
-## Notes
-
-_No notes yet._
-

package/CapSupportVideosWrapper/README.md

@@ -1,14 +0,0 @@
-# CapSupportVideosWrapper
-
-A wrapper component that injects support video and help link elements into the DOM and provides a resizable Picture-in-Picture (PIP) video player.
-
-# Breaking Changes
-
-No breaking changes.
-
-### No Ant Design Breaking Changes
-
-This component does not use any Ant Design components, so there are no v3→v6 breaking changes to handle. The component uses:
-- Custom Cap UI components (CapRow, CapColumn, CapIcon, CapHeading, CapTooltip)
-- Third-party libraries (react-rnd, react-draggable, styled-components)
-- Vanilla DOM manipulation for content injection