@coinbase/cds-web 9.14.0 → 9.16.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/CHANGELOG.md +18 -0
- package/dts/accordion/Accordion.d.ts +27 -4
- package/dts/accordion/Accordion.d.ts.map +1 -1
- package/dts/accordion/AccordionHeader.d.ts +36 -4
- package/dts/accordion/AccordionHeader.d.ts.map +1 -1
- package/dts/accordion/AccordionItem.d.ts +26 -15
- package/dts/accordion/AccordionItem.d.ts.map +1 -1
- package/dts/accordion/AccordionPanel.d.ts +7 -1
- package/dts/accordion/AccordionPanel.d.ts.map +1 -1
- package/dts/alpha/select-chip/SelectChip.d.ts +6 -12
- package/dts/alpha/select-chip/SelectChip.d.ts.map +1 -1
- package/dts/alpha/select-chip/SelectChipControl.d.ts +50 -5
- package/dts/alpha/select-chip/SelectChipControl.d.ts.map +1 -1
- package/dts/alpha/select-chip/index.d.ts +1 -1
- package/dts/alpha/select-chip/index.d.ts.map +1 -1
- package/dts/alpha/tabbed-chips/TabbedChips.d.ts +4 -1
- package/dts/alpha/tabbed-chips/TabbedChips.d.ts.map +1 -1
- package/dts/chips/Chip.d.ts.map +1 -1
- package/dts/chips/ChipProps.d.ts +36 -2
- package/dts/chips/ChipProps.d.ts.map +1 -1
- package/dts/chips/InputChip.d.ts.map +1 -1
- package/dts/collapsible/Collapsible.d.ts +7 -1
- package/dts/collapsible/Collapsible.d.ts.map +1 -1
- package/dts/controls/Switch.d.ts +14 -0
- package/dts/controls/Switch.d.ts.map +1 -1
- package/dts/core/componentConfig.d.ts +2 -0
- package/dts/core/componentConfig.d.ts.map +1 -1
- package/dts/tabs/SegmentedTabs.d.ts +11 -1
- package/dts/tabs/SegmentedTabs.d.ts.map +1 -1
- package/dts/visualizations/chart/PeriodSelector.d.ts +3 -2
- package/dts/visualizations/chart/PeriodSelector.d.ts.map +1 -1
- package/esm/accordion/Accordion.js +28 -6
- package/esm/accordion/AccordionHeader.js +51 -14
- package/esm/accordion/AccordionItem.js +64 -6
- package/esm/accordion/AccordionPanel.js +5 -1
- package/esm/alpha/select-chip/SelectChip.js +58 -29
- package/esm/alpha/select-chip/SelectChipControl.js +41 -11
- package/esm/alpha/select-chip/index.js +1 -1
- package/esm/alpha/tabbed-chips/TabbedChips.js +3 -2
- package/esm/chips/Chip.js +15 -7
- package/esm/chips/InputChip.js +25 -6
- package/esm/collapsible/Collapsible.js +7 -3
- package/esm/controls/Switch.js +14 -2
- package/esm/tabs/SegmentedTabs.css +2 -0
- package/esm/tabs/SegmentedTabs.js +21 -6
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -8,6 +8,24 @@ All notable changes to this project will be documented in this file.
|
|
|
8
8
|
|
|
9
9
|
<!-- template-start -->
|
|
10
10
|
|
|
11
|
+
## 9.16.0 (8/13/2026 PST)
|
|
12
|
+
|
|
13
|
+
#### 🚀 Updates
|
|
14
|
+
|
|
15
|
+
- Deprecate invertColorScheme in favor of new, canoncical active prop for the Chip family of props. [[#843](https://github.com/coinbase/cds/pull/843)]
|
|
16
|
+
|
|
17
|
+
## 9.15.0 (8/11/2026 PST)
|
|
18
|
+
|
|
19
|
+
#### 🚀 Updates
|
|
20
|
+
|
|
21
|
+
[[#839](https://github.com/coinbase/cds/pull/839)]
|
|
22
|
+
|
|
23
|
+
- Add new prop: variant to Switch component.
|
|
24
|
+
- Add new prop: showItemSeparators to Accordion component.
|
|
25
|
+
- Add new prop: showHeaderBorder to AccordionItem component.
|
|
26
|
+
- Add AccordionItem to ComponentConfig system.
|
|
27
|
+
- Add new prop: equalWidth to SegmentedTabs component.
|
|
28
|
+
|
|
11
29
|
## 9.14.0 (8/11/2026 PST)
|
|
12
30
|
|
|
13
31
|
#### 🚀 Updates
|
|
@@ -1,9 +1,32 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type AccordionProviderProps } from '@coinbase/cds-common/accordion/AccordionProvider';
|
|
3
|
+
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
|
|
3
4
|
import type { SharedProps } from '@coinbase/cds-common/types/SharedProps';
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
import type { StylesAndClassNames } from '../types';
|
|
6
|
+
/**
|
|
7
|
+
* Static class names for Accordion component parts.
|
|
8
|
+
* Use these selectors to target specific elements with CSS.
|
|
9
|
+
*/
|
|
10
|
+
export declare const accordionClassNames: {
|
|
11
|
+
/** Root element */
|
|
12
|
+
readonly root: 'cds-Accordion';
|
|
7
13
|
};
|
|
8
|
-
export
|
|
14
|
+
export type AccordionBaseProps = SharedProps &
|
|
15
|
+
AccordionProviderProps & {
|
|
16
|
+
/** Border radius of the accordion root container */
|
|
17
|
+
borderRadius?: ThemeVars.BorderRadius;
|
|
18
|
+
/**
|
|
19
|
+
* Show a divider between each accordion item.
|
|
20
|
+
* @default true
|
|
21
|
+
*/
|
|
22
|
+
showItemSeparators?: boolean;
|
|
23
|
+
};
|
|
24
|
+
export type AccordionProps = AccordionBaseProps &
|
|
25
|
+
StylesAndClassNames<typeof accordionClassNames> & {
|
|
26
|
+
className?: string;
|
|
27
|
+
style?: React.CSSProperties;
|
|
28
|
+
};
|
|
29
|
+
export declare const Accordion: React.MemoExoticComponent<
|
|
30
|
+
(_props: AccordionProps) => import('react/jsx-runtime').JSX.Element
|
|
31
|
+
>;
|
|
9
32
|
//# sourceMappingURL=Accordion.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../src/accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../src/accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyB,MAAM,OAAO,CAAC;AAC9C,OAAO,EAEL,KAAK,sBAAsB,EAC5B,MAAM,kDAAkD,CAAC;AAC1D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAO1E,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAEpD;;;GAGG;AACH,eAAO,MAAM,mBAAmB;IAC9B,mBAAmB;;CAEX,CAAC;AAEX,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAC1C,sBAAsB,GAAG;IACvB,oDAAoD;IACpD,YAAY,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC;IACtC;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEJ,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,mBAAmB,CAAC,OAAO,mBAAmB,CAAC,GAAG;IAChD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEJ,eAAO,MAAM,SAAS,qCAAiB,cAAc,6CAoCnD,CAAC"}
|
|
@@ -1,6 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
|
|
3
|
+
import type { IconSize } from '@coinbase/cds-common/types/IconSize';
|
|
2
4
|
import type { SharedProps } from '@coinbase/cds-common/types/SharedProps';
|
|
5
|
+
import type { PaddingProps } from '@coinbase/cds-common/types/SpacingProps';
|
|
3
6
|
import type { CollapsibleBaseProps } from '../collapsible/Collapsible';
|
|
7
|
+
import { type HStackBaseProps } from '../layout/HStack';
|
|
4
8
|
export type AccordionMediaBaseProps = {
|
|
5
9
|
media?: React.ReactNode;
|
|
6
10
|
};
|
|
@@ -18,11 +22,17 @@ export type AccordionTitleBaseProps = {
|
|
|
18
22
|
*/
|
|
19
23
|
tertiaryTitle?: string;
|
|
20
24
|
};
|
|
21
|
-
export type AccordionIconBaseProps = Pick<CollapsibleBaseProps, 'collapsed'
|
|
25
|
+
export type AccordionIconBaseProps = Pick<CollapsibleBaseProps, 'collapsed'> & {
|
|
26
|
+
/** Size of the caret icon.
|
|
27
|
+
* @default s
|
|
28
|
+
*/
|
|
29
|
+
caretSize?: IconSize;
|
|
30
|
+
};
|
|
22
31
|
export type AccordionHeaderBaseProps = SharedProps &
|
|
23
32
|
AccordionMediaBaseProps &
|
|
24
33
|
AccordionTitleBaseProps &
|
|
25
|
-
AccordionIconBaseProps &
|
|
34
|
+
AccordionIconBaseProps &
|
|
35
|
+
Pick<HStackBaseProps, keyof PaddingProps> & {
|
|
26
36
|
/**
|
|
27
37
|
* Callback function fired when the accordion item is clicked
|
|
28
38
|
*/
|
|
@@ -33,7 +43,16 @@ export type AccordionHeaderBaseProps = SharedProps &
|
|
|
33
43
|
* unless you want multiple items to be controlled at the same time.
|
|
34
44
|
*/
|
|
35
45
|
itemKey: string;
|
|
46
|
+
/**
|
|
47
|
+
* Background color of the header pressable.
|
|
48
|
+
* @default bg
|
|
49
|
+
*/
|
|
50
|
+
background?: ThemeVars.Color;
|
|
36
51
|
};
|
|
52
|
+
export type AccordionHeaderProps = AccordionHeaderBaseProps & {
|
|
53
|
+
className?: string;
|
|
54
|
+
style?: React.CSSProperties;
|
|
55
|
+
};
|
|
37
56
|
type AccordionMediaProps = AccordionMediaBaseProps;
|
|
38
57
|
export declare const AccordionMedia: React.MemoExoticComponent<
|
|
39
58
|
({ media }: AccordionMediaProps) => import('react/jsx-runtime').JSX.Element
|
|
@@ -48,7 +67,7 @@ export declare const AccordionTitle: React.MemoExoticComponent<
|
|
|
48
67
|
>;
|
|
49
68
|
type AccordionIconProps = AccordionIconBaseProps;
|
|
50
69
|
export declare const AccordionIcon: React.MemoExoticComponent<
|
|
51
|
-
({ collapsed }: AccordionIconProps) => import('react/jsx-runtime').JSX.Element
|
|
70
|
+
({ collapsed, caretSize }: AccordionIconProps) => import('react/jsx-runtime').JSX.Element
|
|
52
71
|
>;
|
|
53
72
|
/**
|
|
54
73
|
* Renders a Pressable element to use as the header to an AccordionItem.
|
|
@@ -58,7 +77,12 @@ export declare const AccordionHeader: React.NamedExoticComponent<
|
|
|
58
77
|
SharedProps &
|
|
59
78
|
AccordionMediaBaseProps &
|
|
60
79
|
AccordionTitleBaseProps &
|
|
61
|
-
|
|
80
|
+
Pick<CollapsibleBaseProps, 'collapsed'> & {
|
|
81
|
+
/** Size of the caret icon.
|
|
82
|
+
* @default s
|
|
83
|
+
*/
|
|
84
|
+
caretSize?: IconSize;
|
|
85
|
+
} & Pick<import('../layout').BoxBaseProps, keyof PaddingProps> & {
|
|
62
86
|
/**
|
|
63
87
|
* Callback function fired when the accordion item is clicked
|
|
64
88
|
*/
|
|
@@ -69,6 +93,14 @@ export declare const AccordionHeader: React.NamedExoticComponent<
|
|
|
69
93
|
* unless you want multiple items to be controlled at the same time.
|
|
70
94
|
*/
|
|
71
95
|
itemKey: string;
|
|
96
|
+
/**
|
|
97
|
+
* Background color of the header pressable.
|
|
98
|
+
* @default bg
|
|
99
|
+
*/
|
|
100
|
+
background?: ThemeVars.Color;
|
|
101
|
+
} & {
|
|
102
|
+
className?: string;
|
|
103
|
+
style?: React.CSSProperties;
|
|
72
104
|
} & React.RefAttributes<HTMLButtonElement>
|
|
73
105
|
>;
|
|
74
106
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionHeader.d.ts","sourceRoot":"","sources":["../../src/accordion/AccordionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"AccordionHeader.d.ts","sourceRoot":"","sources":["../../src/accordion/AccordionHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiD,MAAM,OAAO,CAAC;AAMtE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAEjE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,qCAAqC,CAAC;AACpE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AAI5E,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAGvE,OAAO,EAAU,KAAK,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAQhE,MAAM,MAAM,uBAAuB,GAAG;IAEpC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG;IACpC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CAAC,oBAAoB,EAAE,WAAW,CAAC,GAAG;IAC7E;;OAEG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,WAAW,GAChD,uBAAuB,GACvB,uBAAuB,GACvB,sBAAsB,GACtB,IAAI,CAAC,eAAe,EAAE,MAAM,YAAY,CAAC,GAAG;IAC1C;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;CAC9B,CAAC;AAEJ,MAAM,MAAM,oBAAoB,GAAG,wBAAwB,GAAG;IAC5D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AA4BF,KAAK,mBAAmB,GAAG,uBAAuB,CAAC;AAEnD,eAAO,MAAM,cAAc,wCAAoB,mBAAmB,6CAIhE,CAAC;AAEH,KAAK,mBAAmB,GAAG,uBAAuB,CAAC;AAEnD,eAAO,MAAM,cAAc,iEAA6C,mBAAmB,6CAgCzF,CAAC;AAEH,KAAK,kBAAkB,GAAG,sBAAsB,CAAC;AAEjD,eAAO,MAAM,aAAa,uDAAyC,kBAAkB,6CASnF,CAAC;AAEH;;;GAGG;AACH,eAAO,MAAM,eAAe;IAxH1B;;OAEG;gBACS,QAAQ;;IAQlB;;OAEG;cACO,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI;IAC/B;;;;OAIG;aACM,MAAM;IACf;;;OAGG;iBACU,SAAS,CAAC,KAAK;;gBAIlB,MAAM;YACV,KAAK,CAAC,aAAa;2CA0K5B,CAAC"}
|
|
@@ -1,32 +1,43 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
|
|
3
|
+
import type { StylesAndClassNames } from '../types';
|
|
2
4
|
import { type AccordionHeaderBaseProps } from './AccordionHeader';
|
|
3
5
|
import { type AccordionPanelBaseProps } from './AccordionPanel';
|
|
6
|
+
/**
|
|
7
|
+
* Static class names for AccordionItem component parts.
|
|
8
|
+
* Use these selectors to target specific elements with CSS.
|
|
9
|
+
*/
|
|
10
|
+
export declare const accordionItemClassNames: {
|
|
11
|
+
/** Root element */
|
|
12
|
+
readonly root: 'cds-AccordionItem';
|
|
13
|
+
/** Header pressable element */
|
|
14
|
+
readonly header: 'cds-AccordionItem-header';
|
|
15
|
+
/** Collapsible panel container element */
|
|
16
|
+
readonly panel: 'cds-AccordionItem-panel';
|
|
17
|
+
};
|
|
4
18
|
export type AccordionItemBaseProps = Omit<AccordionHeaderBaseProps, 'collapsed'> &
|
|
5
19
|
Pick<AccordionPanelBaseProps, 'maxHeight' | 'children'> & {
|
|
6
20
|
headerRef?: React.RefObject<HTMLButtonElement | null>;
|
|
7
21
|
panelRef?: React.RefObject<HTMLDivElement | null>;
|
|
22
|
+
/**
|
|
23
|
+
* Show a border between the header and panel.
|
|
24
|
+
* @default false
|
|
25
|
+
*/
|
|
26
|
+
showHeaderBorder?: boolean;
|
|
27
|
+
/** Border radius of the accordion item root container */
|
|
28
|
+
borderRadius?: ThemeVars.BorderRadius;
|
|
29
|
+
};
|
|
30
|
+
export type AccordionItemProps = AccordionItemBaseProps &
|
|
31
|
+
StylesAndClassNames<typeof accordionItemClassNames> & {
|
|
32
|
+
className?: string;
|
|
8
33
|
style?: React.CSSProperties;
|
|
9
34
|
};
|
|
10
|
-
export type AccordionItemProps = AccordionItemBaseProps;
|
|
11
35
|
/**
|
|
12
36
|
* A component that represents a single item within an Accordion.
|
|
13
37
|
* It composes together an AccordionHeader and a collapsible AccordionPanel.
|
|
14
38
|
* Accepts a unique `itemKey` prop to uniquely identify one item from another within the same Accordion.
|
|
15
39
|
*/
|
|
16
40
|
export declare const AccordionItem: React.MemoExoticComponent<
|
|
17
|
-
(
|
|
18
|
-
itemKey,
|
|
19
|
-
title,
|
|
20
|
-
subtitle,
|
|
21
|
-
tertiaryTitle,
|
|
22
|
-
children,
|
|
23
|
-
onClick,
|
|
24
|
-
media,
|
|
25
|
-
testID,
|
|
26
|
-
headerRef,
|
|
27
|
-
panelRef,
|
|
28
|
-
maxHeight,
|
|
29
|
-
style,
|
|
30
|
-
}: AccordionItemProps) => import('react/jsx-runtime').JSX.Element
|
|
41
|
+
(_props: AccordionItemProps) => import('react/jsx-runtime').JSX.Element
|
|
31
42
|
>;
|
|
32
43
|
//# sourceMappingURL=AccordionItem.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionItem.d.ts","sourceRoot":"","sources":["../../src/accordion/AccordionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"AccordionItem.d.ts","sourceRoot":"","sources":["../../src/accordion/AccordionItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAe,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAOjE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAEpD,OAAO,EAAmB,KAAK,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AACnF,OAAO,EAAkB,KAAK,uBAAuB,EAAE,MAAM,kBAAkB,CAAC;AAEhF;;;GAGG;AACH,eAAO,MAAM,uBAAuB;IAClC,mBAAmB;;IAEnB,+BAA+B;;IAE/B,0CAA0C;;CAElC,CAAC;AAEX,MAAM,MAAM,sBAAsB,GAAG,IAAI,CAAC,wBAAwB,EAAE,WAAW,CAAC,GAC9E,IAAI,CAAC,uBAAuB,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IACxD,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;IACtD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAClD;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,yDAAyD;IACzD,YAAY,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC;CACvC,CAAC;AAEJ,MAAM,MAAM,kBAAkB,GAAG,sBAAsB,GACrD,mBAAmB,CAAC,OAAO,uBAAuB,CAAC,GAAG;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEJ;;;;GAIG;AACH,eAAO,MAAM,aAAa,qCAAiB,kBAAkB,6CAsF3D,CAAC"}
|
|
@@ -11,7 +11,10 @@ export type AccordionPanelBaseProps = SharedProps &
|
|
|
11
11
|
itemKey: string;
|
|
12
12
|
maxHeight?: CollapsibleBaseProps['maxHeight'];
|
|
13
13
|
};
|
|
14
|
-
export type AccordionPanelProps = AccordionPanelBaseProps
|
|
14
|
+
export type AccordionPanelProps = AccordionPanelBaseProps & {
|
|
15
|
+
className?: string;
|
|
16
|
+
style?: React.CSSProperties;
|
|
17
|
+
};
|
|
15
18
|
/**
|
|
16
19
|
* Renders a collapsible element to use as the primary content container for an AccordionItem.
|
|
17
20
|
* Accepts a unique `itemKey` prop to uniquely identify one panel from another.
|
|
@@ -26,6 +29,9 @@ export declare const AccordionPanel: React.NamedExoticComponent<
|
|
|
26
29
|
*/
|
|
27
30
|
itemKey: string;
|
|
28
31
|
maxHeight?: CollapsibleBaseProps['maxHeight'];
|
|
32
|
+
} & {
|
|
33
|
+
className?: string;
|
|
34
|
+
style?: React.CSSProperties;
|
|
29
35
|
} & React.RefAttributes<HTMLDivElement>
|
|
30
36
|
>;
|
|
31
37
|
//# sourceMappingURL=AccordionPanel.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccordionPanel.d.ts","sourceRoot":"","sources":["../../src/accordion/AccordionPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAGhD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAE1E,OAAO,EAAe,KAAK,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAIpF,MAAM,MAAM,uBAAuB,GAAG,WAAW,GAC/C,IAAI,CAAC,oBAAoB,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IACrD;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,oBAAoB,CAAC,WAAW,CAAC,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,mBAAmB,GAAG,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"AccordionPanel.d.ts","sourceRoot":"","sources":["../../src/accordion/AccordionPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAGhD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAE1E,OAAO,EAAe,KAAK,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAIpF,MAAM,MAAM,uBAAuB,GAAG,WAAW,GAC/C,IAAI,CAAC,oBAAoB,EAAE,WAAW,GAAG,UAAU,CAAC,GAAG;IACrD;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,oBAAoB,CAAC,WAAW,CAAC,CAAC;CAC/C,CAAC;AAEJ,MAAM,MAAM,mBAAmB,GAAG,uBAAuB,GAAG;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,cAAc;IAlBvB;;;;OAIG;aACM,MAAM;gBACH,oBAAoB,CAAC,WAAW,CAAC;;gBAInC,MAAM;YACV,KAAK,CAAC,aAAa;wCAwC5B,CAAC"}
|
|
@@ -1,18 +1,8 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type { ChipBaseProps } from '../../chips/ChipProps';
|
|
3
2
|
import { type SelectRef } from '../select/Select';
|
|
4
3
|
import type { SelectProps, SelectType } from '../select/types';
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
'invertColorScheme' | 'numberOfLines' | 'maxWidth' | 'size' | 'compact'
|
|
8
|
-
> & {
|
|
9
|
-
/**
|
|
10
|
-
* Override the displayed value in the chip control.
|
|
11
|
-
* Useful for avoiding truncation, especially in multi-select scenarios where multiple option labels might be too long to display.
|
|
12
|
-
* When provided, this value takes precedence over the default label generation.
|
|
13
|
-
*/
|
|
14
|
-
displayValue?: React.ReactNode;
|
|
15
|
-
};
|
|
4
|
+
import { type SelectChipControlChipProps, type SelectChipControlProps } from './SelectChipControl';
|
|
5
|
+
export type SelectChipBaseProps = Pick<SelectChipControlProps, keyof SelectChipControlChipProps>;
|
|
16
6
|
export type SelectChipProps<
|
|
17
7
|
Type extends SelectType = 'single',
|
|
18
8
|
SelectOptionValue extends string = string,
|
|
@@ -26,6 +16,10 @@ export type SelectChipProps<
|
|
|
26
16
|
| 'maxWidth'
|
|
27
17
|
| 'size'
|
|
28
18
|
| 'compact'
|
|
19
|
+
| 'bordered'
|
|
20
|
+
| 'borderWidth'
|
|
21
|
+
| 'borderColor'
|
|
22
|
+
| 'borderRadius'
|
|
29
23
|
>;
|
|
30
24
|
export declare const SelectChip: <
|
|
31
25
|
Type extends SelectType = 'single',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectChip.d.ts","sourceRoot":"","sources":["../../../src/alpha/select-chip/SelectChip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"SelectChip.d.ts","sourceRoot":"","sources":["../../../src/alpha/select-chip/SelectChip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAIzD,OAAO,EAAU,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,KAAK,EAAsB,WAAW,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAEnF,OAAO,EAEL,KAAK,0BAA0B,EAC/B,KAAK,sBAAsB,EAC5B,MAAM,qBAAqB,CAAC;AAE7B,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,sBAAsB,EAAE,MAAM,0BAA0B,CAAC,CAAC;AAEjG,MAAM,MAAM,eAAe,CACzB,IAAI,SAAS,UAAU,GAAG,QAAQ,EAClC,iBAAiB,SAAS,MAAM,GAAG,MAAM,IACvC,mBAAmB,GACrB,IAAI,CACF,WAAW,CAAC,IAAI,EAAE,iBAAiB,CAAC,EAClC,wBAAwB,GACxB,YAAY,GACZ,cAAc,GACd,SAAS,GACT,UAAU,GACV,MAAM,GACN,SAAS,GACT,UAAU,GACV,aAAa,GACb,aAAa,GACb,cAAc,CACjB,CAAC;AAuIJ,eAAO,MAAM,UAAU,EAA0B,CAC/C,IAAI,SAAS,UAAU,GAAG,QAAQ,EAClC,iBAAiB,SAAS,MAAM,GAAG,MAAM,EAEzC,KAAK,EAAE,eAAe,CAAC,IAAI,EAAE,iBAAiB,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;CAAE,KAC7E,KAAK,CAAC,YAAY,CAAC"}
|
|
@@ -1,13 +1,58 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
+
import type { ChipBaseProps } from '../../chips/ChipProps';
|
|
2
3
|
import { type SelectControlProps, type SelectType } from '../select/types';
|
|
3
|
-
|
|
4
|
+
/**
|
|
5
|
+
* Chip props accepted by {@link SelectChipControl} and forwarded to {@link MediaChip}.
|
|
6
|
+
* Includes selection state, layout, borders, and `displayValue` for the control label.
|
|
7
|
+
*/
|
|
8
|
+
export type SelectChipControlChipProps = Pick<
|
|
9
|
+
ChipBaseProps,
|
|
10
|
+
| 'active'
|
|
11
|
+
| 'activeBackground'
|
|
12
|
+
| 'activeColor'
|
|
13
|
+
| 'background'
|
|
14
|
+
| 'color'
|
|
15
|
+
| 'invertColorScheme'
|
|
16
|
+
| 'inverted'
|
|
17
|
+
| 'numberOfLines'
|
|
18
|
+
| 'maxWidth'
|
|
19
|
+
| 'size'
|
|
20
|
+
| 'compact'
|
|
21
|
+
| 'borderWidth'
|
|
22
|
+
| 'borderColor'
|
|
23
|
+
| 'bordered'
|
|
24
|
+
| 'borderRadius'
|
|
25
|
+
> & {
|
|
26
|
+
/**
|
|
27
|
+
* Override the displayed value in the chip control.
|
|
28
|
+
* Useful for avoiding truncation, especially in multi-select scenarios where multiple option labels might be too long to display.
|
|
29
|
+
* When provided, this value takes precedence over the default label generation.
|
|
30
|
+
*/
|
|
31
|
+
displayValue?: React.ReactNode;
|
|
32
|
+
};
|
|
33
|
+
/**
|
|
34
|
+
* SelectControlProps fields superseded by {@link SelectChipControlChipProps}.
|
|
35
|
+
* Omit is required: intersection would merge overlapping keys (e.g. `size` as SelectSize &
|
|
36
|
+
* ChipSize, `background` as responsive Box vs chip tokens) instead of replacing select-scale
|
|
37
|
+
* definitions.
|
|
38
|
+
*/
|
|
39
|
+
type SelectControlPropsReplacedByChipProps = keyof Pick<
|
|
40
|
+
SelectControlProps,
|
|
41
|
+
'size' | 'compact' | 'borderWidth' | 'borderColor' | 'bordered' | 'borderRadius'
|
|
42
|
+
>;
|
|
43
|
+
export type SelectChipControlProps<
|
|
44
|
+
Type extends SelectType = 'single',
|
|
45
|
+
SelectOptionValue extends string = string,
|
|
46
|
+
> = Omit<SelectControlProps<Type, SelectOptionValue>, SelectControlPropsReplacedByChipProps> &
|
|
47
|
+
SelectChipControlChipProps;
|
|
48
|
+
/** Generic memo components need an explicit cast for the public polymorphic signature. */
|
|
4
49
|
export declare const SelectChipControl: <
|
|
5
50
|
Type extends SelectType,
|
|
6
51
|
SelectOptionValue extends string = string,
|
|
7
52
|
>(
|
|
8
|
-
props:
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
},
|
|
53
|
+
props: SelectChipControlProps<Type, SelectOptionValue> & {
|
|
54
|
+
ref?: React.Ref<HTMLElement>;
|
|
55
|
+
},
|
|
12
56
|
) => React.ReactElement;
|
|
57
|
+
export {};
|
|
13
58
|
//# sourceMappingURL=SelectChipControl.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectChipControl.d.ts","sourceRoot":"","sources":["../../../src/alpha/select-chip/SelectChipControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"SelectChipControl.d.ts","sourceRoot":"","sources":["../../../src/alpha/select-chip/SelectChipControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAGzD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAI3D,OAAO,EAEL,KAAK,kBAAkB,EAEvB,KAAK,UAAU,EAChB,MAAM,iBAAiB,CAAC;AAEzB;;;GAGG;AACH,MAAM,MAAM,0BAA0B,GAAG,IAAI,CAC3C,aAAa,EACX,QAAQ,GACR,kBAAkB,GAClB,aAAa,GACb,YAAY,GACZ,OAAO,GACP,mBAAmB,GACnB,UAAU,GACV,eAAe,GACf,UAAU,GACV,MAAM,GACN,SAAS,GACT,aAAa,GACb,aAAa,GACb,UAAU,GACV,cAAc,CACjB,GAAG;IACF;;;;OAIG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAChC,CAAC;AAEF;;;;;GAKG;AACH,KAAK,qCAAqC,GAAG,MAAM,IAAI,CACrD,kBAAkB,EAClB,MAAM,GAAG,SAAS,GAAG,aAAa,GAAG,aAAa,GAAG,UAAU,GAAG,cAAc,CACjF,CAAC;AAEF,MAAM,MAAM,sBAAsB,CAChC,IAAI,SAAS,UAAU,GAAG,QAAQ,EAClC,iBAAiB,SAAS,MAAM,GAAG,MAAM,IACvC,IAAI,CAAC,kBAAkB,CAAC,IAAI,EAAE,iBAAiB,CAAC,EAAE,qCAAqC,CAAC,GAC1F,0BAA0B,CAAC;AA0K7B,0FAA0F;AAC1F,eAAO,MAAM,iBAAiB,EAAiC,CAC7D,IAAI,SAAS,UAAU,EACvB,iBAAiB,SAAS,MAAM,GAAG,MAAM,EAEzC,KAAK,EAAE,sBAAsB,CAAC,IAAI,EAAE,iBAAiB,CAAC,GAAG;IACvD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;CAC9B,KACE,KAAK,CAAC,YAAY,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/alpha/select-chip/index.tsx"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/alpha/select-chip/index.tsx"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC"}
|
|
@@ -15,11 +15,14 @@ export type TabbedChipProps<TabId extends string = string> = Omit<
|
|
|
15
15
|
Component?: React.FC<Omit<ChipProps, 'children'> & TabValue<TabId>>;
|
|
16
16
|
/**
|
|
17
17
|
* Custom background color applied to the chip when it is the active tab.
|
|
18
|
-
*
|
|
18
|
+
* Skips color-scheme inversion and paints this token directly. Any `start`,
|
|
19
|
+
* `end`, or custom tab content must set explicit colors to match.
|
|
19
20
|
*/
|
|
20
21
|
activeBackground?: MediaChipBaseProps['background'];
|
|
21
22
|
/**
|
|
22
23
|
* Custom foreground color applied to the chip label when it is the active tab.
|
|
24
|
+
* Skips color-scheme inversion when set. Any `start`, `end`, or custom tab
|
|
25
|
+
* content must set explicit colors to match.
|
|
23
26
|
*/
|
|
24
27
|
activeColor?: MediaChipBaseProps['color'];
|
|
25
28
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabbedChips.d.ts","sourceRoot":"","sources":["../../../src/alpha/tabbed-chips/TabbedChips.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8E,MAAM,OAAO,CAAC;AACnG,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAEjE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAClE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,qDAAqD,CAAC;AACpG,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAG1E,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,EAAa,KAAK,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAI3E,OAAO,EAAU,KAAK,oBAAoB,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAE1F,OAAO,EAGL,KAAK,aAAa,EAClB,KAAK,SAAS,EACf,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"TabbedChips.d.ts","sourceRoot":"","sources":["../../../src/alpha/tabbed-chips/TabbedChips.tsx"],"names":[],"mappings":"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"}
|
package/dts/chips/Chip.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../src/chips/Chip.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvD,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC;AAqBpC;;;;GAIG;AACH,eAAO,MAAM,IAAI,
|
|
1
|
+
{"version":3,"file":"Chip.d.ts","sourceRoot":"","sources":["../../src/chips/Chip.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvD,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC;AAqBpC;;;;GAIG;AACH,eAAO,MAAM,IAAI,4JAiJhB,CAAC"}
|
package/dts/chips/ChipProps.d.ts
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
|
+
import type { ThemeVars } from '@coinbase/cds-common/core/theme';
|
|
1
2
|
import type { SharedAccessibilityProps } from '@coinbase/cds-common/types/SharedAccessibilityProps';
|
|
2
3
|
import type { SharedProps } from '@coinbase/cds-common/types/SharedProps';
|
|
4
|
+
import type { StyleProps } from '../styles/styleProps';
|
|
3
5
|
import type {
|
|
4
6
|
PressableBaseProps,
|
|
5
7
|
PressableDefaultElement,
|
|
@@ -30,18 +32,50 @@ export type ChipBaseProps = SharedProps &
|
|
|
30
32
|
* @default 200
|
|
31
33
|
*/
|
|
32
34
|
maxWidth?: PressableBaseProps['maxWidth'];
|
|
35
|
+
/**
|
|
36
|
+
* When true, emphasizes the Chip with higher contrast by inverting the color
|
|
37
|
+
* scheme for everything rendered inside the Chip — including `background`,
|
|
38
|
+
* `color`, icons, and other token-based colors. Those props are resolved
|
|
39
|
+
* against the opposite color scheme, matching the legacy `invertColorScheme`
|
|
40
|
+
* behavior.
|
|
41
|
+
*
|
|
42
|
+
* Set `activeBackground` and/or `activeColor` to opt out of inversion and
|
|
43
|
+
* paint explicit active colors instead.
|
|
44
|
+
* @default false
|
|
45
|
+
*/
|
|
46
|
+
active?: boolean;
|
|
47
|
+
/**
|
|
48
|
+
* Background color applied when `active` is true. When set, the Chip skips
|
|
49
|
+
* color-scheme inversion and uses this token directly.
|
|
50
|
+
*
|
|
51
|
+
* **Warning:** `start`, `end`, and `children` ReactNodes are not updated
|
|
52
|
+
* automatically — pass explicit `color` props on nested icons and other
|
|
53
|
+
* content so they match the active palette.
|
|
54
|
+
*/
|
|
55
|
+
activeBackground?: ThemeVars.Color;
|
|
56
|
+
/**
|
|
57
|
+
* Foreground color applied when `active` is true. When set, the Chip skips
|
|
58
|
+
* color-scheme inversion and uses this token for string labels.
|
|
59
|
+
*
|
|
60
|
+
* **Warning:** `start`, `end`, and `children` ReactNodes are not updated
|
|
61
|
+
* automatically — pass explicit `color` props on nested icons and other
|
|
62
|
+
* content so they match the active palette.
|
|
63
|
+
*/
|
|
64
|
+
activeColor?: StyleProps['color'];
|
|
33
65
|
/**
|
|
34
66
|
* Invert the foreground and background colors to emphasize the Chip.
|
|
35
67
|
* Depending on your theme, it may be dangerous to use this prop in conjunction with `transparentWhileInactive`.
|
|
36
68
|
* @default false
|
|
37
|
-
* @deprecated Use the
|
|
38
|
-
* @deprecationExpectedRemoval
|
|
69
|
+
* @deprecated Use the `active` prop instead. This will be removed in a future major release.
|
|
70
|
+
* @deprecationExpectedRemoval v11
|
|
39
71
|
*/
|
|
40
72
|
inverted?: boolean;
|
|
41
73
|
/**
|
|
42
74
|
* Invert the foreground and background colors to emphasize the Chip.
|
|
43
75
|
* Depending on your theme, it may be dangerous to use this prop in conjunction with `transparentWhileInactive`.
|
|
44
76
|
* @default false
|
|
77
|
+
* @deprecated Use the `active` prop instead. This will be removed in a future major release.
|
|
78
|
+
* @deprecationExpectedRemoval v11
|
|
45
79
|
*/
|
|
46
80
|
invertColorScheme?: boolean;
|
|
47
81
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChipProps.d.ts","sourceRoot":"","sources":["../../src/chips/ChipProps.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,qDAAqD,CAAC;AACpG,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAE1E,OAAO,KAAK,EACV,kBAAkB,EAClB,uBAAuB,EACvB,cAAc,EACf,MAAM,qBAAqB,CAAC;AAE7B,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,GAAG,CAAC;AAElC,MAAM,MAAM,aAAa,GAAG,WAAW,GACrC,IAAI,CACF,cAAc,CAAC,uBAAuB,CAAC,EACrC,UAAU,GACV,SAAS,GACT,OAAO,GACP,eAAe,GACf,mBAAmB,GACnB,yBAAyB,GACzB,UAAU,GACV,OAAO,CACV,GACD,IAAI,CAAC,wBAAwB,EAAE,oBAAoB,CAAC,GAAG;IACrD,iDAAiD;IACjD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,wCAAwC;IACxC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,uCAAuC;IACvC,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAC1C;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB
|
|
1
|
+
{"version":3,"file":"ChipProps.d.ts","sourceRoot":"","sources":["../../src/chips/ChipProps.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AACjE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,qDAAqD,CAAC;AACpG,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAE1E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,KAAK,EACV,kBAAkB,EAClB,uBAAuB,EACvB,cAAc,EACf,MAAM,qBAAqB,CAAC;AAE7B,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,GAAG,CAAC;AAElC,MAAM,MAAM,aAAa,GAAG,WAAW,GACrC,IAAI,CACF,cAAc,CAAC,uBAAuB,CAAC,EACrC,UAAU,GACV,SAAS,GACT,OAAO,GACP,eAAe,GACf,mBAAmB,GACnB,yBAAyB,GACzB,UAAU,GACV,OAAO,CACV,GACD,IAAI,CAAC,wBAAwB,EAAE,oBAAoB,CAAC,GAAG;IACrD,iDAAiD;IACjD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,wCAAwC;IACxC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,uCAAuC;IACvC,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC,UAAU,CAAC,CAAC;IAC1C;;;;;;;;;;OAUG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;;;;OAOG;IACH,gBAAgB,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IACnC;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC,OAAO,CAAC,CAAC;IAClC;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;OAMG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;OAIG;IACH,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IACnC,kEAAkE;IAClE,MAAM,CAAC,EAAE;QACP,mBAAmB;QACnB,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAC3B,sBAAsB;QACtB,OAAO,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;KAC/B,CAAC;IACF,uEAAuE;IACvE,UAAU,CAAC,EAAE;QACX,mBAAmB;QACnB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,sBAAsB;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;CACH,CAAC;AAEJ,MAAM,MAAM,SAAS,GAAG,aAAa,CAAC;AAEtC,MAAM,MAAM,kBAAkB,GAAG,aAAa,CAAC;AAE/C,MAAM,MAAM,cAAc,GAAG,kBAAkB,GAC7C,SAAS,GAAG;IACV;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputChip.d.ts","sourceRoot":"","sources":["../../src/chips/InputChip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAKhD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAGlD,eAAO,MAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"InputChip.d.ts","sourceRoot":"","sources":["../../src/chips/InputChip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAKhD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAGlD,eAAO,MAAM,SAAS,kGA8CrB,CAAC"}
|
|
@@ -34,7 +34,10 @@ export type CollapsibleBaseProps = SharedProps &
|
|
|
34
34
|
*/
|
|
35
35
|
maxWidth?: BoxProps<BoxDefaultElement>['maxWidth'];
|
|
36
36
|
};
|
|
37
|
-
export type CollapsibleProps = CollapsibleBaseProps
|
|
37
|
+
export type CollapsibleProps = CollapsibleBaseProps & {
|
|
38
|
+
className?: string;
|
|
39
|
+
style?: React.CSSProperties;
|
|
40
|
+
};
|
|
38
41
|
export declare const Collapsible: React.NamedExoticComponent<
|
|
39
42
|
SharedProps &
|
|
40
43
|
PaddingProps &
|
|
@@ -66,6 +69,9 @@ export declare const Collapsible: React.NamedExoticComponent<
|
|
|
66
69
|
* Max width of the content. Overflow content will be scrollable.
|
|
67
70
|
*/
|
|
68
71
|
maxWidth?: BoxProps<BoxDefaultElement>['maxWidth'];
|
|
72
|
+
} & {
|
|
73
|
+
className?: string;
|
|
74
|
+
style?: React.CSSProperties;
|
|
69
75
|
} & React.RefAttributes<HTMLDivElement>
|
|
70
76
|
>;
|
|
71
77
|
//# sourceMappingURL=Collapsible.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Collapsible.d.ts","sourceRoot":"","sources":["../../src/collapsible/Collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,iDAAiD,CAAC;AAC5F,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;
|
|
1
|
+
{"version":3,"file":"Collapsible.d.ts","sourceRoot":"","sources":["../../src/collapsible/Collapsible.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAChF,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,iDAAiD,CAAC;AAC5F,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yCAAyC,CAAC;AAK5E,OAAO,EAAO,KAAK,iBAAiB,EAAE,KAAK,QAAQ,EAAE,MAAM,eAAe,CAAC;AAM3E,MAAM,MAAM,oBAAoB,GAAG,WAAW,GAC5C,YAAY,GACZ,IAAI,CAAC,QAAQ,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,yBAAyB,CAAC,GAAG;IAC7E;;;OAGG;IACH,SAAS,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,oBAAoB,CAAC;IACjC;;;OAGG;IACH,gCAAgC,CAAC,EAAE,OAAO,CAAC;IAC3C;;OAEG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAC,WAAW,CAAC,CAAC;IACrD;;OAEG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAC,UAAU,CAAC,CAAC;CACpD,CAAC;AAEJ,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,GAAG;IACpD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;CAC7B,CAAC;AAEF,eAAO,MAAM,WAAW;IAlCpB;;;OAGG;eACQ,OAAO;IAClB;;OAEG;cACO,KAAK,CAAC,SAAS;IACzB;;;OAGG;gBACS,oBAAoB;IAChC;;;OAGG;uCACgC,OAAO;IAC1C;;OAEG;gBACS,QAAQ,CAAC,iBAAiB,CAAC,CAAC,WAAW,CAAC;IACpD;;OAEG;eACQ,QAAQ,CAAC,iBAAiB,CAAC,CAAC,UAAU,CAAC;;gBAIxC,MAAM;YACV,KAAK,CAAC,aAAa;wCA+F5B,CAAC"}
|
package/dts/controls/Switch.d.ts
CHANGED
|
@@ -16,11 +16,19 @@ export declare const switchClassNames: {
|
|
|
16
16
|
/** Thumb wrapper element. */
|
|
17
17
|
readonly thumb: 'cds-Switch-thumb';
|
|
18
18
|
};
|
|
19
|
+
/** Semantic color variants for Switch, matching the semantics used by other control components. */
|
|
20
|
+
export type SwitchVariant = 'primary' | 'positive' | 'negative';
|
|
19
21
|
export type SwitchBaseProps = ControlBaseProps<string> & {
|
|
20
22
|
/** Sets the checked/active color of the control.
|
|
21
23
|
* @default bgPrimary
|
|
22
24
|
*/
|
|
23
25
|
controlColor?: ThemeVars.Color;
|
|
26
|
+
/**
|
|
27
|
+
* Semantic color variant applied to the track when checked. The `background` prop always
|
|
28
|
+
* takes priority over the background set by the variant, as does any custom `style`/`styles.track`.
|
|
29
|
+
* @default primary
|
|
30
|
+
*/
|
|
31
|
+
variant?: SwitchVariant;
|
|
24
32
|
};
|
|
25
33
|
export type SwitchProps = SwitchBaseProps &
|
|
26
34
|
StylesAndClassNames<typeof switchClassNames> & {
|
|
@@ -67,6 +75,12 @@ export declare const Switch: React.NamedExoticComponent<
|
|
|
67
75
|
* @default bgPrimary
|
|
68
76
|
*/
|
|
69
77
|
controlColor?: ThemeVars.Color;
|
|
78
|
+
/**
|
|
79
|
+
* Semantic color variant applied to the track when checked. The `background` prop always
|
|
80
|
+
* takes priority over the background set by the variant, as does any custom `style`/`styles.track`.
|
|
81
|
+
* @default primary
|
|
82
|
+
*/
|
|
83
|
+
variant?: SwitchVariant;
|
|
70
84
|
} & StylesAndClassNames<{
|
|
71
85
|
/** Persistent outer wrapper across all variants. */
|
|
72
86
|
readonly root: 'cds-Switch';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/controls/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAUjE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAEpD,OAAO,EAAW,KAAK,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAE3D;;;GAGG;AACH,eAAO,MAAM,gBAAgB;IAC3B,oDAAoD;;IAEpD,4CAA4C;;IAE5C,6BAA6B;;IAE7B,6BAA6B;;CAErB,CAAC;AA6BX,MAAM,MAAM,eAAe,GAAG,gBAAgB,CAAC,MAAM,CAAC,GAAG;IACvD;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/controls/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAChD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAUjE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAEpD,OAAO,EAAW,KAAK,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAE3D;;;GAGG;AACH,eAAO,MAAM,gBAAgB;IAC3B,oDAAoD;;IAEpD,4CAA4C;;IAE5C,6BAA6B;;IAE7B,6BAA6B;;CAErB,CAAC;AA6BX,mGAAmG;AACnG,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;AAShE,MAAM,MAAM,eAAe,GAAG,gBAAgB,CAAC,MAAM,CAAC,GAAG;IACvD;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC;IAC/B;;;;OAIG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB,CAAC;AAEF,MAAM,MAAM,WAAW,GAAG,eAAe,GACvC,mBAAmB,CAAC,OAAO,gBAAgB,CAAC,GAAG;IAC7C;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAkGJ,eAAO,MAAM,MAAM;;;;;;;;;;;IAzHjB;;OAEG;mBACY,SAAS,CAAC,KAAK;IAC9B;;;;OAIG;cACO,aAAa;;IAzDvB,oDAAoD;;IAEpD,4CAA4C;;IAE5C,6BAA6B;;IAE7B,6BAA6B;;;IAwD3B;;;;;;;OAOG;eACQ,KAAK,CAAC,SAAS;0CAmGW,CAAC"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { AccordionBaseProps } from '../accordion/Accordion';
|
|
2
|
+
import type { AccordionItemBaseProps } from '../accordion/AccordionItem';
|
|
2
3
|
import type { ComboboxBaseProps } from '../alpha/combobox/Combobox';
|
|
3
4
|
import type { SelectBaseProps } from '../alpha/select/types';
|
|
4
5
|
import type { SelectChipBaseProps } from '../alpha/select-chip/SelectChip';
|
|
@@ -101,6 +102,7 @@ export type ConfigResolver<P> = Partial<P> | ((props: P) => Partial<P>);
|
|
|
101
102
|
*/
|
|
102
103
|
export type ComponentConfig = {
|
|
103
104
|
Accordion?: ConfigResolver<AccordionBaseProps>;
|
|
105
|
+
AccordionItem?: ConfigResolver<AccordionItemBaseProps>;
|
|
104
106
|
Alert?: ConfigResolver<AlertBaseProps>;
|
|
105
107
|
TabbedChips?: ConfigResolver<TabbedChipsBaseProps>;
|
|
106
108
|
Avatar?: ConfigResolver<AvatarBaseProps>;
|