@capillarytech/blaze-ui 5.20.0 → 5.22.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CapAskAira/CapAiMediaGeneration/saga.js +1446 -0
- package/CapAskAira/CapAiMediaGeneration/saga.js.map +1 -0
- package/CapCollapsibleLeftNavigation/saga.js +1441 -0
- package/CapCollapsibleLeftNavigation/saga.js.map +1 -0
- package/CapLanguageProvider/actions.js +125 -0
- package/CapLanguageProvider/actions.js.map +1 -0
- package/CapLanguageProvider/constants.js +37 -0
- package/CapLanguageProvider/constants.js.map +1 -0
- package/CapLanguageProvider/reducer.js +130 -0
- package/CapLanguageProvider/reducer.js.map +1 -0
- package/CapLanguageProvider/saga.js +1457 -0
- package/CapLanguageProvider/saga.js.map +1 -0
- package/CapLanguageProvider/selector.js +186 -0
- package/CapLanguageProvider/selector.js.map +1 -0
- package/CapSupportVideosWrapper/utils.js +34 -0
- package/CapSupportVideosWrapper/utils.js.map +1 -0
- package/package.json +1 -1
- package/CapActionBar/README.md +0 -11
- package/CapAdvancedIcon/README.md +0 -185
- package/CapAdvancedIcon/use-cases.md +0 -44
- package/CapAlert/README.md +0 -144
- package/CapAppNotEnabled/README.md +0 -84
- package/CapAskAira/README.md +0 -328
- package/CapBanner/README.md +0 -4
- package/CapBlock/README.md +0 -175
- package/CapBorderedBox/Status.md +0 -40
- package/CapCSVFileUploader/README.md +0 -124
- package/CapCSVFileUploader/Status.md +0 -47
- package/CapCard/README.md +0 -85
- package/CapCard/Status.md +0 -41
- package/CapCardBox/README.md +0 -169
- package/CapCardBox/Status.md +0 -52
- package/CapCarousel/README.md +0 -190
- package/CapCarousel/Status.md +0 -73
- package/CapCheckbox/README.md +0 -254
- package/CapCheckbox/Status.md +0 -41
- package/CapColorPicker/README.md +0 -112
- package/CapColorPicker/Status.md +0 -52
- package/CapColorPicker/tests/USE_CASES_ANALYSIS.md +0 -92
- package/CapColoredTag/README.md +0 -167
- package/CapColoredTag/Status.md +0 -49
- package/CapConditionPreview/MIGRATION_ANALYSIS.md +0 -70
- package/CapConditionPreview/README.md +0 -40
- package/CapConditionPreview/tests/USE_CASES_CapConditionPreview.md +0 -65
- package/CapCustomCard/README.md +0 -182
- package/CapCustomCard/Status.md +0 -40
- package/CapCustomCarousel/Status.md +0 -69
- package/CapCustomCheckboxList/README.md +0 -178
- package/CapCustomCheckboxList/Status.md +0 -52
- package/CapCustomCheckboxList/tests/USE_CASES_ANALYSIS.md +0 -174
- package/CapCustomList/README.md +0 -117
- package/CapCustomList/Status.md +0 -77
- package/CapCustomList/tests/USE_CASES_ANALYSIS.md +0 -124
- package/CapCustomSelect/README.md +0 -38
- package/CapDatePicker/README.md +0 -139
- package/CapDateRangePicker/README.md +0 -159
- package/CapDateTimePicker/README.md +0 -136
- package/CapDateTimeRangePicker/README.md +0 -243
- package/CapDivider/README.md +0 -122
- package/CapDrawer/README.md +0 -207
- package/CapDrawer/Status.md +0 -52
- package/CapDrawer/tests/MISSING_USE_CASES.md +0 -170
- package/CapDropdown/README.md +0 -515
- package/CapDropdown/Status.md +0 -45
- package/CapDropdown/tests/USE_CASES_ANALYSIS.md +0 -137
- package/CapError/README.md +0 -88
- package/CapErrorBoundary/CapErrorBoundary-use-cases.md +0 -89
- package/CapErrorBoundary/README.md +0 -150
- package/CapErrorStateIllustration/README.md +0 -222
- package/CapErrorStateIllustration/USE_CASES.md +0 -33
- package/CapExpressionEditor/README.md +0 -32
- package/CapForm/README.md +0 -132
- package/CapForm/Status.md +0 -40
- package/CapForm/tests/PHASE1_UNFULFILLED_USE_CASES.md +0 -113
- package/CapForm/tests/USE_CASES_ANALYSIS.md +0 -119
- package/CapFormItem/README.md +0 -320
- package/CapFormItem/Status.md +0 -73
- package/CapFormItem/tests/USE_CASES_ANALYSIS.md +0 -84
- package/CapGraph/README.md +0 -69
- package/CapGraph/USE_CASES.md +0 -66
- package/CapHamburgerMenu/README.md +0 -234
- package/CapHamburgerMenu/USE_CASES.md +0 -48
- package/CapHeader/Status.md +0 -41
- package/CapHeading/README.md +0 -220
- package/CapHeading/Status.md +0 -41
- package/CapIcon/README.md +0 -207
- package/CapIllustration/Status.md +0 -41
- package/CapImage/README.md +0 -50
- package/CapImportMFEComponent/README.md +0 -121
- package/CapInfoNote/Status.md +0 -40
- package/CapInfoNote/tests/USE_CASES_ANALYSIS.md +0 -114
- package/CapInput/README.md +0 -196
- package/CapInput/Status.md +0 -123
- package/CapInput/tests/USE_CASES_ANALYSIS.md +0 -169
- package/CapLanguageProvider/CapLanguageProvider-use-cases.md +0 -56
- package/CapLanguageProvider/README.md +0 -206
- package/CapLevelGraphRenderer/CapLevelGraphRenderer-test-cases.md +0 -50
- package/CapLevelGraphRenderer/README.md +0 -123
- package/CapLevelGraphRenderer/Tooltip_MIGRATION_ANALYSIS.md +0 -120
- package/CapLink/README.md +0 -203
- package/CapLink/Status.md +0 -32
- package/CapLink/tests/CapLink.missingUseCases.md +0 -95
- package/CapList/README.md +0 -129
- package/CapList/Status.md +0 -69
- package/CapListLayout/README.md +0 -7
- package/CapLogin/README.md +0 -7
- package/CapMenu/README.md +0 -86
- package/CapModal/README.md +0 -357
- package/CapModal/Status.md +0 -52
- package/CapModal/tests/USE_CASES_GAPS.md +0 -207
- package/CapMultiSelect/README.md +0 -170
- package/CapMultiSelect/tests/USE_CASES_ANALYSIS.md +0 -29
- package/CapMultiSelectDatePicker/README.md +0 -11
- package/CapNavigation/README.md +0 -72
- package/CapNotification/README.md +0 -228
- package/CapNotificationDropdown/README.md +0 -5
- package/CapPopover/README.md +0 -234
- package/CapProgress/Status.md +0 -40
- package/CapRadio/Status.md +0 -54
- package/CapRadioButton/README.md +0 -152
- package/CapRadioButton/Status.md +0 -70
- package/CapRadioButton/tests/USE_CASES_ANALYSIS.md +0 -120
- package/CapRadioCard/README.md +0 -161
- package/CapRadioCard/Status.md +0 -78
- package/CapRadioGroup/README.md +0 -141
- package/CapRadioGroup/Status.md +0 -59
- package/CapReorderComponent/README.md +0 -179
- package/CapReorderComponent/Status.md +0 -41
- package/CapRoadMap/README.md +0 -126
- package/CapRoadMap/Status.md +0 -53
- package/CapRoadMap/tests/USE_CASE_GAPS.md +0 -92
- package/CapRow/README.md +0 -424
- package/CapSKUUploader/README.md +0 -189
- package/CapSKUUploader/Status.md +0 -66
- package/CapSecondaryTopBar/README.md +0 -7
- package/CapSelect/README.md +0 -243
- package/CapSelectFilter/README.md +0 -121
- package/CapShape/README.md +0 -96
- package/CapShape/Status.md +0 -36
- package/CapShape/tests/USE_CASES_ANALYSIS.md +0 -120
- package/CapSideBar/README.md +0 -298
- package/CapSideBar/Status.md +0 -5
- package/CapSlideBox/README.md +0 -68
- package/CapSlider/README.md +0 -423
- package/CapSlider/Status.md +0 -48
- package/CapSlider/tests/TEST_COVERAGE.md +0 -118
- package/CapSnackBar/README.md +0 -222
- package/CapSnackBar/Status.md +0 -41
- package/CapSomethingWentWrong/README.md +0 -97
- package/CapSplit/README.md +0 -19
- package/CapStatisticCard/README.md +0 -138
- package/CapStatus/README.md +0 -148
- package/CapStatus/Status.md +0 -40
- package/CapSteps/Status.md +0 -40
- package/CapStepsAccordian/README.md +0 -305
- package/CapStepsAccordian/Status.md +0 -48
- package/CapSupportVideosWrapper/README.md +0 -14
- package/CapSwitch/README.md +0 -351
- package/CapTab/README.md +0 -406
- package/CapTab/Status.md +0 -104
- package/CapTab/tests/USE_CASE_GAPS.md +0 -143
- package/CapTabV3/ANALYSIS.md +0 -60
- package/CapTabV3/README.md +0 -156
- package/CapTabV3/Status.md +0 -52
- package/CapTabV3/tests/USE_CASE_GAPS.md +0 -149
- package/CapTable/README.md +0 -160
- package/CapTable/Status.md +0 -41
- package/CapTag/README.md +0 -16
- package/CapTagDropdown/README.md +0 -171
- package/CapTagDropdown/Status.md +0 -55
- package/CapTimePicker/README.md +0 -170
- package/CapTooltip/README.md +0 -336
- package/CapTooltipWithInfo/Status.md +0 -75
- package/CapTopBar/README.md +0 -146
- package/CapTree/README.md +0 -124
- package/CapTree/Status.md +0 -48
- package/CapTree/tests/STATUS.md +0 -154
- package/CapTreeSelect/README.md +0 -217
- package/CapTreeSelect/Status.md +0 -52
- package/CapTruncateList/README.md +0 -13
- package/CapUnifiedSelect/README.md +0 -40
- package/CapUploader/README.md +0 -313
- package/CapUploader/Status.md +0 -76
- package/CapUploader/tests/USE_CASES_ANALYSIS.md +0 -225
- package/CapUserProfile/README.md +0 -105
- package/CapUserProfile/Status.md +0 -95
- package/CapVirtualList/README.md +0 -162
- package/CapVirtualList/Status.md +0 -71
- package/assets/HOCs/ComponentWithLabelHOC/README.md +0 -230
package/CapTabV3/ANALYSIS.md
DELETED
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
# Analysis Report for CapTabV3
|
|
2
|
-
|
|
3
|
-
## 1. Antd Style Overrides Found
|
|
4
|
-
|
|
5
|
-
| Line # | Old Override | Token Path | Token Value |
|
|
6
|
-
|--------|-------------|------------|-------------|
|
|
7
|
-
| 8 | `.ant-tabs-nav .ant-tabs-tab { padding: $CAP_SPACE_12 $CAP_SPACE_16 }` | `components.Tabs.itemPadding` | `'12px 16px'` (0.857rem 1.142rem) |
|
|
8
|
-
| 9 | `.ant-tabs-nav .ant-tabs-tab { font-weight: $FONT_WEIGHT_MEDIUM }` | `components.Tabs.itemFontWeight` | `500` |
|
|
9
|
-
| 10 | `.ant-tabs-nav .ant-tabs-tab { color: $FONT_COLOR_02 }` | `components.Tabs.colorText` | `#5e6c84` (already set) |
|
|
10
|
-
| 13 | `.ant-tabs-nav .ant-tabs-tab-active { color: $FONT_COLOR_01 }` | `components.Tabs.itemActiveColor` | `#091e42` (already set) |
|
|
11
|
-
| 16 | `.ant-tabs-nav .ant-tabs-tab:hover { color: $FONT_COLOR_01 }` | `components.Tabs.itemHoverColor` | `#091e42` (already set) |
|
|
12
|
-
| 17 | `.ant-tabs-nav .ant-tabs-tab:hover { background-color: #faf9f4 }` | `components.Tabs.itemHoverBg` | `#faf9f4` |
|
|
13
|
-
| 23 | `.ant-tabs-tab-disabled.ant-tabs-tab-active { color: $FONT_COLOR_03 }` | `components.Tabs.itemSelectedColorDisabled` | `#97a0af` |
|
|
14
|
-
| 25 | `.ant-tabs-tab-disabled { color: $FONT_COLOR_04 }` | `components.Tabs.colorTextDisabled` | `#b3bac5` (needs override) |
|
|
15
|
-
| 33 | `.ant-tabs-card .ant-tabs-tab-active { color: $FONT_COLOR_01 }` | `components.Tabs.itemSelectedColor` | `#091e42` (already set) |
|
|
16
|
-
| 37 | `.ant-tabs-ink-bar { background-color: $CAP_G01 }` | `components.Tabs.inkBarColor` | `#091e42` (already set) |
|
|
17
|
-
|
|
18
|
-
**Total overrides found**: 10
|
|
19
|
-
**New tokens needed**: `itemPadding`, `itemFontWeight`, `itemHoverBg`, `itemSelectedColorDisabled`, `colorTextDisabled` override
|
|
20
|
-
|
|
21
|
-
## 2. API Breaking Changes
|
|
22
|
-
|
|
23
|
-
**CRITICAL**: Reference `MIGRATION_CHANGELOG_TEMPLATE.md` for Ant Design prop deprecations.
|
|
24
|
-
|
|
25
|
-
| Old API | New API | Affected Props | Source |
|
|
26
|
-
|---------|---------|----------------|--------|
|
|
27
|
-
| `tabPosition` | `tabPlacement` | `tabPosition` prop | Ant Design v6 Tabs API |
|
|
28
|
-
| `TabPane` children | `items` prop | Internal implementation | Ant Design v6 Tabs API |
|
|
29
|
-
|
|
30
|
-
**Reference**: Ant Design v6 Tabs component uses `tabPlacement` instead of `tabPosition`, and `items` prop instead of `TabPane` children.
|
|
31
|
-
|
|
32
|
-
## 3. Backward Compatibility Plan
|
|
33
|
-
|
|
34
|
-
**CRITICAL**: Follow the format in `MIGRATION_CHANGELOG_TEMPLATE.md` for documenting deprecated props.
|
|
35
|
-
|
|
36
|
-
| Deprecated Prop | Replacement | Fallback Logic | Documentation Source |
|
|
37
|
-
|----------------|-------------|----------------|----------------------|
|
|
38
|
-
| `tabPosition` | `tabPlacement` | `tabPlacement ?? tabPosition` with value mapping (`left` → `start`, `right` → `end`) | Ant Design v6 Tabs API |
|
|
39
|
-
|
|
40
|
-
**Reference**: The component already implements backward compatibility for `tabPosition` prop with value mapping.
|
|
41
|
-
|
|
42
|
-
## 4. Type Definitions Needed
|
|
43
|
-
|
|
44
|
-
- ✅ `CapTabV3Props` - Already exists in types.ts
|
|
45
|
-
- ✅ `TabPaneData` - Already exists in types.ts
|
|
46
|
-
- ✅ `DeprecatedTabPosition` - Already exists in types.ts
|
|
47
|
-
|
|
48
|
-
All required types are already defined in types.ts.
|
|
49
|
-
|
|
50
|
-
## 5. DOM Structure Analysis (CRITICAL)
|
|
51
|
-
|
|
52
|
-
- **Original DOM structure**: Based on current implementation, the component wraps `Tabs` in a `Row` component with className `cap-tab-v3-wrapper`
|
|
53
|
-
- **Wrapper elements**: `Row` wrapper exists in current implementation
|
|
54
|
-
- **Component hierarchy**: `Row` → `Tabs` (with className `cap-tab-v3`)
|
|
55
|
-
- **Planned changes**:
|
|
56
|
-
- Remove `Row` wrapper if it wasn't in original (need to verify original component)
|
|
57
|
-
- Keep `Tabs` component structure
|
|
58
|
-
- Preserve className handling
|
|
59
|
-
|
|
60
|
-
**Note**: Need to verify if `Row` wrapper existed in original cap-ui-library component. If not, it should be removed to preserve exact DOM structure.
|
package/CapTabV3/README.md
DELETED
|
@@ -1,156 +0,0 @@
|
|
|
1
|
-
# CapTabV3
|
|
2
|
-
|
|
3
|
-
CapTabV3 component migrated from Ant Design v3 to v6.
|
|
4
|
-
|
|
5
|
-
## Migration Summary
|
|
6
|
-
|
|
7
|
-
This component has been migrated to use Ant Design v6 APIs and design tokens.
|
|
8
|
-
|
|
9
|
-
## Breaking Changes
|
|
10
|
-
|
|
11
|
-
**No breaking changes** - The component maintains **100% backward compatibility** with existing code. Deprecated Ant Design APIs (`tabPosition` prop) continue to work exactly as before. However, deprecated APIs will show console warnings in development mode and should be migrated to the new API for future compatibility.
|
|
12
|
-
|
|
13
|
-
## Deprecated Props
|
|
14
|
-
|
|
15
|
-
The following Ant Design component APIs are deprecated but still supported for backward compatibility:
|
|
16
|
-
|
|
17
|
-
### `tabPosition` (Ant Design Tabs Component)
|
|
18
|
-
|
|
19
|
-
- **Status:** ⚠️ Deprecated
|
|
20
|
-
- **Ant Design Component:** Tabs
|
|
21
|
-
- **Deprecated Prop:** `tabPosition`
|
|
22
|
-
- **Replacement:** Use `tabPlacement` prop instead
|
|
23
|
-
- **Migration:** Replace `tabPosition` with `tabPlacement` (note: `left` → `start`, `right` → `end`)
|
|
24
|
-
- **Removal:** Will be removed in next major version
|
|
25
|
-
|
|
26
|
-
**Before (Deprecated):**
|
|
27
|
-
|
|
28
|
-
```tsx
|
|
29
|
-
import CapTabV3 from '@capillarytech/blaze-ui';
|
|
30
|
-
|
|
31
|
-
<CapTabV3
|
|
32
|
-
panes={panes}
|
|
33
|
-
tabPosition="left"
|
|
34
|
-
/>
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
**After (Recommended):**
|
|
38
|
-
|
|
39
|
-
```tsx
|
|
40
|
-
import CapTabV3 from '@capillarytech/blaze-ui';
|
|
41
|
-
|
|
42
|
-
<CapTabV3
|
|
43
|
-
panes={panes}
|
|
44
|
-
tabPlacement="start"
|
|
45
|
-
/>
|
|
46
|
-
```
|
|
47
|
-
|
|
48
|
-
**Value Mapping:**
|
|
49
|
-
- `left` → `start`
|
|
50
|
-
- `right` → `end`
|
|
51
|
-
- `top` → `top` (unchanged)
|
|
52
|
-
- `bottom` → `bottom` (unchanged)
|
|
53
|
-
|
|
54
|
-
**Note:** A deprecation warning will be shown in development mode when using `tabPosition` instead of `tabPlacement`.
|
|
55
|
-
|
|
56
|
-
### Internal Implementation: `TabPane` Component (Ant Design Tabs Component)
|
|
57
|
-
|
|
58
|
-
- **Status:** ⚠️ Deprecated (Internal Implementation)
|
|
59
|
-
- **Ant Design Component:** Tabs
|
|
60
|
-
- **Deprecated API:** `TabPane` children pattern
|
|
61
|
-
- **Replacement:** Ant Design v6 uses `items` prop instead
|
|
62
|
-
- **Note:** This is an internal implementation detail. Consumers should continue using the `panes` prop as before. The component handles the conversion internally.
|
|
63
|
-
|
|
64
|
-
**Consumer Impact:** None - The component internally converts `panes` prop to the new `items` format. No changes required for consumers.
|
|
65
|
-
|
|
66
|
-
## Deprecated APIs Summary
|
|
67
|
-
|
|
68
|
-
| Deprecated API | Ant Design Component | Replacement | Removal Version |
|
|
69
|
-
|----------------|---------------------|-------------|----------------|
|
|
70
|
-
| `tabPosition` prop | Tabs | `tabPlacement` prop | Next major version |
|
|
71
|
-
| `TabPane` children (internal) | Tabs | `items` prop (internal) | Next major version |
|
|
72
|
-
|
|
73
|
-
## Backward Compatibility
|
|
74
|
-
|
|
75
|
-
- `tabPosition` prop is still accepted and automatically mapped to `tabPlacement`
|
|
76
|
-
- A deprecation warning will be shown in development mode when using `tabPosition`
|
|
77
|
-
- All existing code using `tabPosition` will continue to work without modifications
|
|
78
|
-
- The component internally handles conversion from `panes` prop to Ant Design v6 `items` format
|
|
79
|
-
|
|
80
|
-
## Prop Changes
|
|
81
|
-
|
|
82
|
-
| Prop | Status | Notes |
|
|
83
|
-
|------|--------|-------|
|
|
84
|
-
| `panes` | ✅ Unchanged | Array of tab panes with key, tab label, content, and optional disabled state |
|
|
85
|
-
| `activeKey` | ✅ Unchanged | Controlled active tab key |
|
|
86
|
-
| `onTabChange` | ✅ Unchanged | Callback function called when tab changes |
|
|
87
|
-
| `className` | ✅ Unchanged | Custom CSS class name |
|
|
88
|
-
| `tabPlacement` | ✅ New | Preferred prop name for tab placement (v6 API) |
|
|
89
|
-
| `tabPosition` | ⚠️ Deprecated | Use `tabPlacement` instead. Still supported for backward compatibility |
|
|
90
|
-
| All other Ant Design Tabs props | ✅ Unchanged | Passed through to underlying Tabs component |
|
|
91
|
-
|
|
92
|
-
## Migration Guide
|
|
93
|
-
|
|
94
|
-
1. **Replace `tabPosition` prop with `tabPlacement`:**
|
|
95
|
-
```tsx
|
|
96
|
-
// Before
|
|
97
|
-
<CapTabV3 panes={panes} tabPosition="left" />
|
|
98
|
-
|
|
99
|
-
// After
|
|
100
|
-
<CapTabV3 panes={panes} tabPlacement="start" />
|
|
101
|
-
```
|
|
102
|
-
|
|
103
|
-
2. **Update value mappings:**
|
|
104
|
-
- `left` → `start`
|
|
105
|
-
- `right` → `end`
|
|
106
|
-
- `top` → `top` (unchanged)
|
|
107
|
-
- `bottom` → `bottom` (unchanged)
|
|
108
|
-
|
|
109
|
-
3. **No changes required for `panes` prop** - The component handles internal conversion automatically.
|
|
110
|
-
|
|
111
|
-
## Usage Examples
|
|
112
|
-
|
|
113
|
-
### Basic Usage
|
|
114
|
-
|
|
115
|
-
```tsx
|
|
116
|
-
import CapTabV3 from '@capillarytech/blaze-ui';
|
|
117
|
-
|
|
118
|
-
<CapTabV3
|
|
119
|
-
panes={[
|
|
120
|
-
{
|
|
121
|
-
key: '1',
|
|
122
|
-
tab: 'Tab 1',
|
|
123
|
-
content: <div>Content for Tab 1</div>,
|
|
124
|
-
},
|
|
125
|
-
{
|
|
126
|
-
key: '2',
|
|
127
|
-
tab: 'Tab 2',
|
|
128
|
-
content: <div>Content for Tab 2</div>,
|
|
129
|
-
},
|
|
130
|
-
]}
|
|
131
|
-
/>
|
|
132
|
-
```
|
|
133
|
-
|
|
134
|
-
### With Tab Placement (v6 API)
|
|
135
|
-
|
|
136
|
-
```tsx
|
|
137
|
-
<CapTabV3
|
|
138
|
-
panes={panes}
|
|
139
|
-
tabPlacement="start"
|
|
140
|
-
/>
|
|
141
|
-
```
|
|
142
|
-
|
|
143
|
-
### Backward Compatibility
|
|
144
|
-
|
|
145
|
-
```tsx
|
|
146
|
-
// Old API still works (deprecated)
|
|
147
|
-
<CapTabV3 panes={panes} tabPosition="left" />
|
|
148
|
-
|
|
149
|
-
// New API (recommended)
|
|
150
|
-
<CapTabV3 panes={panes} tabPlacement="start" />
|
|
151
|
-
```
|
|
152
|
-
|
|
153
|
-
## References
|
|
154
|
-
|
|
155
|
-
- [Ant Design Tabs Component](https://ant.design/components/tabs)
|
|
156
|
-
- [Ant Design v6 Migration Guide](https://ant.design/docs/react/migration-v6)
|
package/CapTabV3/Status.md
DELETED
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
# Migration Status: CapTabV3
|
|
2
|
-
|
|
3
|
-
**Last Updated**: 2026-02-11 09:28:36
|
|
4
|
-
|
|
5
|
-
## Migration Steps
|
|
6
|
-
|
|
7
|
-
- [x] **Step 0**: Setup branch and remote tracking
|
|
8
|
-
- [x] **Step 1**: Migration Prompt 1 (Main migration)
|
|
9
|
-
- [x] **Step 1.5**: Export component in blaze-ui/components/index.ts
|
|
10
|
-
- [x] **Step 2**: Migration Prompt 2 (Storybook support)
|
|
11
|
-
- [x] **Step 2.5**: Verify deprecated props and prop changes (REQUIRED - enforced)
|
|
12
|
-
- [x] **Step 3**: Migration Prompt 3 (Unit tests)
|
|
13
|
-
- [x] **Step 4**: Migration Prompt 4 (Visual test cases)
|
|
14
|
-
- [x] **Step 5**: Linting (ESLint)
|
|
15
|
-
- [x] **Step 6**: Pre-build Validation
|
|
16
|
-
- [x] **Step 7**: Build blaze-ui
|
|
17
|
-
- [x] **Step 8**: Visual Testing
|
|
18
|
-
- [x] **Step 9**: CSS Analysis (if mismatches found)
|
|
19
|
-
- [x] **Step 9.5**: CSS Analysis Completed
|
|
20
|
-
- [x] **Step 10**: Git Commit & Push to branch (pre-commit hook will run tests)
|
|
21
|
-
- [x] **Step 11**: Create Pull Request
|
|
22
|
-
|
|
23
|
-
## Deprecated Props Verification
|
|
24
|
-
|
|
25
|
-
_No deprecated props verification results yet._
|
|
26
|
-
|
|
27
|
-
**Note**: Step 2.5 is REQUIRED and enforced.
|
|
28
|
-
- Focus: **Ant Design component prop changes** (e.g., Dropdown, Input, Alert, Tooltip, etc.)
|
|
29
|
-
- Reference: MIGRATION_CHANGELOG_TEMPLATE.md for format, ANTD_V6_MIGRATION.md for Ant Design deprecated APIs
|
|
30
|
-
- Skip: If original component doesn't exist in cap-ui-library
|
|
31
|
-
- All deprecated Ant Design props and prop changes must be documented before proceeding.
|
|
32
|
-
|
|
33
|
-
## Visual Testing Results
|
|
34
|
-
|
|
35
|
-
**Last Test**: 2026-02-11 09:28:36
|
|
36
|
-
**Maximum Mismatch**: 0%
|
|
37
|
-
|
|
38
|
-
### Mismatched Variants:
|
|
39
|
-
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
## CSS Fixes Applied
|
|
43
|
-
|
|
44
|
-
**Date**: 2026-02-06 13:45:34
|
|
45
|
-
**Summary**: CSS fixes applied based on visual testing analysis.
|
|
46
|
-
|
|
47
|
-
_See full analysis in: `/Users/sarahkhader/repos/migration/blaze-ui/tools/visual-testing/report/CapTabV3/css-fix-analysis.md`_
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
## Notes
|
|
51
|
-
|
|
52
|
-
_No notes yet._
|
|
@@ -1,149 +0,0 @@
|
|
|
1
|
-
# CapTabV3 Use Case Gaps Analysis
|
|
2
|
-
|
|
3
|
-
## Phase 0: Google Sheets Access
|
|
4
|
-
|
|
5
|
-
**Status**: ⚠️ **Unable to access Google Sheets**
|
|
6
|
-
|
|
7
|
-
- MCP Server `google_sheets` was not available
|
|
8
|
-
- Spreadsheet ID: `1Xt8l8Q6Hw0cUYV65SlGvGcPnOtzprr0fukDR9UWJ3kg`
|
|
9
|
-
- Tab: `CapTabV3`
|
|
10
|
-
|
|
11
|
-
**Action Required**: Manual review of Google Sheets to compare use cases against component implementation.
|
|
12
|
-
|
|
13
|
-
---
|
|
14
|
-
|
|
15
|
-
## Phase 1: Use Cases NOT Fulfilled by CapTabV3
|
|
16
|
-
|
|
17
|
-
Based on component analysis (`index.tsx`, `types.ts`, `README.md`, `stories/CapTabV3.stories.tsx`), the following use cases are **NOT currently supported**:
|
|
18
|
-
|
|
19
|
-
### 1. **Advanced Tab Management**
|
|
20
|
-
- ❌ **Add/Remove tabs dynamically**: No API to programmatically add or remove tabs (only `editable-card` type supports UI-based add, but no programmatic control)
|
|
21
|
-
- ❌ **Reorder tabs**: No drag-and-drop or programmatic reordering capability
|
|
22
|
-
- ❌ **Tab validation**: No validation before tab change (e.g., prevent navigation if form is dirty)
|
|
23
|
-
- ❌ **Tab lifecycle hooks**: No `onBeforeChange` or `onAfterChange` callbacks
|
|
24
|
-
|
|
25
|
-
### 2. **Enhanced User Interactions**
|
|
26
|
-
- ❌ **Keyboard navigation**: No explicit keyboard shortcuts documentation or custom handlers (relies on Ant Design defaults)
|
|
27
|
-
- ❌ **Tab close functionality**: No close button on tabs (except `editable-card` type)
|
|
28
|
-
- ❌ **Tab context menu**: No right-click menu for tab actions
|
|
29
|
-
- ❌ **Tab tooltips**: No built-in tooltip support for tab labels
|
|
30
|
-
- ❌ **Tab badges/notifications**: No badge or notification count display on tabs
|
|
31
|
-
|
|
32
|
-
### 3. **Loading and Error States**
|
|
33
|
-
- ❌ **Loading state per tab**: No loading indicator for individual tabs
|
|
34
|
-
- ❌ **Error state per tab**: No error display for failed tab content
|
|
35
|
-
- ❌ **Lazy loading**: Content is conditionally rendered but not truly lazy-loaded (all content exists in DOM)
|
|
36
|
-
- ❌ **Async tab content**: No built-in support for async content loading
|
|
37
|
-
|
|
38
|
-
### 4. **Customization and Styling**
|
|
39
|
-
- ❌ **Custom tab icons**: No built-in icon prop support (must be included in `tab` ReactNode)
|
|
40
|
-
- ❌ **Custom tab styling per pane**: All tabs use same styling, no per-tab className
|
|
41
|
-
- ❌ **Custom content wrapper**: No ability to wrap content in custom containers
|
|
42
|
-
- ❌ **Tab width control**: No min-width or max-width control for tabs
|
|
43
|
-
- ❌ **Responsive breakpoints**: No built-in responsive behavior configuration
|
|
44
|
-
|
|
45
|
-
### 5. **Data and State Features**
|
|
46
|
-
- ❌ **Tab persistence**: No localStorage/sessionStorage persistence for active tab
|
|
47
|
-
- ❌ **Tab history**: No browser history integration for tab navigation
|
|
48
|
-
- ❌ **Tab state management**: No Redux/Zustand integration helpers
|
|
49
|
-
- ❌ **Tab analytics**: No built-in analytics tracking for tab views
|
|
50
|
-
- ❌ **Tab metadata**: No way to attach custom metadata to tabs
|
|
51
|
-
|
|
52
|
-
### 6. **Accessibility Enhancements**
|
|
53
|
-
- ❌ **Custom ARIA labels**: No `ariaLabel` prop for tabs (relies on Ant Design defaults)
|
|
54
|
-
- ❌ **Screen reader announcements**: No custom announcements for tab changes
|
|
55
|
-
- ❌ **Focus management**: No explicit focus management after tab change
|
|
56
|
-
- ❌ **Skip navigation**: No skip-to-content link support
|
|
57
|
-
|
|
58
|
-
### 7. **Integration Features**
|
|
59
|
-
- ❌ **Form integration**: No Form.Item wrapper or form validation integration
|
|
60
|
-
- ❌ **Router integration**: No built-in React Router integration
|
|
61
|
-
- ❌ **URL synchronization**: No URL hash/query param synchronization
|
|
62
|
-
- ❌ **Deep linking**: No support for deep linking to specific tabs
|
|
63
|
-
|
|
64
|
-
### 8. **Advanced Content Features**
|
|
65
|
-
- ❌ **Tab content animations**: No custom animations for content transitions
|
|
66
|
-
- ❌ **Tab content caching**: No way to preserve tab content state when switching
|
|
67
|
-
- ❌ **Nested tabs**: No built-in support for tabs within tabs
|
|
68
|
-
- ❌ **Tab groups**: No grouping or categorization of tabs
|
|
69
|
-
|
|
70
|
-
### 9. **Performance Optimizations**
|
|
71
|
-
- ❌ **Virtual scrolling**: No virtual scrolling for many tabs
|
|
72
|
-
- ❌ **Tab virtualization**: No virtualization for tab list
|
|
73
|
-
- ❌ **Memoization helpers**: No built-in memoization for tab content
|
|
74
|
-
|
|
75
|
-
### 10. **Developer Experience**
|
|
76
|
-
- ❌ **Tab refs**: No way to get refs to individual tab elements
|
|
77
|
-
- ❌ **Tab scroll into view**: No automatic scroll to active tab
|
|
78
|
-
- ❌ **Tab overflow handling**: No custom overflow menu for many tabs
|
|
79
|
-
- ❌ **Tab search/filter**: No search or filter functionality for tabs
|
|
80
|
-
|
|
81
|
-
---
|
|
82
|
-
|
|
83
|
-
## Current Component Capabilities
|
|
84
|
-
|
|
85
|
-
✅ **Supported Features**:
|
|
86
|
-
|
|
87
|
-
1. **Basic Tab Functionality**
|
|
88
|
-
- ✅ Multiple tabs with panes array
|
|
89
|
-
- ✅ Tab switching via click
|
|
90
|
-
- ✅ Active tab highlighting
|
|
91
|
-
- ✅ Disabled tabs support
|
|
92
|
-
|
|
93
|
-
2. **Controlled and Uncontrolled Modes**
|
|
94
|
-
- ✅ Controlled mode with `activeKey`
|
|
95
|
-
- ✅ Uncontrolled mode with internal state
|
|
96
|
-
- ✅ `onTabChange` callback
|
|
97
|
-
|
|
98
|
-
3. **Tab Placement**
|
|
99
|
-
- ✅ `tabPlacement` prop (top, start, end, bottom)
|
|
100
|
-
- ✅ Backward compatibility with deprecated `tabPosition`
|
|
101
|
-
- ✅ Automatic mapping (left → start, right → end)
|
|
102
|
-
|
|
103
|
-
4. **Ant Design Tabs Props**
|
|
104
|
-
- ✅ Type variants (line, card, editable-card)
|
|
105
|
-
- ✅ Size variants (small, middle, large)
|
|
106
|
-
- ✅ Centered tabs
|
|
107
|
-
- ✅ Animated transitions
|
|
108
|
-
- ✅ Hide add button for editable-card
|
|
109
|
-
|
|
110
|
-
5. **Content Rendering**
|
|
111
|
-
- ✅ Conditional rendering (only active tab content)
|
|
112
|
-
- ✅ React element content support
|
|
113
|
-
- ✅ String content support
|
|
114
|
-
|
|
115
|
-
6. **Styling**
|
|
116
|
-
- ✅ Custom className support
|
|
117
|
-
- ✅ Wrapper className
|
|
118
|
-
- ✅ SCSS styling with design tokens
|
|
119
|
-
|
|
120
|
-
7. **Backward Compatibility**
|
|
121
|
-
- ✅ Deprecated `tabPosition` prop support
|
|
122
|
-
- ✅ Development mode warnings
|
|
123
|
-
- ✅ No breaking changes
|
|
124
|
-
|
|
125
|
-
---
|
|
126
|
-
|
|
127
|
-
## Recommendations
|
|
128
|
-
|
|
129
|
-
### High Priority (Common Use Cases)
|
|
130
|
-
1. **Tab close functionality** - Add close button support for non-editable tabs
|
|
131
|
-
2. **Loading states** - Add loading indicator per tab
|
|
132
|
-
3. **Keyboard navigation** - Document and enhance keyboard shortcuts
|
|
133
|
-
4. **Tab badges** - Add notification count/badge support
|
|
134
|
-
|
|
135
|
-
### Medium Priority (Enhanced UX)
|
|
136
|
-
1. **Tab persistence** - Add localStorage persistence option
|
|
137
|
-
2. **URL synchronization** - Add hash/query param sync
|
|
138
|
-
3. **Custom icons** - Add icon prop support
|
|
139
|
-
4. **Tab validation** - Add `onBeforeChange` callback
|
|
140
|
-
|
|
141
|
-
### Low Priority (Advanced Features)
|
|
142
|
-
1. **Router integration** - Add React Router helpers
|
|
143
|
-
2. **Tab virtualization** - For many tabs scenarios
|
|
144
|
-
3. **Nested tabs** - Support tabs within tabs
|
|
145
|
-
4. **Tab analytics** - Built-in tracking
|
|
146
|
-
|
|
147
|
-
---
|
|
148
|
-
|
|
149
|
-
**Note**: This analysis is based on component code review. Actual use cases from Google Sheets may reveal additional gaps or prioritize differently.
|
package/CapTable/README.md
DELETED
|
@@ -1,160 +0,0 @@
|
|
|
1
|
-
# CapTable Migration: Ant Design v3 → v6
|
|
2
|
-
|
|
3
|
-
## Migration Summary
|
|
4
|
-
|
|
5
|
-
CapTable has been successfully migrated from Ant Design v3 to v6. All style overrides have been moved to design tokens, and the component now uses v6-compatible APIs.
|
|
6
|
-
|
|
7
|
-
## Breaking Changes
|
|
8
|
-
|
|
9
|
-
### None
|
|
10
|
-
|
|
11
|
-
CapTable does not use any deprecated Ant Design APIs. The component was already using v6-compatible prop names.
|
|
12
|
-
|
|
13
|
-
## Style Migration
|
|
14
|
-
|
|
15
|
-
### Before (SCSS Overrides)
|
|
16
|
-
|
|
17
|
-
The component previously used SCSS overrides with `:global` and `.ant-` class selectors:
|
|
18
|
-
|
|
19
|
-
```scss
|
|
20
|
-
.cap-table-v2 {
|
|
21
|
-
:global {
|
|
22
|
-
.ant-table {
|
|
23
|
-
border: $border-width-1 solid $cap-g07;
|
|
24
|
-
.ant-table-thead > tr > th {
|
|
25
|
-
font-size: $font-size-s;
|
|
26
|
-
line-height: $spacing-16;
|
|
27
|
-
padding: $spacing-16 $spacing-24;
|
|
28
|
-
}
|
|
29
|
-
// ... more overrides
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
```
|
|
34
|
-
|
|
35
|
-
### After (Design Tokens)
|
|
36
|
-
|
|
37
|
-
All style overrides have been migrated to design tokens in `getCapThemeConfig.ts`:
|
|
38
|
-
|
|
39
|
-
```typescript
|
|
40
|
-
Table: {
|
|
41
|
-
borderColor: styledVars.CAP_G07 || '#dfe2e7',
|
|
42
|
-
headerFontSize: remToPx(styledVars.FONT_SIZE_S, '0.857rem'), // 12px
|
|
43
|
-
headerLineHeight: remToPx(styledVars.SPACING_16, '1.142rem'), // 16px
|
|
44
|
-
headerPaddingBlock: remToPx(styledVars.SPACING_16, '1.142rem'), // 16px
|
|
45
|
-
headerPaddingInline: remToPx(styledVars.SPACING_24, '1.714rem'), // 24px
|
|
46
|
-
paddingBlock: remToPx(styledVars.SPACING_16, '1.142rem'), // 16px
|
|
47
|
-
paddingInline: remToPx(styledVars.SPACING_24, '1.714rem'), // 24px
|
|
48
|
-
}
|
|
49
|
-
```
|
|
50
|
-
|
|
51
|
-
### Style Overrides Migrated
|
|
52
|
-
|
|
53
|
-
| Old Override | New Token Path | Value |
|
|
54
|
-
|-------------|----------------|-------|
|
|
55
|
-
| `.ant-table { border }` | `components.Table.borderColor` | `#dfe2e7` |
|
|
56
|
-
| `.ant-table-thead > tr > th { font-size }` | `components.Table.headerFontSize` | `12px` |
|
|
57
|
-
| `.ant-table-thead > tr > th { line-height }` | `components.Table.headerLineHeight` | `16px` |
|
|
58
|
-
| `.ant-table-thead > tr > th { padding }` | `components.Table.headerPaddingBlock`<br>`components.Table.headerPaddingInline` | `16px`<br>`24px` |
|
|
59
|
-
| `.ant-table-tbody > tr > td { padding }` | `components.Table.paddingBlock`<br>`components.Table.paddingInline` | `16px`<br>`24px` |
|
|
60
|
-
| `.ant-table-tbody > tr > td { border-bottom }` | `components.Table.borderColor` | `#dfe2e7` |
|
|
61
|
-
|
|
62
|
-
## API Changes
|
|
63
|
-
|
|
64
|
-
### Import Statement
|
|
65
|
-
|
|
66
|
-
**Before:**
|
|
67
|
-
```typescript
|
|
68
|
-
import { Table } from 'antd-v5';
|
|
69
|
-
import type { TableProps } from 'antd-v5';
|
|
70
|
-
```
|
|
71
|
-
|
|
72
|
-
**After:**
|
|
73
|
-
```typescript
|
|
74
|
-
import { Table } from 'antd';
|
|
75
|
-
import type { CapTableProps, OffsetLimit } from './types';
|
|
76
|
-
```
|
|
77
|
-
|
|
78
|
-
### Loading State
|
|
79
|
-
|
|
80
|
-
The `showLoader` prop now uses Ant Design's built-in `loading` prop instead of a custom CSS pseudo-element.
|
|
81
|
-
|
|
82
|
-
**Before:**
|
|
83
|
-
- Custom CSS pseudo-element (`::after`) displayed "Loading..." text
|
|
84
|
-
- Required `:global` and `.ant-` class selectors
|
|
85
|
-
|
|
86
|
-
**After:**
|
|
87
|
-
- Uses Ant Design's native `loading` prop
|
|
88
|
-
- Displays Ant Design's standard loading spinner
|
|
89
|
-
- No custom CSS required
|
|
90
|
-
|
|
91
|
-
## Type Definitions
|
|
92
|
-
|
|
93
|
-
All types have been extracted to `types.ts`:
|
|
94
|
-
|
|
95
|
-
- `CapTableProps` - Main component props interface
|
|
96
|
-
- `OffsetLimit` - Pagination structure interface
|
|
97
|
-
|
|
98
|
-
## Validation
|
|
99
|
-
|
|
100
|
-
### ✅ Style Validation
|
|
101
|
-
|
|
102
|
-
```bash
|
|
103
|
-
grep -E '(:global|\.ant-)' components/CapTable/styles.scss
|
|
104
|
-
# Expected: Empty (no matches)
|
|
105
|
-
```
|
|
106
|
-
|
|
107
|
-
### ✅ Theme Config Validation
|
|
108
|
-
|
|
109
|
-
```bash
|
|
110
|
-
git diff components/utils/getCapThemeConfig.ts
|
|
111
|
-
# Expected: Shows additions under components.Table
|
|
112
|
-
```
|
|
113
|
-
|
|
114
|
-
### ✅ TypeScript Compilation
|
|
115
|
-
|
|
116
|
-
```bash
|
|
117
|
-
tsc --noEmit
|
|
118
|
-
# Expected: Exit code 0 (no errors)
|
|
119
|
-
```
|
|
120
|
-
|
|
121
|
-
## Usage
|
|
122
|
-
|
|
123
|
-
The component API remains unchanged:
|
|
124
|
-
|
|
125
|
-
```tsx
|
|
126
|
-
import CapTable from '@capillarytech/blaze-ui';
|
|
127
|
-
|
|
128
|
-
<CapTable
|
|
129
|
-
id="my-table"
|
|
130
|
-
dataSource={data}
|
|
131
|
-
infiniteScroll
|
|
132
|
-
showLoader={loading}
|
|
133
|
-
offset_limit={offsetLimit}
|
|
134
|
-
setPagination={handlePagination}
|
|
135
|
-
scroll={{ y: 400 }}
|
|
136
|
-
>
|
|
137
|
-
<Table.Column title="Name" dataIndex="name" />
|
|
138
|
-
<Table.Column title="Email" dataIndex="email" />
|
|
139
|
-
</CapTable>
|
|
140
|
-
```
|
|
141
|
-
|
|
142
|
-
## Files Changed
|
|
143
|
-
|
|
144
|
-
1. ✅ `components/CapTable/index.tsx` - Updated imports, removed type definitions
|
|
145
|
-
2. ✅ `components/CapTable/types.ts` - New file with extracted types
|
|
146
|
-
3. ✅ `components/CapTable/styles.scss` - Removed all `:global` and `.ant-` selectors
|
|
147
|
-
4. ✅ `components/utils/getCapThemeConfig.ts` - Added Table design tokens
|
|
148
|
-
5. ✅ `components/CapTable/README.md` - Migration documentation (this file)
|
|
149
|
-
|
|
150
|
-
## Migration Checklist
|
|
151
|
-
|
|
152
|
-
- [x] All `:global` keywords removed from styles.scss
|
|
153
|
-
- [x] All `.ant-` class selectors removed from styles.scss
|
|
154
|
-
- [x] Design tokens added to getCapThemeConfig.ts
|
|
155
|
-
- [x] Import changed from `antd-v5` to `antd`
|
|
156
|
-
- [x] Types extracted to types.ts
|
|
157
|
-
- [x] Loading state uses Ant Design's `loading` prop
|
|
158
|
-
- [x] TypeScript compiles without errors
|
|
159
|
-
- [x] No breaking API changes
|
|
160
|
-
- [x] Documentation updated
|
package/CapTable/Status.md
DELETED
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
# Migration Status: CapTable
|
|
2
|
-
|
|
3
|
-
**Last Updated**: 2026-02-06 11:48:41
|
|
4
|
-
|
|
5
|
-
## Migration Steps
|
|
6
|
-
|
|
7
|
-
- [x] **Step 0**: Setup branch and remote tracking
|
|
8
|
-
- [x] **Step 1**: Migration Prompt 1 (Main migration)
|
|
9
|
-
- [x] **Step 2**: Migration Prompt 2 (Storybook support)
|
|
10
|
-
- [x] **Step 3**: Migration Prompt 3 (Unit tests)
|
|
11
|
-
- [x] **Step 4**: Migration Prompt 4 (Visual test cases)
|
|
12
|
-
- [x] **Step 5**: Linting (ESLint)
|
|
13
|
-
- [x] **Step 6**: Pre-build Validation
|
|
14
|
-
- [x] **Step 7**: Build blaze-ui
|
|
15
|
-
- [x] **Step 8**: Visual Testing
|
|
16
|
-
- [ ] **Step 9**: CSS Analysis (if mismatches found)
|
|
17
|
-
- [ ] **Step 9.5**: CSS Analysis Completed
|
|
18
|
-
- [] **Step 10**: Git Commit & Push to branch (pre-commit hook will run tests)
|
|
19
|
-
- [] **Step 11**: Create Pull Request
|
|
20
|
-
|
|
21
|
-
## Visual Testing Results
|
|
22
|
-
|
|
23
|
-
**Last Test**: 2026-02-06 11:48:41
|
|
24
|
-
**Maximum Mismatch**: 3.26%
|
|
25
|
-
|
|
26
|
-
### Mismatched Variants:
|
|
27
|
-
- default:3.15%
|
|
28
|
-
- infinite-scroll:2.90%
|
|
29
|
-
- bordered:2.78%
|
|
30
|
-
- selected-rows:2.78%
|
|
31
|
-
- long-list:2.89%
|
|
32
|
-
- custom-scroll:3.26%
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
## CSS Fixes Applied
|
|
36
|
-
|
|
37
|
-
_No CSS fixes applied yet._
|
|
38
|
-
|
|
39
|
-
## Notes
|
|
40
|
-
|
|
41
|
-
_No notes yet._
|
package/CapTag/README.md
DELETED
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
# CapTag
|
|
2
|
-
|
|
3
|
-
Extended version of Ant Design Tag component with custom styling and variants.
|
|
4
|
-
|
|
5
|
-
## Migration from Ant Design v3/v5 to v6
|
|
6
|
-
|
|
7
|
-
This component has been migrated to Ant Design v6. No breaking API changes were required as the Tag component API remains compatible between versions.
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
## Breaking Changes
|
|
11
|
-
|
|
12
|
-
None. The component maintains full backward compatibility with previous versions.
|
|
13
|
-
|
|
14
|
-
## New Props in v6
|
|
15
|
-
|
|
16
|
-
1. variant prop was introduced in v6 but in order to maintain backward compatibility we will consume type only.
|