@coinbase/cds-mcp-server 8.17.4 → 8.17.6
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,14 @@ All notable changes to this project will be documented in this file.
|
|
|
8
8
|
|
|
9
9
|
<!-- template-start -->
|
|
10
10
|
|
|
11
|
+
## 8.17.6 ((10/28/2025, 02:28 PM PST))
|
|
12
|
+
|
|
13
|
+
This is an artificial version bump with no new change.
|
|
14
|
+
|
|
15
|
+
## 8.17.5 ((10/27/2025, 04:19 PM PST))
|
|
16
|
+
|
|
17
|
+
This is an artificial version bump with no new change.
|
|
18
|
+
|
|
11
19
|
## 8.17.4 (10/27/2025)
|
|
12
20
|
|
|
13
21
|
This is an artificial version bump with no new change.
|
|
@@ -184,6 +184,98 @@ The accessibility props are only applied when the `<ListCell>` has a value for t
|
|
|
184
184
|
/>
|
|
185
185
|
```
|
|
186
186
|
|
|
187
|
+
### Priority
|
|
188
|
+
|
|
189
|
+
The priority prop controls which parts of the cell are protected from shrinking and truncation when horizontal space is limited. It accepts start, middle, and end as a string or an array of strings.
|
|
190
|
+
|
|
191
|
+
```tsx
|
|
192
|
+
function PriorityContent() {
|
|
193
|
+
const dimensions = { width: 62, height: 18 };
|
|
194
|
+
const sparklineData = prices
|
|
195
|
+
.map((price) => parseFloat(price))
|
|
196
|
+
.filter((price, index) => index % 10 === 0);
|
|
197
|
+
const referenceY = sparklineData[Math.floor(sparklineData.length / 3)];
|
|
198
|
+
|
|
199
|
+
const CompactChart = memo(({ data, color, showArea = false, referenceY }) => (
|
|
200
|
+
<Box style={{ padding: 1 }}>
|
|
201
|
+
<LineChart
|
|
202
|
+
{...dimensions}
|
|
203
|
+
enableScrubbing={false}
|
|
204
|
+
overflow="visible"
|
|
205
|
+
inset={0}
|
|
206
|
+
showArea={showArea}
|
|
207
|
+
series={[
|
|
208
|
+
{
|
|
209
|
+
id: 'series',
|
|
210
|
+
data,
|
|
211
|
+
color,
|
|
212
|
+
},
|
|
213
|
+
]}
|
|
214
|
+
>
|
|
215
|
+
<ReferenceLine dataY={referenceY} />
|
|
216
|
+
</LineChart>
|
|
217
|
+
</Box>
|
|
218
|
+
));
|
|
219
|
+
|
|
220
|
+
return (
|
|
221
|
+
<VStack gap={3} style={{ width: '100%', maxWidth: 320, overflow: 'hidden' }}>
|
|
222
|
+
<ListCell
|
|
223
|
+
spacingVariant="condensed"
|
|
224
|
+
title="Asset with a really long name"
|
|
225
|
+
description="Some description of the asset"
|
|
226
|
+
intermediary={
|
|
227
|
+
<CompactChart data={sparklineData} color={assets.btc.color} referenceY={referenceY} />
|
|
228
|
+
}
|
|
229
|
+
detail="$334,239.03"
|
|
230
|
+
subdetail="+4.06%"
|
|
231
|
+
priority="start"
|
|
232
|
+
variant="positive"
|
|
233
|
+
onPress={() => {}}
|
|
234
|
+
/>
|
|
235
|
+
<ListCell
|
|
236
|
+
spacingVariant="condensed"
|
|
237
|
+
title="Asset with a really long name"
|
|
238
|
+
description="Some description of the asset"
|
|
239
|
+
intermediary={
|
|
240
|
+
<CompactChart data={sparklineData} color={assets.btc.color} referenceY={referenceY} />
|
|
241
|
+
}
|
|
242
|
+
detail="$334,239.03"
|
|
243
|
+
subdetail="+4.06%"
|
|
244
|
+
priority="middle"
|
|
245
|
+
variant="positive"
|
|
246
|
+
onPress={() => {}}
|
|
247
|
+
/>
|
|
248
|
+
<ListCell
|
|
249
|
+
spacingVariant="condensed"
|
|
250
|
+
title="Asset with a really long name"
|
|
251
|
+
description="Some description of the asset"
|
|
252
|
+
intermediary={
|
|
253
|
+
<CompactChart data={sparklineData} color={assets.btc.color} referenceY={referenceY} />
|
|
254
|
+
}
|
|
255
|
+
detail="$334,239.03"
|
|
256
|
+
subdetail="+4.06%"
|
|
257
|
+
priority="end"
|
|
258
|
+
variant="positive"
|
|
259
|
+
onPress={() => {}}
|
|
260
|
+
/>
|
|
261
|
+
<ListCell
|
|
262
|
+
spacingVariant="condensed"
|
|
263
|
+
title="Asset with a really long name"
|
|
264
|
+
description="Some description of the asset"
|
|
265
|
+
intermediary={
|
|
266
|
+
<CompactChart data={sparklineData} color={assets.btc.color} referenceY={referenceY} />
|
|
267
|
+
}
|
|
268
|
+
detail="$334,239.03"
|
|
269
|
+
subdetail="+4.06%"
|
|
270
|
+
priority={['start', 'middle', 'end']}
|
|
271
|
+
variant="warning"
|
|
272
|
+
onPress={() => {}}
|
|
273
|
+
/>
|
|
274
|
+
</VStack>
|
|
275
|
+
);
|
|
276
|
+
}
|
|
277
|
+
```
|
|
278
|
+
|
|
187
279
|
### Loading States
|
|
188
280
|
|
|
189
281
|
The ListCellFallback component provides loading state representations of ListCell. It uses placeholder rectangles to indicate where content will appear, creating a smooth loading experience. The mobile version leverages the theme system for consistent line heights and reuses the ListCell component structure for layout consistency.
|
|
@@ -216,6 +216,88 @@ The ListCellFallback component provides loading state representations of ListCel
|
|
|
216
216
|
</VStack>
|
|
217
217
|
```
|
|
218
218
|
|
|
219
|
+
### Priority
|
|
220
|
+
|
|
221
|
+
The priority prop controls which parts of the cell are protected from shrinking and truncation when horizontal space is limited. It accepts start, middle, and end as a string or an array of strings.
|
|
222
|
+
|
|
223
|
+
```tsx live
|
|
224
|
+
function PriorityCOntent() {
|
|
225
|
+
const dimensions = { width: 62, height: 18 };
|
|
226
|
+
const sparklineData = prices
|
|
227
|
+
.map((price) => parseFloat(price))
|
|
228
|
+
.filter((price, index) => index % 10 === 0);
|
|
229
|
+
const referenceY = sparklineData[Math.floor(sparklineData.length / 3)];
|
|
230
|
+
|
|
231
|
+
const CompactChart = memo(
|
|
232
|
+
({ data, color = 'var(--color-fgPositive)', showArea = false, referenceY }) => (
|
|
233
|
+
<Box style={{ padding: 1 }}>
|
|
234
|
+
<LineChart
|
|
235
|
+
{...dimensions}
|
|
236
|
+
enableScrubbing={false}
|
|
237
|
+
overflow="visible"
|
|
238
|
+
inset={0}
|
|
239
|
+
showArea={showArea}
|
|
240
|
+
series={[
|
|
241
|
+
{
|
|
242
|
+
id: 'series',
|
|
243
|
+
data,
|
|
244
|
+
color,
|
|
245
|
+
},
|
|
246
|
+
]}
|
|
247
|
+
>
|
|
248
|
+
<ReferenceLine dataY={referenceY} />
|
|
249
|
+
</LineChart>
|
|
250
|
+
</Box>
|
|
251
|
+
),
|
|
252
|
+
);
|
|
253
|
+
|
|
254
|
+
return (
|
|
255
|
+
<VStack gap={3} style={{ width: '100%', maxWidth: 320, overflow: 'hidden' }}>
|
|
256
|
+
<ListCell
|
|
257
|
+
spacingVariant="condensed"
|
|
258
|
+
title="Asset with a really long name"
|
|
259
|
+
description="Some description of the asset"
|
|
260
|
+
intermediary={<CompactChart data={sparklineData} referenceY={referenceY} />}
|
|
261
|
+
detail="$334,239.03"
|
|
262
|
+
subdetail="+4.06%"
|
|
263
|
+
priority="start"
|
|
264
|
+
variant="positive"
|
|
265
|
+
/>
|
|
266
|
+
<ListCell
|
|
267
|
+
spacingVariant="condensed"
|
|
268
|
+
title="Asset with a really long name"
|
|
269
|
+
description="Some description of the asset"
|
|
270
|
+
intermediary={<CompactChart data={sparklineData} referenceY={referenceY} />}
|
|
271
|
+
detail="$334,239.03"
|
|
272
|
+
subdetail="+4.06%"
|
|
273
|
+
priority="middle"
|
|
274
|
+
variant="positive"
|
|
275
|
+
/>
|
|
276
|
+
<ListCell
|
|
277
|
+
spacingVariant="condensed"
|
|
278
|
+
title="Asset with a really long name"
|
|
279
|
+
description="Some description of the asset"
|
|
280
|
+
intermediary={<CompactChart data={sparklineData} referenceY={referenceY} />}
|
|
281
|
+
detail="$334,239.03"
|
|
282
|
+
subdetail="+4.06%"
|
|
283
|
+
priority="end"
|
|
284
|
+
variant="positive"
|
|
285
|
+
/>
|
|
286
|
+
<ListCell
|
|
287
|
+
spacingVariant="condensed"
|
|
288
|
+
title="Asset with a really long name"
|
|
289
|
+
description="Some description of the asset"
|
|
290
|
+
intermediary={<CompactChart data={sparklineData} referenceY={referenceY} />}
|
|
291
|
+
detail="$334,239.03"
|
|
292
|
+
subdetail="+4.06%"
|
|
293
|
+
priority={['start', 'middle', 'end']}
|
|
294
|
+
variant="warning"
|
|
295
|
+
/>
|
|
296
|
+
</VStack>
|
|
297
|
+
);
|
|
298
|
+
}
|
|
299
|
+
```
|
|
300
|
+
|
|
219
301
|
### Anatomy
|
|
220
302
|
|
|
221
303
|
Without helper text (top-only layout):
|