@cdx-ui/components 0.3.4 → 0.3.5
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/docs/components/select/content.md +144 -2
- package/docs/foundations/expressions/icons/content.md +1 -1
- package/docs/llms.txt +1 -0
- package/docs/resources/release-notes/0.3.4/content.md +27 -0
- package/docs/resources/release-notes/content.md +1 -0
- package/lib/commonjs/components/Chip/styles.js +3 -1
- package/lib/commonjs/components/Chip/styles.js.map +1 -1
- package/lib/module/components/Chip/styles.js +3 -1
- package/lib/module/components/Chip/styles.js.map +1 -1
- package/lib/typescript/components/Chip/styles.d.ts.map +1 -1
- package/package.json +5 -5
- package/src/components/Chip/styles.ts +3 -1
|
@@ -126,7 +126,9 @@ export default function SelectMultipleDemo() {
|
|
|
126
126
|
<Select.Trigger>
|
|
127
127
|
<Select.Value placeholder="Select teams">
|
|
128
128
|
{({ isPlaceholder, selectedItems }) =>
|
|
129
|
-
isPlaceholder
|
|
129
|
+
isPlaceholder
|
|
130
|
+
? null
|
|
131
|
+
: `${selectedItems.length} ${selectedItems.length === 1 ? 'team' : 'teams'} selected`
|
|
130
132
|
}
|
|
131
133
|
</Select.Value>
|
|
132
134
|
</Select.Trigger>
|
|
@@ -166,7 +168,9 @@ export default function SelectWithSearchDemo() {
|
|
|
166
168
|
<Select.Trigger>
|
|
167
169
|
<Select.Value placeholder="Select teams you want to assign to this user">
|
|
168
170
|
{({ isPlaceholder, selectedItems }) =>
|
|
169
|
-
isPlaceholder
|
|
171
|
+
isPlaceholder
|
|
172
|
+
? null
|
|
173
|
+
: `${String(selectedItems.length)} ${selectedItems.length === 1 ? 'team' : 'teams'} selected`
|
|
170
174
|
}
|
|
171
175
|
</Select.Value>
|
|
172
176
|
</Select.Trigger>
|
|
@@ -299,6 +303,144 @@ export default function SelectCustomValueDemo() {
|
|
|
299
303
|
}
|
|
300
304
|
```
|
|
301
305
|
|
|
306
|
+
In `multiple` mode the same function child can summarize the selection three ways: `selectedText` for the comma-separated labels the default shows, `asChild` with your own element, such as colored `Chip`s, in place of the text, or a short summary in the field with the selected items listed in detail below it. The chips are display-only; the detail list removes values itself by updating the same `value` state.
|
|
307
|
+
|
|
308
|
+
```tsx
|
|
309
|
+
import { useState } from 'react';
|
|
310
|
+
import { Close } from '@cdx-ui/icons';
|
|
311
|
+
import {
|
|
312
|
+
Avatar,
|
|
313
|
+
Box,
|
|
314
|
+
Card,
|
|
315
|
+
Chip,
|
|
316
|
+
Field,
|
|
317
|
+
IconButton,
|
|
318
|
+
ListItem,
|
|
319
|
+
Select,
|
|
320
|
+
Text,
|
|
321
|
+
VStack,
|
|
322
|
+
} from '@cdx-ui/components';
|
|
323
|
+
import { teams } from './_data';
|
|
324
|
+
|
|
325
|
+
const teamDetails: Record<string, { label: string; lead: string; members: number }> = {
|
|
326
|
+
design: { label: 'Design', lead: 'Maya Chen', members: 12 },
|
|
327
|
+
engineering: { label: 'Engineering', lead: 'Dev Patel', members: 48 },
|
|
328
|
+
finance: { label: 'Finance', lead: 'Rosa Alvarez', members: 9 },
|
|
329
|
+
operations: { label: 'Operations', lead: 'Sam Okafor', members: 21 },
|
|
330
|
+
};
|
|
331
|
+
|
|
332
|
+
const chipColors = ['action', 'success', 'warning', 'info'] as const;
|
|
333
|
+
|
|
334
|
+
function TeamItems() {
|
|
335
|
+
return (
|
|
336
|
+
<Select.Content>
|
|
337
|
+
{teams.map((team) => (
|
|
338
|
+
<Select.Item key={team.value} value={team.value} disabled={team.disabled}>
|
|
339
|
+
<Select.ItemControl />
|
|
340
|
+
<Select.ItemLabel>{team.label}</Select.ItemLabel>
|
|
341
|
+
</Select.Item>
|
|
342
|
+
))}
|
|
343
|
+
</Select.Content>
|
|
344
|
+
);
|
|
345
|
+
}
|
|
346
|
+
|
|
347
|
+
export default function SelectCustomValueMultipleDemo() {
|
|
348
|
+
const [listIds, setListIds] = useState<string[]>(['design', 'engineering']);
|
|
349
|
+
const [detailIds, setDetailIds] = useState<string[]>(['design', 'engineering']);
|
|
350
|
+
const [chipIds, setChipIds] = useState<string[]>(['design', 'engineering', 'finance']);
|
|
351
|
+
|
|
352
|
+
return (
|
|
353
|
+
<VStack space="lg" className="w-full">
|
|
354
|
+
<Field>
|
|
355
|
+
<Field.Label>Comma-separated list</Field.Label>
|
|
356
|
+
<Select type="multiple" items={teams} value={listIds} onValueChange={setListIds}>
|
|
357
|
+
<Select.Trigger>
|
|
358
|
+
<Select.Value placeholder="Select teams">
|
|
359
|
+
{({ isPlaceholder, selectedText }) => (isPlaceholder ? null : selectedText)}
|
|
360
|
+
</Select.Value>
|
|
361
|
+
</Select.Trigger>
|
|
362
|
+
<TeamItems />
|
|
363
|
+
</Select>
|
|
364
|
+
</Field>
|
|
365
|
+
|
|
366
|
+
<Field>
|
|
367
|
+
<Field.Label>Chips</Field.Label>
|
|
368
|
+
<Select type="multiple" items={teams} value={chipIds} onValueChange={setChipIds}>
|
|
369
|
+
<Select.Trigger>
|
|
370
|
+
<Select.Value asChild placeholder="Select teams">
|
|
371
|
+
{chipIds.length === 0 ? (
|
|
372
|
+
<Text>Select teams</Text>
|
|
373
|
+
) : (
|
|
374
|
+
<Box className="flex-1 flex-row gap-1.5 overflow-hidden">
|
|
375
|
+
{chipIds.map((id) => {
|
|
376
|
+
const index = teams.findIndex((team) => team.value === id);
|
|
377
|
+
return (
|
|
378
|
+
<Chip key={id} size="small" color={chipColors[index % chipColors.length]}>
|
|
379
|
+
<Chip.Label>{teams[index].label}</Chip.Label>
|
|
380
|
+
</Chip>
|
|
381
|
+
);
|
|
382
|
+
})}
|
|
383
|
+
</Box>
|
|
384
|
+
)}
|
|
385
|
+
</Select.Value>
|
|
386
|
+
</Select.Trigger>
|
|
387
|
+
<TeamItems />
|
|
388
|
+
</Select>
|
|
389
|
+
</Field>
|
|
390
|
+
|
|
391
|
+
<Field>
|
|
392
|
+
<Field.Label>Summary with details</Field.Label>
|
|
393
|
+
<Select type="multiple" items={teams} value={detailIds} onValueChange={setDetailIds}>
|
|
394
|
+
<Select.Trigger>
|
|
395
|
+
<Select.Value placeholder="Select teams">
|
|
396
|
+
{({ isPlaceholder, selectedItems }) =>
|
|
397
|
+
isPlaceholder
|
|
398
|
+
? null
|
|
399
|
+
: `${selectedItems.length} ${selectedItems.length === 1 ? 'team' : 'teams'} selected`
|
|
400
|
+
}
|
|
401
|
+
</Select.Value>
|
|
402
|
+
</Select.Trigger>
|
|
403
|
+
<TeamItems />
|
|
404
|
+
</Select>
|
|
405
|
+
{detailIds.length > 0 ? (
|
|
406
|
+
<Card fullBleed className="mt-3 w-full">
|
|
407
|
+
<Card.Content>
|
|
408
|
+
{detailIds.map((id, index) => {
|
|
409
|
+
const team = teamDetails[id];
|
|
410
|
+
return (
|
|
411
|
+
<ListItem key={id} showSeparator={index < detailIds.length - 1}>
|
|
412
|
+
<ListItem.LeadingSlot>
|
|
413
|
+
<Avatar shape="rounded">
|
|
414
|
+
<Avatar.Text>{team.label}</Avatar.Text>
|
|
415
|
+
</Avatar>
|
|
416
|
+
</ListItem.LeadingSlot>
|
|
417
|
+
<ListItem.Content>
|
|
418
|
+
<ListItem.Title>{team.label}</ListItem.Title>
|
|
419
|
+
<ListItem.Description>
|
|
420
|
+
{`Led by ${team.lead} · ${team.members} members`}
|
|
421
|
+
</ListItem.Description>
|
|
422
|
+
</ListItem.Content>
|
|
423
|
+
<ListItem.TrailingSlot>
|
|
424
|
+
<IconButton
|
|
425
|
+
as={Close}
|
|
426
|
+
variant="ghost"
|
|
427
|
+
size="small"
|
|
428
|
+
accessibilityLabel={`Remove ${team.label}`}
|
|
429
|
+
onPress={() => setDetailIds((ids) => ids.filter((v) => v !== id))}
|
|
430
|
+
/>
|
|
431
|
+
</ListItem.TrailingSlot>
|
|
432
|
+
</ListItem>
|
|
433
|
+
);
|
|
434
|
+
})}
|
|
435
|
+
</Card.Content>
|
|
436
|
+
</Card>
|
|
437
|
+
) : null}
|
|
438
|
+
</Field>
|
|
439
|
+
</VStack>
|
|
440
|
+
);
|
|
441
|
+
}
|
|
442
|
+
```
|
|
443
|
+
|
|
302
444
|
## Custom item display
|
|
303
445
|
|
|
304
446
|
Compose any content inside `Select.Item` to show more than a label, such as a secondary line. Keep `Select.ItemLabel` for the primary text so the selected state and keyboard navigation stay in sync.
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Cross-platform icon library for Forge UI, built on [Material Symbols](https://fonts.google.com/icons) (outlined style, weight 400, optical size 24). Renders via `react-native-svg` and targets iOS, Android, and Web.
|
|
4
4
|
|
|
5
|
-
3,
|
|
5
|
+
3,986 icons are available, each with outlined and filled variants, plus support for custom
|
|
6
6
|
SVGs.
|
|
7
7
|
|
|
8
8
|
```bash
|
package/docs/llms.txt
CHANGED
|
@@ -140,6 +140,7 @@ Links point at each page's `content.md`, which carries the page's prose, demo so
|
|
|
140
140
|
|
|
141
141
|
## Release notes
|
|
142
142
|
|
|
143
|
+
- [0.3.4](resources/release-notes/0.3.4/content.md): Select adds multiple selection, in-list search, and a native bottom sheet; Input gains a subtle variant for fields inside popups and sheets.
|
|
143
144
|
- [0.3.3](resources/release-notes/0.3.3/content.md): Insight and InsightStack add dismissible summary cards with status colors, optional AI styling, and stacked depth for insight feeds.
|
|
144
145
|
- [0.3.2](resources/release-notes/0.3.2/content.md): CurrencyInput adds an outline variant for bordered amount fields; BottomSheet opens reliably in optimized web production builds.
|
|
145
146
|
- [0.3.1](resources/release-notes/0.3.1/content.md): DataGrid adds filterMode for server-side search and filters; IconButton adds warning, success, and info color options.
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
# 0.3.4 (https://design.candescent.com/docs/resources/release-notes/0.3.4)
|
|
2
|
+
|
|
3
|
+
Select adds multiple selection, in-list search, and a native bottom sheet; Input gains a subtle variant for fields inside popups and sheets.
|
|
4
|
+
|
|
5
|
+
This release expands **[Select](https://design.candescent.com/docs/components/select/content.md)** for long option lists and native pickers, adds a filled **[Input](https://design.candescent.com/docs/components/input/content.md)** variant for search fields inside overlays, and fixes **[Drawer](https://design.candescent.com/docs/components/drawer/content.md)** permanent panels on web.
|
|
6
|
+
|
|
7
|
+
## What's new
|
|
8
|
+
|
|
9
|
+
**[Select](https://design.candescent.com/docs/components/select/content.md)** — Set **`type="multiple"`** so `value` is a `string[]` and each option press toggles selection while the popup stays open. Use **`Select.ItemControl`** for checkbox affordances and **`Select.Value`** with a function child to read `selectedItems` and `selectedText`; multiple mode joins labels with a comma on one line. Add **`Select.Search`** and **`Select.Empty`** to filter options in single and multiple mode via controllable `inputValue`, `defaultInputValue`, `onInputChange`, and an optional custom `filter`; the query clears when the popup closes and selected values still resolve against the full item list. On iOS and Android, swap **`Select.Content`** for **`Select.BottomSheet`** to present the same search and list regions in the shared picker sheet (web still renders the dropdown). Disabled items no longer receive keyboard highlight. Wrappers that assume `value` is always a `string` should narrow with `Extract<SelectProps, { type?: 'single' }>` ([#857](https://github.com/dfh-candescent/forge-design-system/pull/857)).
|
|
10
|
+
|
|
11
|
+
**[Input](https://design.candescent.com/docs/components/input/content.md)** — Pass **`variant="subtle"`** for a filled, borderless field suited to search inputs inside popovers and bottom sheets. **`Select.Search`** defaults to subtle in both dropdown and sheet paths; override with the search field’s own **`variant`** prop ([#857](https://github.com/dfh-candescent/forge-design-system/pull/857)).
|
|
12
|
+
|
|
13
|
+
## Bug fixes
|
|
14
|
+
|
|
15
|
+
**[Drawer](https://design.candescent.com/docs/components/drawer/content.md)** — A permanent panel on web collapses to zero width when closed instead of leaving an empty surface behind ([#861](https://github.com/dfh-candescent/forge-design-system/pull/861)).
|
|
16
|
+
|
|
17
|
+
**[Select](https://design.candescent.com/docs/components/select/content.md)** — The first option receives highlight when items load or change after the popup opens, so screen readers get a valid `aria-activedescendant` without an arrow key ([#857](https://github.com/dfh-candescent/forge-design-system/pull/857)).
|
|
18
|
+
|
|
19
|
+
## Documentation
|
|
20
|
+
|
|
21
|
+
**Invite User drawer** — Web-only Forms pattern: a permanent right-side drawer with name, email, role select, and a searchable multi-select for teams shown as removable chips ([#861](https://github.com/dfh-candescent/forge-design-system/pull/861)).
|
|
22
|
+
|
|
23
|
+
**Input**, **OTP Input**, and **Insurance Disclosure** — Component page titles use Title Case in the sidebar ([#860](https://github.com/dfh-candescent/forge-design-system/pull/860)).
|
|
24
|
+
|
|
25
|
+
**Text** — New demos for nested inline text, slot composition, and mixed nesting ([#858](https://github.com/dfh-candescent/forge-design-system/pull/858)).
|
|
26
|
+
|
|
27
|
+
**Pattern blocks** — Block section headings on pattern pages are clickable anchor links for deep linking ([#862](https://github.com/dfh-candescent/forge-design-system/pull/862)).
|
|
@@ -8,6 +8,7 @@ Notes are generated from the release commit itself, so the versions and commit r
|
|
|
8
8
|
each entry are exact. Releases that contained nothing but backlog or dependency bookkeeping
|
|
9
9
|
are omitted.
|
|
10
10
|
|
|
11
|
+
- [0.3.4](https://design.candescent.com/docs/resources/release-notes/0.3.4/content.md) — 2026-10-20 — Select adds multiple selection, in-list search, and a native bottom sheet; Input gains a subtle variant for fields inside popups and sheets.
|
|
11
12
|
- [0.3.3](https://design.candescent.com/docs/resources/release-notes/0.3.3/content.md) — 2026-10-15 — Insight and InsightStack add dismissible summary cards with status colors, optional AI styling, and stacked depth for insight feeds.
|
|
12
13
|
- [0.3.2](https://design.candescent.com/docs/resources/release-notes/0.3.2/content.md) — 2026-10-13 — CurrencyInput adds an outline variant for bordered amount fields; BottomSheet opens reliably in optimized web production builds.
|
|
13
14
|
- [0.3.1](https://design.candescent.com/docs/resources/release-notes/0.3.1/content.md) — 2026-10-13 — DataGrid adds filterMode for server-side search and filters; IconButton adds warning, success, and info color options.
|
|
@@ -14,7 +14,9 @@ const chipInteractiveRoot = [_constants.TRANSITION_COLORS, 'data-[disabled=true]
|
|
|
14
14
|
const chipRootVariants = exports.chipRootVariants = (0, _utils.cva)(['flex-row items-center justify-center overflow-hidden web:inline-flex', ...chipInteractiveRoot], {
|
|
15
15
|
variants: {
|
|
16
16
|
variant: {
|
|
17
|
-
|
|
17
|
+
// Explicit `border-0` keeps `borderWidth` defined when a chip switches from `outline`.
|
|
18
|
+
// Android otherwise stops painting the label inside the `overflow-hidden` root.
|
|
19
|
+
subtle: ['border-0'],
|
|
18
20
|
outline: ['bg-transparent', 'border']
|
|
19
21
|
},
|
|
20
22
|
color: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["_reactNative","require","_utils","_constants","chipInteractiveRoot","TRANSITION_COLORS","DISABLED_CURSOR","Platform","select","web","join","default","chipRootVariants","exports","cva","variants","variant","subtle","outline","color","neutral","action","danger","warning","success","info","size","small","xsmall","compoundVariants","className","defaultVariants","chipLabelVariants","chipIconVariants","chipAvatarVariants"],"sourceRoot":"../../../../src","sources":["components/Chip/styles.ts"],"mappings":";;;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AAEA,MAAMG,mBAAmB,GAAG,CAC1BC,4BAAiB,EACjB,wDAAwD,EACxDC,0BAAe,EACfC,qBAAQ,CAACC,MAAM,CAAC;EACdC,GAAG,EAAE,CACH,cAAc,EACd,kIAAkI,CACnI,CAACC,IAAI,CAAC,GAAG,CAAC;EACXC,OAAO,EAAE;AACX,CAAC,CAAC,CACH;AAEM,MAAMC,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAG,IAAAE,UAAG,EACjC,CAAC,sEAAsE,EAAE,GAAGV,mBAAmB,CAAC,EAChG;EACEW,QAAQ,EAAE;IACRC,OAAO,EAAE;
|
|
1
|
+
{"version":3,"names":["_reactNative","require","_utils","_constants","chipInteractiveRoot","TRANSITION_COLORS","DISABLED_CURSOR","Platform","select","web","join","default","chipRootVariants","exports","cva","variants","variant","subtle","outline","color","neutral","action","danger","warning","success","info","size","small","xsmall","compoundVariants","className","defaultVariants","chipLabelVariants","chipIconVariants","chipAvatarVariants"],"sourceRoot":"../../../../src","sources":["components/Chip/styles.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -10,7 +10,9 @@ const chipInteractiveRoot = [TRANSITION_COLORS, 'data-[disabled=true]:opacity-[v
|
|
|
10
10
|
export const chipRootVariants = cva(['flex-row items-center justify-center overflow-hidden web:inline-flex', ...chipInteractiveRoot], {
|
|
11
11
|
variants: {
|
|
12
12
|
variant: {
|
|
13
|
-
|
|
13
|
+
// Explicit `border-0` keeps `borderWidth` defined when a chip switches from `outline`.
|
|
14
|
+
// Android otherwise stops painting the label inside the `overflow-hidden` root.
|
|
15
|
+
subtle: ['border-0'],
|
|
14
16
|
outline: ['bg-transparent', 'border']
|
|
15
17
|
},
|
|
16
18
|
color: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Platform","cva","DISABLED_CURSOR","TRANSITION_COLORS","chipInteractiveRoot","select","web","join","default","chipRootVariants","variants","variant","subtle","outline","color","neutral","action","danger","warning","success","info","size","small","xsmall","compoundVariants","className","defaultVariants","chipLabelVariants","chipIconVariants","chipAvatarVariants"],"sourceRoot":"../../../../src","sources":["components/Chip/styles.ts"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,cAAc;AACvC,SAASC,GAAG,QAA2B,eAAe;AACtD,SAASC,eAAe,EAAEC,iBAAiB,QAAQ,wBAAwB;AAE3E,MAAMC,mBAAmB,GAAG,CAC1BD,iBAAiB,EACjB,wDAAwD,EACxDD,eAAe,EACfF,QAAQ,CAACK,MAAM,CAAC;EACdC,GAAG,EAAE,CACH,cAAc,EACd,kIAAkI,CACnI,CAACC,IAAI,CAAC,GAAG,CAAC;EACXC,OAAO,EAAE;AACX,CAAC,CAAC,CACH;AAED,OAAO,MAAMC,gBAAgB,GAAGR,GAAG,CACjC,CAAC,sEAAsE,EAAE,GAAGG,mBAAmB,CAAC,EAChG;EACEM,QAAQ,EAAE;IACRC,OAAO,EAAE;
|
|
1
|
+
{"version":3,"names":["Platform","cva","DISABLED_CURSOR","TRANSITION_COLORS","chipInteractiveRoot","select","web","join","default","chipRootVariants","variants","variant","subtle","outline","color","neutral","action","danger","warning","success","info","size","small","xsmall","compoundVariants","className","defaultVariants","chipLabelVariants","chipIconVariants","chipAvatarVariants"],"sourceRoot":"../../../../src","sources":["components/Chip/styles.ts"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Chip/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAgBvD,eAAO,MAAM,gBAAgB;;;;
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Chip/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,eAAe,CAAC;AAgBvD,eAAO,MAAM,gBAAgB;;;;8EAuK5B,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;;8EAgC5B,CAAC;AAEH,eAAO,MAAM,gBAAgB;;;8EAoB3B,CAAC;AAEH,eAAO,MAAM,kBAAkB;;8EAW7B,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cdx-ui/components",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -106,10 +106,10 @@
|
|
|
106
106
|
"@marceloterreiro/flash-calendar": "2.0.0",
|
|
107
107
|
"react-native-reanimated-carousel": "5.0.0-beta.5",
|
|
108
108
|
"uniwind": "1.10.0",
|
|
109
|
-
"@cdx-ui/
|
|
110
|
-
"@cdx-ui/
|
|
111
|
-
"@cdx-ui/icons": "0.3.
|
|
112
|
-
"@cdx-ui/
|
|
109
|
+
"@cdx-ui/utils": "0.3.5",
|
|
110
|
+
"@cdx-ui/formatters": "0.3.5",
|
|
111
|
+
"@cdx-ui/icons": "0.3.5",
|
|
112
|
+
"@cdx-ui/primitives": "0.3.5"
|
|
113
113
|
},
|
|
114
114
|
"devDependencies": {
|
|
115
115
|
"@dnd-kit/core": "6.3.1",
|
|
@@ -20,7 +20,9 @@ export const chipRootVariants = cva(
|
|
|
20
20
|
{
|
|
21
21
|
variants: {
|
|
22
22
|
variant: {
|
|
23
|
-
|
|
23
|
+
// Explicit `border-0` keeps `borderWidth` defined when a chip switches from `outline`.
|
|
24
|
+
// Android otherwise stops painting the label inside the `overflow-hidden` root.
|
|
25
|
+
subtle: ['border-0'],
|
|
24
26
|
outline: ['bg-transparent', 'border'],
|
|
25
27
|
},
|
|
26
28
|
color: {
|