@coinbase/cds-mobile 8.39.0 → 8.39.1
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/CHANGELOG.md
CHANGED
|
@@ -8,6 +8,12 @@ All notable changes to this project will be documented in this file.
|
|
|
8
8
|
|
|
9
9
|
<!-- template-start -->
|
|
10
10
|
|
|
11
|
+
## 8.39.1 (1/28/2026 PST)
|
|
12
|
+
|
|
13
|
+
#### 🐞 Fixes
|
|
14
|
+
|
|
15
|
+
- Fix padding on Tab components. [[#330](https://github.com/coinbase/cds/pull/330)]
|
|
16
|
+
|
|
11
17
|
## 8.39.0 (1/27/2026 PST)
|
|
12
18
|
|
|
13
19
|
#### 🚀 Updates
|
package/esm/tabs/Tabs.js
CHANGED
|
@@ -124,6 +124,7 @@ export const TabsActiveIndicator = _ref4 => {
|
|
|
124
124
|
const previousActiveTabRect = useRef(activeTabRect);
|
|
125
125
|
const newActiveTabRect = {
|
|
126
126
|
x: activeTabRect.x,
|
|
127
|
+
y: activeTabRect.y,
|
|
127
128
|
width: activeTabRect.width
|
|
128
129
|
};
|
|
129
130
|
const animatedTabRect = useSharedValue(newActiveTabRect);
|
|
@@ -135,6 +136,8 @@ export const TabsActiveIndicator = _ref4 => {
|
|
|
135
136
|
const animatedBoxStyle = useAnimatedStyle(() => ({
|
|
136
137
|
transform: [{
|
|
137
138
|
translateX: animatedTabRect.value.x
|
|
139
|
+
}, {
|
|
140
|
+
translateY: animatedTabRect.value.y
|
|
138
141
|
}],
|
|
139
142
|
width: animatedTabRect.value.width
|
|
140
143
|
}), [animatedTabRect]);
|
|
@@ -229,6 +229,13 @@ const SegmentedTabsScreen = () => /*#__PURE__*/_jsxs(ExampleScreen, {
|
|
|
229
229
|
},
|
|
230
230
|
tabs: basicSegments,
|
|
231
231
|
title: "Scaled"
|
|
232
|
+
}), /*#__PURE__*/_jsx(SegmentedTabsExample, {
|
|
233
|
+
defaultActiveTab: basicSegments[0],
|
|
234
|
+
gap: 2,
|
|
235
|
+
padding: 3,
|
|
236
|
+
tabs: basicSegments,
|
|
237
|
+
title: "With Padding",
|
|
238
|
+
width: "fit-content"
|
|
232
239
|
})]
|
|
233
240
|
});
|
|
234
241
|
export default SegmentedTabsScreen;
|
|
@@ -162,6 +162,17 @@ const TabNavigationScreen = () => {
|
|
|
162
162
|
onPress: randomizeCurrentTabOne,
|
|
163
163
|
children: "Select random item"
|
|
164
164
|
})]
|
|
165
|
+
}), /*#__PURE__*/_jsx(Example, {
|
|
166
|
+
overflow: "visible",
|
|
167
|
+
padding: gutter,
|
|
168
|
+
title: "With Padding",
|
|
169
|
+
children: /*#__PURE__*/_jsx(TabNavigation, {
|
|
170
|
+
onChange: setCurrentTabOne,
|
|
171
|
+
paddingX: 3,
|
|
172
|
+
paddingY: 1,
|
|
173
|
+
tabs: sampleTabs.slice(0, 3),
|
|
174
|
+
value: currentTabOne
|
|
175
|
+
})
|
|
165
176
|
})]
|
|
166
177
|
});
|
|
167
178
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@coinbase/cds-mobile",
|
|
3
|
-
"version": "8.39.
|
|
3
|
+
"version": "8.39.1",
|
|
4
4
|
"description": "Coinbase Design System - Mobile",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -198,7 +198,7 @@
|
|
|
198
198
|
"react-native-svg": "^14.1.0"
|
|
199
199
|
},
|
|
200
200
|
"dependencies": {
|
|
201
|
-
"@coinbase/cds-common": "^8.39.
|
|
201
|
+
"@coinbase/cds-common": "^8.39.1",
|
|
202
202
|
"@coinbase/cds-icons": "^5.9.0",
|
|
203
203
|
"@coinbase/cds-illustrations": "^4.29.0",
|
|
204
204
|
"@coinbase/cds-lottie-files": "^3.3.4",
|