@kondee/chip md3

docs/6.x/docs/guides/migration.md

@@ -109,6 +109,37 @@ Some components now accept explicit `testID` props for their interactable elemen
 
 ## Components
 
+### Chip
+
+#### Default mode
+
+- The default **`mode`** changed from **`"flat"`** to **`"outlined"`**.
+
+```tsx
+// Before (v5) - no mode passed, rendered flat
+<Chip onPress={() => {}}>Example Chip</Chip>
+
+// After (v6) - no mode passed, renders outlined; pass mode="flat" to keep the old look
+<Chip mode="flat" onPress={() => {}}>Example Chip</Chip>
+```
+
+#### Removed props
+
+- **`compact`**, **`showSelectedOverlay`** were removed and have no direct equivalent.
+
+#### New props
+
+- **`trailingIcon`** / **`onTrailingIconPress`** / **`trailingIconAccessibilityLabel`** add a trailing action (e.g. a dropdown) independent of the close button. `trailingIcon` takes precedence over `onClose`'s close icon when both are specified.
+- **`backgroundColor`** / **`borderRadius`** replace overriding the chip's background color or border radius through `style`. `style` no longer accepts `backgroundColor` or `borderRadius`.
+
+```tsx
+// Before (v5)
+<Chip onPress={() => {}} style={{ backgroundColor: 'purple', borderRadius: 16 }}>Example Chip</Chip>
+
+// After (v6)
+<Chip onPress={() => {}} backgroundColor="purple" borderRadius={16}>Example Chip</Chip>
+```
+
 ### Appbar
 
 The `style` props for `Appbar` and `Appbar.Header` no longer accept `Animated.Value` or `Animated.AnimatedInterpolation`. They only accept static styles.

docs/src/data/screenshots.ts

@@ -51,10 +51,7 @@ export const screenshots = {
     enabled: 'screenshots/checkbox-enabled.ios.png',
     disabled: 'screenshots/checkbox-disabled.ios.png',
   },
-  Chip: {
-    flat: 'screenshots/chip-1.png',
-    outlined: 'screenshots/chip-2.png',
-  },
+  Chip: 'screenshots/chip.png',
   DataTable: 'screenshots/data-table-full-width.png',
   'DataTable.Cell': 'screenshots/data-table-row-cell.png',
   'DataTable.Header': 'screenshots/data-table-header.png',