@primer/react 38.24.0-rc.ff9ea71b3 → 38.25.0-rc.3cd58f825
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 +28 -0
- package/dist/ActionBar/ActionBar-e63def3c.css +2 -0
- package/dist/ActionBar/ActionBar-e63def3c.css.map +1 -0
- package/dist/ActionBar/ActionBar.d.ts +1 -1
- package/dist/ActionBar/ActionBar.d.ts.map +1 -1
- package/dist/ActionBar/ActionBar.js +298 -384
- package/dist/ActionBar/ActionBar.module.css.js +2 -2
- package/dist/ActionBar/index.d.ts +1 -1
- package/dist/ActionList/Heading.js +17 -16
- package/dist/Autocomplete/AutocompleteInput.js +3 -3
- package/dist/Autocomplete/AutocompleteOverlay.js +3 -3
- package/dist/Blankslate/Blankslate.d.ts.map +1 -1
- package/dist/Blankslate/Blankslate.js +6 -0
- package/dist/BranchName/BranchName.js +1 -0
- package/dist/Breadcrumbs/Breadcrumbs.d.ts.map +1 -1
- package/dist/Breadcrumbs/Breadcrumbs.js +3 -0
- package/dist/Button/ButtonBase.js +3 -3
- package/dist/ButtonGroup/ButtonGroup.d.ts.map +1 -1
- package/dist/ButtonGroup/ButtonGroup.js +1 -0
- package/dist/Card/{Card-cec366f8.css → Card-d8a02dd9.css} +2 -2
- package/dist/Card/{Card-cec366f8.css.map → Card-d8a02dd9.css.map} +1 -1
- package/dist/Card/Card.d.ts +75 -39
- package/dist/Card/Card.d.ts.map +1 -1
- package/dist/Card/Card.js +260 -160
- package/dist/Card/Card.module.css.js +2 -2
- package/dist/Card/index.d.ts +16 -16
- package/dist/Card/index.d.ts.map +1 -1
- package/dist/Card/index.js +2 -2
- package/dist/Checkbox/Checkbox.d.ts +1 -0
- package/dist/Checkbox/Checkbox.d.ts.map +1 -1
- package/dist/Checkbox/Checkbox.js +10 -5
- package/dist/CheckboxGroup/CheckboxGroup.js +1 -0
- package/dist/CircleBadge/CircleBadge.d.ts.map +1 -1
- package/dist/CircleBadge/CircleBadge.js +44 -28
- package/dist/ConfirmationDialog/ConfirmationDialog.d.ts.map +1 -1
- package/dist/ConfirmationDialog/ConfirmationDialog.js +1 -0
- package/dist/CounterLabel/CounterLabel.d.ts +2 -0
- package/dist/CounterLabel/CounterLabel.d.ts.map +1 -1
- package/dist/CounterLabel/CounterLabel.js +25 -90
- package/dist/DataTable/useTable.d.ts.map +1 -1
- package/dist/DataTable/useTable.js +8 -3
- package/dist/Details/Details.d.ts +6 -2
- package/dist/Details/Details.d.ts.map +1 -1
- package/dist/Details/Details.js +31 -22
- package/dist/Dialog/Dialog-b7da369a.css +2 -0
- package/dist/Dialog/Dialog-b7da369a.css.map +1 -0
- package/dist/Dialog/Dialog.d.ts +5 -2
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +34 -11
- package/dist/Dialog/Dialog.module.css.js +1 -1
- package/dist/Flash/Flash.d.ts.map +1 -1
- package/dist/Flash/Flash.js +2 -1
- package/dist/FormControl/FormControl.d.ts.map +1 -1
- package/dist/FormControl/FormControl.js +2 -0
- package/dist/FormControl/FormControlCaption.d.ts.map +1 -1
- package/dist/FormControl/FormControlCaption.js +1 -0
- package/dist/FormControl/FormControlLabel.d.ts.map +1 -1
- package/dist/FormControl/FormControlLabel.js +1 -0
- package/dist/FormControl/FormControlLeadingVisual.d.ts.map +1 -1
- package/dist/FormControl/FormControlLeadingVisual.js +1 -0
- package/dist/FormControl/_FormControlValidation.d.ts.map +1 -1
- package/dist/FormControl/_FormControlValidation.js +1 -0
- package/dist/Header/Header.d.ts.map +1 -1
- package/dist/Header/Header.js +3 -0
- package/dist/Heading/Heading.d.ts.map +1 -1
- package/dist/Heading/Heading.js +4 -3
- package/dist/Hidden/Hidden.d.ts.map +1 -1
- package/dist/Hidden/Hidden.js +1 -0
- package/dist/InlineMessage/InlineMessage.d.ts.map +1 -1
- package/dist/InlineMessage/InlineMessage.js +1 -0
- package/dist/KeybindingHint/KeybindingHint.d.ts.map +1 -1
- package/dist/KeybindingHint/KeybindingHint.js +1 -0
- package/dist/Label/Label.d.ts.map +1 -1
- package/dist/Label/Label.js +2 -1
- package/dist/LabelGroup/LabelGroup.d.ts.map +1 -1
- package/dist/LabelGroup/LabelGroup.js +4 -1
- package/dist/Link/Link.js +3 -3
- package/dist/Overlay/Overlay.d.ts.map +1 -1
- package/dist/Overlay/Overlay.js +20 -19
- package/dist/PageLayout/PageLayout.js +5 -5
- package/dist/PageLayout/usePaneWidth.d.ts.map +1 -1
- package/dist/PageLayout/usePaneWidth.js +12 -6
- package/dist/TextInputWithTokens/TextInputWithTokens.js +91 -90
- package/dist/Timeline/{Timeline-ad31a7fb.css → Timeline-05decc91.css} +2 -2
- package/dist/Timeline/Timeline-05decc91.css.map +1 -0
- package/dist/Timeline/Timeline.module.css.js +1 -1
- package/dist/deprecated/DialogV1/Dialog.js +10 -9
- package/dist/experimental/index.d.ts +1 -1
- package/dist/experimental/index.d.ts.map +1 -1
- package/dist/hooks/useMergedRefs.d.ts +1 -1
- package/dist/hooks/useMergedRefs.d.ts.map +1 -1
- package/dist/hooks/useMergedRefs.js +13 -0
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.d.ts +1 -0
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.js +5 -2
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.js +3 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.d.ts +1 -0
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.js +3 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.js +3 -1
- package/dist/internal/components/InputValidation.d.ts +2 -1
- package/dist/internal/components/InputValidation.d.ts.map +1 -1
- package/dist/internal/components/InputValidation.js +64 -33
- package/dist/utils/environment.d.ts +4 -1
- package/dist/utils/environment.d.ts.map +1 -1
- package/dist/utils/environment.js +17 -2
- package/generated/components.json +59 -10
- package/package.json +1 -1
- package/dist/ActionBar/ActionBar-a41224b2.css +0 -2
- package/dist/ActionBar/ActionBar-a41224b2.css.map +0 -1
- package/dist/Dialog/Dialog-f9bb927a.css +0 -2
- package/dist/Dialog/Dialog-f9bb927a.css.map +0 -1
- package/dist/Timeline/Timeline-ad31a7fb.css.map +0 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import './ActionBar-
|
|
1
|
+
import './ActionBar-e63def3c.css';
|
|
2
2
|
|
|
3
|
-
var styles = {"List":"prc-ActionBar-List-9uz46","Divider":"prc-ActionBar-Divider-6V8yH","Nav":"prc-ActionBar-Nav-9spON","Group":"prc-ActionBar-Group-peNCk"};
|
|
3
|
+
var styles = {"List":"prc-ActionBar-List-9uz46","detect-overflow":"prc-ActionBar-detect-overflow-mAuJu","Divider":"prc-ActionBar-Divider-6V8yH","Nav":"prc-ActionBar-Nav-9spON","Group":"prc-ActionBar-Group-peNCk","OverflowContainer":"prc-ActionBar-OverflowContainer-AkYZs","OverflowSpacer":"prc-ActionBar-OverflowSpacer-tbHkV","MoreButton":"prc-ActionBar-MoreButton-RHqpx"};
|
|
4
4
|
|
|
5
5
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export type { ActionBarProps, ActionBarMenuProps, ActionBarMenuItemProps } from './ActionBar';
|
|
2
2
|
declare const ActionBar: import("react").FC<import("react").PropsWithChildren<import("./ActionBar").ActionBarProps>> & {
|
|
3
3
|
IconButton: import("react").ForwardRefExoticComponent<import("./ActionBar").ActionBarIconButtonProps & import("react").RefAttributes<unknown>>;
|
|
4
|
-
Divider: () => import("react").JSX.Element
|
|
4
|
+
Divider: () => import("react").JSX.Element;
|
|
5
5
|
Group: import("react").ForwardRefExoticComponent<{
|
|
6
6
|
children?: import("react").ReactNode | undefined;
|
|
7
7
|
} & import("react").RefAttributes<unknown>>;
|
|
@@ -7,12 +7,12 @@ import { invariant } from '../utils/invariant.js';
|
|
|
7
7
|
import { clsx } from 'clsx';
|
|
8
8
|
import classes from './Heading.module.css.js';
|
|
9
9
|
import { jsx } from 'react/jsx-runtime';
|
|
10
|
-
import {
|
|
10
|
+
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
11
11
|
import Heading$1 from '../Heading/Heading.js';
|
|
12
12
|
|
|
13
13
|
const Heading = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
|
|
14
14
|
var _props$id;
|
|
15
|
-
const $ = c(
|
|
15
|
+
const $ = c(21);
|
|
16
16
|
let as;
|
|
17
17
|
let children;
|
|
18
18
|
let className;
|
|
@@ -45,7 +45,7 @@ const Heading = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
|
|
|
45
45
|
}
|
|
46
46
|
const visuallyHidden = t1 === undefined ? false : t1;
|
|
47
47
|
const innerRef = React.useRef(null);
|
|
48
|
-
|
|
48
|
+
const mergedRef = useMergedRefs(forwardedRef, innerRef);
|
|
49
49
|
const {
|
|
50
50
|
headingId,
|
|
51
51
|
variant: listVariant
|
|
@@ -65,11 +65,11 @@ const Heading = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
|
|
|
65
65
|
t4 = $[8];
|
|
66
66
|
}
|
|
67
67
|
let t5;
|
|
68
|
-
if ($[9] !== as || $[10] !== children || $[11] !== listVariant || $[12] !==
|
|
68
|
+
if ($[9] !== as || $[10] !== children || $[11] !== listVariant || $[12] !== mergedRef || $[13] !== props || $[14] !== size || $[15] !== t3 || $[16] !== t4) {
|
|
69
69
|
t5 = /*#__PURE__*/jsx(Heading$1, {
|
|
70
70
|
as: as,
|
|
71
71
|
variant: size,
|
|
72
|
-
ref:
|
|
72
|
+
ref: mergedRef,
|
|
73
73
|
id: t3,
|
|
74
74
|
className: t4,
|
|
75
75
|
"data-component": "ActionList.Heading",
|
|
@@ -80,25 +80,26 @@ const Heading = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
|
|
|
80
80
|
$[9] = as;
|
|
81
81
|
$[10] = children;
|
|
82
82
|
$[11] = listVariant;
|
|
83
|
-
$[12] =
|
|
84
|
-
$[13] =
|
|
85
|
-
$[14] =
|
|
86
|
-
$[15] =
|
|
87
|
-
$[16] =
|
|
83
|
+
$[12] = mergedRef;
|
|
84
|
+
$[13] = props;
|
|
85
|
+
$[14] = size;
|
|
86
|
+
$[15] = t3;
|
|
87
|
+
$[16] = t4;
|
|
88
|
+
$[17] = t5;
|
|
88
89
|
} else {
|
|
89
|
-
t5 = $[
|
|
90
|
+
t5 = $[17];
|
|
90
91
|
}
|
|
91
92
|
let t6;
|
|
92
|
-
if ($[
|
|
93
|
+
if ($[18] !== t2 || $[19] !== t5) {
|
|
93
94
|
t6 = /*#__PURE__*/jsx(VisuallyHidden, {
|
|
94
95
|
isVisible: t2,
|
|
95
96
|
children: t5
|
|
96
97
|
});
|
|
97
|
-
$[
|
|
98
|
-
$[
|
|
99
|
-
$[
|
|
98
|
+
$[18] = t2;
|
|
99
|
+
$[19] = t5;
|
|
100
|
+
$[20] = t6;
|
|
100
101
|
} else {
|
|
101
|
-
t6 = $[
|
|
102
|
+
t6 = $[20];
|
|
102
103
|
}
|
|
103
104
|
return t6;
|
|
104
105
|
});
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { useContext, useState, useCallback, useEffect } from 'react';
|
|
2
2
|
import { AutocompleteContext, AutocompleteInputContext } from './AutocompleteContext.js';
|
|
3
|
-
import {
|
|
3
|
+
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
4
4
|
import useSafeTimeout from '../hooks/useSafeTimeout.js';
|
|
5
5
|
import { jsx } from 'react/jsx-runtime';
|
|
6
6
|
import TextInput from '../TextInput/TextInput.js';
|
|
@@ -36,7 +36,7 @@ const AutocompleteInput = /*#__PURE__*/React.forwardRef(({
|
|
|
36
36
|
inputValue = '',
|
|
37
37
|
isMenuDirectlyActivated
|
|
38
38
|
} = inputContext;
|
|
39
|
-
|
|
39
|
+
const mergedRef = useMergedRefs(forwardedRef, inputRef);
|
|
40
40
|
const [highlightRemainingText, setHighlightRemainingText] = useState(true);
|
|
41
41
|
const {
|
|
42
42
|
safeSetTimeout
|
|
@@ -130,7 +130,7 @@ const AutocompleteInput = /*#__PURE__*/React.forwardRef(({
|
|
|
130
130
|
onKeyDown: handleInputKeyDown,
|
|
131
131
|
onKeyPress: onInputKeyPress,
|
|
132
132
|
onKeyUp: handleInputKeyUp,
|
|
133
|
-
ref:
|
|
133
|
+
ref: mergedRef,
|
|
134
134
|
"aria-controls": `${id}-listbox`,
|
|
135
135
|
"aria-autocomplete": "both",
|
|
136
136
|
role: "combobox",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { useContext, useRef, useEffect, useCallback } from 'react';
|
|
2
2
|
import { AutocompleteContext } from './AutocompleteContext.js';
|
|
3
|
-
import {
|
|
3
|
+
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
4
4
|
import VisuallyHidden from '../_VisuallyHidden.js';
|
|
5
5
|
import classes from './AutocompleteOverlay.module.css.js';
|
|
6
6
|
import { clsx } from 'clsx';
|
|
@@ -48,7 +48,7 @@ function AutocompleteOverlay({
|
|
|
48
48
|
align: 'start',
|
|
49
49
|
anchorElementRef: computedAnchorRef
|
|
50
50
|
}, [showMenu, selectedItemLength]);
|
|
51
|
-
|
|
51
|
+
const mergedScrollContainerRef = useMergedRefs(scrollContainerRef, floatingElementRef);
|
|
52
52
|
const closeOptionList = useCallback(() => {
|
|
53
53
|
setShowMenu(false);
|
|
54
54
|
}, [setShowMenu]);
|
|
@@ -60,7 +60,7 @@ function AutocompleteOverlay({
|
|
|
60
60
|
preventFocusOnOpen: true,
|
|
61
61
|
onClickOutside: closeOptionList,
|
|
62
62
|
onEscape: closeOptionList,
|
|
63
|
-
ref:
|
|
63
|
+
ref: mergedScrollContainerRef,
|
|
64
64
|
top: position === null || position === void 0 ? void 0 : position.top,
|
|
65
65
|
left: position === null || position === void 0 ? void 0 : position.left,
|
|
66
66
|
className: clsx(classes.Overlay, className),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Blankslate.d.ts","sourceRoot":"","sources":["../../src/Blankslate/Blankslate.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,KAAK,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG;IACzD;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;CACpC,CAAA;AAED,iBAAS,UAAU,CAAC,EAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAe,EAAE,GAAG,IAAI,EAAC,EAAE,eAAe,
|
|
1
|
+
{"version":3,"file":"Blankslate.d.ts","sourceRoot":"","sources":["../../src/Blankslate/Blankslate.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,KAAK,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG;IACzD;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;CACpC,CAAA;AAED,iBAAS,UAAU,CAAC,EAAC,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAe,EAAE,GAAG,IAAI,EAAC,EAAE,eAAe,qBAuB7G;AAED,KAAK,qBAAqB,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;AAE9D,iBAAS,MAAM,CAAC,EAAC,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAC,EAAE,qBAAqB,qBAMpE;AAED,KAAK,sBAAsB,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,GAAG;IAChE,EAAE,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;CAC7C,CAAA;AAED,iBAAS,OAAO,CAAC,EAAC,EAAE,EAAE,SAAgB,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAC,EAAE,sBAAsB,qBAU5F;AAED,KAAK,0BAA0B,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;AAEnE,iBAAS,WAAW,CAAC,EAAC,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAC,EAAE,0BAA0B,qBAU9E;AAED,KAAK,4BAA4B,GAC7B,CAAC,KAAK,CAAC,iBAAiB,CAAC;IACvB,IAAI,CAAC,EAAE,KAAK,CAAA;CACb,CAAC,GACA,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,CAAC,GAC3C,KAAK,CAAC,iBAAiB,CAAC;IACtB,IAAI,EAAE,MAAM,CAAA;CACb,CAAC,CAAA;AAEN,iBAAS,aAAa,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAE,GAAG,KAAK,EAAC,EAAE,4BAA4B,qBAe9E;AAED,KAAK,8BAA8B,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAC5D,IAAI,EAAE,MAAM,CAAA;CACb,CAAC,CAAA;AAEF,iBAAS,eAAe,CAAC,EAAC,QAAQ,EAAE,IAAI,EAAC,EAAE,8BAA8B,qBAMxE;AAED,OAAO,EAAC,UAAU,EAAE,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,eAAe,EAAC,CAAA;AACjF,YAAY,EACV,eAAe,EACf,qBAAqB,EACrB,sBAAsB,EACtB,0BAA0B,EAC1B,4BAA4B,EAC5B,8BAA8B,GAC/B,CAAA"}
|
|
@@ -70,6 +70,7 @@ function Blankslate(t0) {
|
|
|
70
70
|
if ($[12] !== children || $[13] !== size || $[14] !== t3 || $[15] !== t4 || $[16] !== t5 || $[17] !== t6) {
|
|
71
71
|
t7 = /*#__PURE__*/jsx("div", {
|
|
72
72
|
className: t3,
|
|
73
|
+
"data-component": "Blankslate",
|
|
73
74
|
"data-border": t4,
|
|
74
75
|
"data-narrow": t5,
|
|
75
76
|
"data-spacious": t6,
|
|
@@ -146,6 +147,7 @@ function Visual(t0) {
|
|
|
146
147
|
t2 = /*#__PURE__*/jsx("span", {
|
|
147
148
|
...rest,
|
|
148
149
|
className: t1,
|
|
150
|
+
"data-component": "Blankslate.Visual",
|
|
149
151
|
children: children
|
|
150
152
|
});
|
|
151
153
|
$[6] = children;
|
|
@@ -195,6 +197,7 @@ function Heading(t0) {
|
|
|
195
197
|
t3 = /*#__PURE__*/jsx(Component, {
|
|
196
198
|
...rest,
|
|
197
199
|
className: t2,
|
|
200
|
+
"data-component": "Blankslate.Heading",
|
|
198
201
|
children: children
|
|
199
202
|
});
|
|
200
203
|
$[7] = Component;
|
|
@@ -240,6 +243,7 @@ function Description(t0) {
|
|
|
240
243
|
t2 = /*#__PURE__*/jsx("p", {
|
|
241
244
|
...rest,
|
|
242
245
|
className: t1,
|
|
246
|
+
"data-component": "Blankslate.Description",
|
|
243
247
|
children: children
|
|
244
248
|
});
|
|
245
249
|
$[6] = children;
|
|
@@ -287,6 +291,7 @@ function PrimaryAction(t0) {
|
|
|
287
291
|
if ($[5] !== children || $[6] !== href || $[7] !== props || $[8] !== t2 || $[9] !== t3) {
|
|
288
292
|
t4 = /*#__PURE__*/jsx("div", {
|
|
289
293
|
className: t1,
|
|
294
|
+
"data-component": "Blankslate.PrimaryAction",
|
|
290
295
|
children: /*#__PURE__*/jsx(ButtonComponent, {
|
|
291
296
|
...props,
|
|
292
297
|
as: t2,
|
|
@@ -324,6 +329,7 @@ function SecondaryAction(t0) {
|
|
|
324
329
|
if ($[1] !== children || $[2] !== href) {
|
|
325
330
|
t2 = /*#__PURE__*/jsx("div", {
|
|
326
331
|
className: t1,
|
|
332
|
+
"data-component": "Blankslate.SecondaryAction",
|
|
327
333
|
children: /*#__PURE__*/jsx(Link, {
|
|
328
334
|
href: href,
|
|
329
335
|
children: children
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../../src/Breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,EAAE,EAAC,MAAM,SAAS,CAAA;AAC/B,OAAO,KAA6E,MAAM,OAAO,CAAA;AAUjG,OAAO,EAAC,KAAK,gBAAgB,EAAkB,MAAM,6BAA6B,CAAA;AAElF,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACrD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,gBAAgB,CAAA;IAC7C;;;;OAIG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAA;IAC/B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAC,CAAA;AA8GF,iBAAS,WAAW,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAiB,EAAE,OAAkB,EAAC,EAAE,gBAAgB,
|
|
1
|
+
{"version":3,"file":"Breadcrumbs.d.ts","sourceRoot":"","sources":["../../src/Breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,EAAE,EAAC,MAAM,SAAS,CAAA;AAC/B,OAAO,KAA6E,MAAM,OAAO,CAAA;AAUjG,OAAO,EAAC,KAAK,gBAAgB,EAAkB,MAAM,6BAA6B,CAAA;AAElF,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACrD;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,gBAAgB,CAAA;IAC7C;;;;OAIG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAA;IAC/B;;OAEG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAC,CAAA;AA8GF,iBAAS,WAAW,CAAC,EAAC,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAiB,EAAE,OAAkB,EAAC,EAAE,gBAAgB,qBAoMzG;kBApMQ,WAAW;;;AAgNpB,KAAK,0BAA0B,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,GAAG,GAAG,IAAI,gBAAgB,CACpF,EAAE,EACF,GAAG,EACH;IACE,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CACF,CAAA;AAuBD,MAAM,MAAM,oBAAoB,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,GAAG,GAAG,IAAI,0BAA0B,CAAC,EAAE,CAAC,CAAA;;YApBlG,EAAE,SAAS,KAAK,CAAC,WAAW;aANtB,EAAE;mBACI,OAAO;;aADb,EAAE;mBACI,OAAO;;;;;;;AA4BtB,wBAAiF;AAEjF;;GAEG;AACH,eAAO,MAAM,UAAU;WA5BpB,EAAE,SAAS,KAAK,CAAC,WAAW;aANtB,EAAE;mBACI,OAAO;;aADb,EAAE;mBACI,OAAO;;;;CAiCuD,CAAA;AAE7E;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,gBAAgB,CAAA;AAE9C;;GAEG;AACH,MAAM,MAAM,mBAAmB,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,GAAG,GAAG,IAAI,oBAAoB,CAAC,EAAE,CAAC,CAAA"}
|
|
@@ -189,6 +189,7 @@ const BreadcrumbsMenuItem = /*#__PURE__*/React.forwardRef((t0, menuRefCallback)
|
|
|
189
189
|
t13 = /*#__PURE__*/jsxs(Details, {
|
|
190
190
|
ref: detailsRefCallback,
|
|
191
191
|
className: classes.MenuDetails,
|
|
192
|
+
"data-component": "Breadcrumbs.MenuItem",
|
|
192
193
|
children: [t10, t12]
|
|
193
194
|
});
|
|
194
195
|
$[21] = detailsRefCallback;
|
|
@@ -362,6 +363,7 @@ function Breadcrumbs({
|
|
|
362
363
|
ref: containerRef,
|
|
363
364
|
"data-overflow": overflow,
|
|
364
365
|
"data-variant": variant,
|
|
366
|
+
"data-component": "Breadcrumbs",
|
|
365
367
|
children: /*#__PURE__*/jsx(BreadcrumbsList, {
|
|
366
368
|
children: finalChildren
|
|
367
369
|
})
|
|
@@ -403,6 +405,7 @@ const BreadcrumbsItem = fixedForwardRef((props, ref) => {
|
|
|
403
405
|
className: clsx(className, classes.Item, selected && 'selected'),
|
|
404
406
|
"aria-current": selected ? 'page' : undefined,
|
|
405
407
|
ref: ref,
|
|
408
|
+
"data-component": "Breadcrumbs.Item",
|
|
406
409
|
...rest
|
|
407
410
|
});
|
|
408
411
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { forwardRef } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { useMergedRefs } from '../hooks/useMergedRefs.js';
|
|
3
3
|
import { ConditionalWrapper } from '../internal/components/ConditionalWrapper.js';
|
|
4
4
|
import { clsx } from 'clsx';
|
|
5
5
|
import classes from './ButtonBase.module.css.js';
|
|
@@ -46,7 +46,7 @@ const ButtonBase = /*#__PURE__*/forwardRef(({
|
|
|
46
46
|
...rest
|
|
47
47
|
} = props;
|
|
48
48
|
const innerRef = React.useRef(null);
|
|
49
|
-
|
|
49
|
+
const mergedRef = useMergedRefs(forwardedRef, innerRef);
|
|
50
50
|
const uuid = useId(id);
|
|
51
51
|
const loadingAnnouncementID = `${uuid}-loading-announcement`;
|
|
52
52
|
|
|
@@ -76,7 +76,7 @@ const ButtonBase = /*#__PURE__*/forwardRef(({
|
|
|
76
76
|
"data-component": "Button",
|
|
77
77
|
...rest,
|
|
78
78
|
// @ts-ignore temporary disable as we migrate to css modules, until we remove PolymorphicForwardRefComponent
|
|
79
|
-
ref:
|
|
79
|
+
ref: mergedRef,
|
|
80
80
|
className: clsx(classes.ButtonBase, className),
|
|
81
81
|
"data-block": block ? 'block' : null,
|
|
82
82
|
"data-inactive": inactive ? true : undefined,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonGroup.d.ts","sourceRoot":"","sources":["../../src/ButtonGroup/ButtonGroup.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAC,KAAK,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAKnD,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAE/F,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,CAAC;IAC/C,4BAA4B;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAC,CAAA;AAEF,QAAA,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"ButtonGroup.d.ts","sourceRoot":"","sources":["../../src/ButtonGroup/ButtonGroup.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAC,KAAK,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAKnD,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAE/F,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,CAAC;IAC/C,4BAA4B;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAC,CAAA;AAEF,QAAA,MAAM,WAAW,EA0BX,8BAA8B,CAAC,KAAK,EAAE,gBAAgB,CAAC,CAAA;AAI7D,eAAe,WAAW,CAAA"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.prc-Card-Card-pYjuL{background-color:var(--bgColor-default,#fff);border:var(--borderWidth-thin,.0625rem) solid var(--borderColor-default,#d1d9e0);box-shadow:var(--shadow-resting-small,0 1px 1px 0 #1f23280a,0 1px 2px 0 #1f232808);display:grid;gap:var(--stack-gap-normal,1rem);grid-auto-rows:max-content auto;overflow:hidden;position:relative}.prc-Card-Card-pYjuL[data-border-radius=large]{border-radius:var(--borderRadius-large,.75rem)}.prc-Card-Card-pYjuL[data-border-radius=medium]{border-radius:var(--borderRadius-medium,.375rem)}.prc-Card-Card-pYjuL[data-padding=normal]{padding:var(--stack-padding-spacious,1.5rem)}.prc-Card-Card-pYjuL[data-padding=condensed]{padding:var(--stack-padding-condensed,.5rem)}.prc-Card-Card-pYjuL[data-padding=none]{padding:0}.prc-Card-CardHeader-P5Qbb{display:block;height:auto;width:100%}.prc-Card-CardHeaderEdgeToEdge-3yCqT{margin-left:calc(var(--stack-padding-spacious,1.5rem)*-1);margin-right:calc(var(--stack-padding-spacious,1.5rem)*-1);margin-top:calc(var(--stack-padding-spacious,1.5rem)*-1);width:calc(100% + var(--stack-padding-spacious,1.5rem)*2)}.prc-Card-CardImage-2M8DM{display:block;height:auto;width:100%}.prc-Card-CardIcon-mIMfj{align-items:center;background-color:var(--bgColor-muted,#f6f8fa);border-radius:var(--borderRadius-medium,.375rem);color:var(--fgColor-muted,#59636e);display:flex;height:var(--base-size-32,2rem);justify-content:center;width:var(--base-size-32,2rem)}.prc-Card-CardBody-W1o-l{display:grid;gap:var(--stack-gap-normal,1rem)}.prc-Card-CardContent-omZDS{display:grid;gap:var(--stack-gap-condensed,.5rem)}.prc-Card-CardHeading-3HXyS{color:var(--fgColor-default,#1f2328);font:var(--text-title-shorthand-small,600 1rem/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji");margin:0}.prc-Card-CardDescription-MnJ3F{margin:0}.prc-Card-CardDescription-MnJ3F,.prc-Card-CardMetadataContainer-K-UlH{color:var(--fgColor-muted,#59636e);font:var(--text-body-shorthand-medium,400 .875rem/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji")}.prc-Card-CardMetadataContainer-K-UlH{align-items:center;display:flex;gap:var(--stack-gap-normal,1rem)}.prc-Card-CardMetadataItem-ellY9{align-items:center;display:flex;font:var(--text-body-shorthand-small,400 .75rem/1.625 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji");gap:var(--stack-gap-condensed,.5rem)}.prc-Card-
|
|
2
|
-
/*# sourceMappingURL=Card-
|
|
1
|
+
.prc-Card-Card-pYjuL{background-color:var(--bgColor-default,#fff);border:var(--borderWidth-thin,.0625rem) solid var(--borderColor-default,#d1d9e0);box-shadow:var(--shadow-resting-small,0 1px 1px 0 #1f23280a,0 1px 2px 0 #1f232808);display:grid;gap:var(--stack-gap-normal,1rem);grid-auto-rows:max-content auto;overflow:hidden;position:relative}.prc-Card-Card-pYjuL[data-border-radius=large]{border-radius:var(--borderRadius-large,.75rem)}.prc-Card-Card-pYjuL[data-border-radius=medium]{border-radius:var(--borderRadius-medium,.375rem)}.prc-Card-Card-pYjuL[data-padding=normal]{padding:var(--stack-padding-spacious,1.5rem)}.prc-Card-Card-pYjuL[data-padding=condensed]{padding:var(--stack-padding-condensed,.5rem)}.prc-Card-Card-pYjuL[data-padding=none]{padding:0}.prc-Card-CardHeader-P5Qbb{display:block;height:auto;width:100%}.prc-Card-CardHeaderEdgeToEdge-3yCqT{margin-left:calc(var(--stack-padding-spacious,1.5rem)*-1);margin-right:calc(var(--stack-padding-spacious,1.5rem)*-1);margin-top:calc(var(--stack-padding-spacious,1.5rem)*-1);width:calc(100% + var(--stack-padding-spacious,1.5rem)*2)}.prc-Card-CardImage-2M8DM{display:block;height:auto;width:100%}.prc-Card-CardIcon-mIMfj{align-items:center;background-color:var(--bgColor-muted,#f6f8fa);border-radius:var(--borderRadius-medium,.375rem);color:var(--fgColor-muted,#59636e);display:flex;height:var(--base-size-32,2rem);justify-content:center;width:var(--base-size-32,2rem)}.prc-Card-CardBody-W1o-l{display:grid;gap:var(--stack-gap-normal,1rem)}.prc-Card-CardContent-omZDS{display:grid;gap:var(--stack-gap-condensed,.5rem)}.prc-Card-CardHeading-3HXyS{color:var(--fgColor-default,#1f2328);font:var(--text-title-shorthand-small,600 1rem/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji");margin:0}.prc-Card-CardDescription-MnJ3F{margin:0}.prc-Card-CardDescription-MnJ3F,.prc-Card-CardMetadataContainer-K-UlH{color:var(--fgColor-muted,#59636e);font:var(--text-body-shorthand-medium,400 .875rem/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji")}.prc-Card-CardMetadataContainer-K-UlH{align-items:center;display:flex;gap:var(--stack-gap-normal,1rem)}.prc-Card-CardMetadataItem-ellY9{align-items:center;display:flex;font:var(--text-body-shorthand-small,400 .75rem/1.625 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji");gap:var(--stack-gap-condensed,.5rem)}.prc-Card-CardAction-VtI49{position:absolute;right:var(--base-size-16,1rem);top:var(--base-size-16,1rem);z-index:1}
|
|
2
|
+
/*# sourceMappingURL=Card-d8a02dd9.css.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Card/Card.module.css.js"],"names":[],"mappings":"AAAA,qBAOE,4CAAwC,CAFxC,gFAAgE,CAChE,kFAAuC,CALvC,YAAa,CAOb,gCAA4B,CAJ5B,+BAAgC,CADhC,eAAgB,CADhB,iBA6BF,CArBE,+CACE,8CACF,CAEA,gDACE,gDACF,CAEA,0CAEE,4CACF,CAEA,6CAEE,4CACF,CAEA,wCACE,SACF,CAGF,2BACE,aAAc,CAEd,WAAY,CADZ,UAEF,CAEA,qCAIE,yDAAqD,CADrD,0DAAsD,CADtD,wDAAoD,CAGpD,yDAEF,CAEA,0BACE,aAAc,CAEd,WAAY,CADZ,UAEF,CAEA,yBAEE,kBAAmB,CAKnB,6CAAsC,CADtC,gDAAyC,CAEzC,kCAA2B,CAP3B,YAAa,CAIb,+BAA2B,CAF3B,sBAAuB,CACvB,8BAKF,CAEA,yBACE,YAAa,CACb,gCACF,CAEA,4BACE,YAAa,CACb,oCACF,CAEA,4BAEE,oCAA6B,CAD7B,2KAAuC,CAEvC,QACF,CAEA,gCAGE,QACF,CAEA,sEAJE,kCAA2B,CAD3B,8KAWF,CANA,sCAEE,kBAAmB,CADnB,YAAa,CAEb,gCAGF,CAEA,iCAEE,kBAAmB,CADnB,YAAa,CAGb,8KAAsC,CADtC,oCAEF,CAEA,
|
|
1
|
+
{"version":3,"sources":["../src/Card/Card.module.css.js"],"names":[],"mappings":"AAAA,qBAOE,4CAAwC,CAFxC,gFAAgE,CAChE,kFAAuC,CALvC,YAAa,CAOb,gCAA4B,CAJ5B,+BAAgC,CADhC,eAAgB,CADhB,iBA6BF,CArBE,+CACE,8CACF,CAEA,gDACE,gDACF,CAEA,0CAEE,4CACF,CAEA,6CAEE,4CACF,CAEA,wCACE,SACF,CAGF,2BACE,aAAc,CAEd,WAAY,CADZ,UAEF,CAEA,qCAIE,yDAAqD,CADrD,0DAAsD,CADtD,wDAAoD,CAGpD,yDAEF,CAEA,0BACE,aAAc,CAEd,WAAY,CADZ,UAEF,CAEA,yBAEE,kBAAmB,CAKnB,6CAAsC,CADtC,gDAAyC,CAEzC,kCAA2B,CAP3B,YAAa,CAIb,+BAA2B,CAF3B,sBAAuB,CACvB,8BAKF,CAEA,yBACE,YAAa,CACb,gCACF,CAEA,4BACE,YAAa,CACb,oCACF,CAEA,4BAEE,oCAA6B,CAD7B,2KAAuC,CAEvC,QACF,CAEA,gCAGE,QACF,CAEA,sEAJE,kCAA2B,CAD3B,8KAWF,CANA,sCAEE,kBAAmB,CADnB,YAAa,CAEb,gCAGF,CAEA,iCAEE,kBAAmB,CADnB,YAAa,CAGb,8KAAsC,CADtC,oCAEF,CAEA,2BACE,iBAAkB,CAElB,8BAA0B,CAD1B,4BAAwB,CAExB,SACF","file":"Card-d8a02dd9.css","sourcesContent":[".Card {\n display: grid;\n position: relative;\n overflow: hidden;\n grid-auto-rows: max-content auto;\n border: var(--borderWidth-thin) solid var(--borderColor-default);\n box-shadow: var(--shadow-resting-small);\n background-color: var(--bgColor-default);\n gap: var(--stack-gap-normal);\n\n &[data-border-radius='large'] {\n border-radius: var(--borderRadius-large);\n }\n\n &[data-border-radius='medium'] {\n border-radius: var(--borderRadius-medium);\n }\n\n &[data-padding='normal'] {\n /* stylelint-disable-next-line primer/spacing */\n padding: var(--stack-padding-spacious);\n }\n\n &[data-padding='condensed'] {\n /* stylelint-disable-next-line primer/spacing */\n padding: var(--stack-padding-condensed);\n }\n\n &[data-padding='none'] {\n padding: 0;\n }\n}\n\n.CardHeader {\n display: block;\n width: 100%;\n height: auto;\n}\n\n.CardHeaderEdgeToEdge {\n /* stylelint-disable primer/spacing */\n margin-top: calc(-1 * var(--stack-padding-spacious));\n margin-right: calc(-1 * var(--stack-padding-spacious));\n margin-left: calc(-1 * var(--stack-padding-spacious));\n width: calc(100% + 2 * var(--stack-padding-spacious));\n /* stylelint-enable primer/spacing */\n}\n\n.CardImage {\n display: block;\n width: 100%;\n height: auto;\n}\n\n.CardIcon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: var(--base-size-32);\n height: var(--base-size-32);\n border-radius: var(--borderRadius-medium);\n background-color: var(--bgColor-muted);\n color: var(--fgColor-muted);\n}\n\n.CardBody {\n display: grid;\n gap: var(--stack-gap-normal);\n}\n\n.CardContent {\n display: grid;\n gap: var(--stack-gap-condensed);\n}\n\n.CardHeading {\n font: var(--text-title-shorthand-small);\n color: var(--fgColor-default);\n margin: 0;\n}\n\n.CardDescription {\n font: var(--text-body-shorthand-medium);\n color: var(--fgColor-muted);\n margin: 0;\n}\n\n.CardMetadataContainer {\n display: flex;\n align-items: center;\n gap: var(--stack-gap-normal);\n font: var(--text-body-shorthand-medium);\n color: var(--fgColor-muted);\n}\n\n.CardMetadataItem {\n display: flex;\n align-items: center;\n gap: var(--stack-gap-condensed);\n font: var(--text-body-shorthand-small);\n}\n\n.CardAction {\n position: absolute;\n top: var(--base-size-16);\n right: var(--base-size-16);\n z-index: 1;\n}\n"]}
|
package/dist/Card/Card.d.ts
CHANGED
|
@@ -1,21 +1,19 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
*/
|
|
2
|
+
import { type PolymorphicProps } from '../utils/modern-polymorphic';
|
|
3
|
+
type CardAs = 'div' | 'section';
|
|
4
|
+
export type CardProps<As extends CardAs = 'div'> = PolymorphicProps<As, 'div', {
|
|
5
|
+
/** Optional className for the root element. */
|
|
7
6
|
className?: string;
|
|
8
|
-
/**
|
|
9
|
-
* Controls the internal padding of the Card.
|
|
10
|
-
* @default 'normal'
|
|
11
|
-
*/
|
|
7
|
+
/** Internal padding. @default 'normal' */
|
|
12
8
|
padding?: 'none' | 'condensed' | 'normal';
|
|
9
|
+
/** Border radius. @default 'large' */
|
|
10
|
+
borderRadius?: 'medium' | 'large';
|
|
13
11
|
/**
|
|
14
|
-
*
|
|
15
|
-
*
|
|
12
|
+
* Card contents. Provide either `Card.*` subcomponents (e.g. `Card.Heading`,
|
|
13
|
+
* `Card.Description`, `Card.Metadata`) or custom content.
|
|
16
14
|
*/
|
|
17
|
-
|
|
18
|
-
}
|
|
15
|
+
children: React.ReactNode;
|
|
16
|
+
}>;
|
|
19
17
|
type HeadingLevel = 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
20
18
|
type HeadingProps = React.ComponentPropsWithoutRef<'h3'> & {
|
|
21
19
|
/**
|
|
@@ -25,6 +23,9 @@ type HeadingProps = React.ComponentPropsWithoutRef<'h3'> & {
|
|
|
25
23
|
children: React.ReactNode;
|
|
26
24
|
};
|
|
27
25
|
type DescriptionProps = React.ComponentPropsWithoutRef<'p'> & {
|
|
26
|
+
/**
|
|
27
|
+
* Card description. Rendered as a `<p>`, so keep it to flowing text.
|
|
28
|
+
*/
|
|
28
29
|
children: React.ReactNode;
|
|
29
30
|
};
|
|
30
31
|
type IconProps = {
|
|
@@ -48,37 +49,58 @@ type ImageProps = React.ComponentPropsWithoutRef<'img'> & {
|
|
|
48
49
|
*/
|
|
49
50
|
alt?: string;
|
|
50
51
|
};
|
|
51
|
-
type
|
|
52
|
+
type ActionProps = {
|
|
53
|
+
/** Interactive control for the top-right corner of the card. */
|
|
52
54
|
children: React.ReactNode;
|
|
53
55
|
};
|
|
54
56
|
type MetadataProps = React.ComponentPropsWithoutRef<'div'> & {
|
|
55
|
-
children: React.ReactNode;
|
|
56
|
-
};
|
|
57
|
-
declare const CardImpl: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
58
57
|
/**
|
|
59
|
-
*
|
|
60
|
-
*
|
|
58
|
+
* Metadata row at the bottom of the card. Any content works: text, icons,
|
|
59
|
+
* a `Label`, an `Octicon`.
|
|
61
60
|
*/
|
|
61
|
+
children: React.ReactNode;
|
|
62
|
+
};
|
|
63
|
+
declare const CardImpl: <As extends CardAs>(props: (React.ComponentPropsWithRef<React.ElementType extends As ? "div" : As> & {
|
|
64
|
+
/** Optional className for the root element. */
|
|
62
65
|
className?: string;
|
|
66
|
+
/** Internal padding. @default 'normal' */
|
|
67
|
+
padding?: "none" | "condensed" | "normal";
|
|
68
|
+
/** Border radius. @default 'large' */
|
|
69
|
+
borderRadius?: "medium" | "large";
|
|
63
70
|
/**
|
|
64
|
-
*
|
|
65
|
-
*
|
|
71
|
+
* Card contents. Provide either `Card.*` subcomponents (e.g. `Card.Heading`,
|
|
72
|
+
* `Card.Description`, `Card.Metadata`) or custom content.
|
|
66
73
|
*/
|
|
74
|
+
children: React.ReactNode;
|
|
75
|
+
} extends infer T ? T extends React.ComponentPropsWithRef<React.ElementType extends As ? "div" : As> & {
|
|
76
|
+
/** Optional className for the root element. */
|
|
77
|
+
className?: string;
|
|
78
|
+
/** Internal padding. @default 'normal' */
|
|
67
79
|
padding?: "none" | "condensed" | "normal";
|
|
80
|
+
/** Border radius. @default 'large' */
|
|
81
|
+
borderRadius?: "medium" | "large";
|
|
68
82
|
/**
|
|
69
|
-
*
|
|
70
|
-
*
|
|
83
|
+
* Card contents. Provide either `Card.*` subcomponents (e.g. `Card.Heading`,
|
|
84
|
+
* `Card.Description`, `Card.Metadata`) or custom content.
|
|
71
85
|
*/
|
|
72
|
-
|
|
73
|
-
} &
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
86
|
+
children: React.ReactNode;
|
|
87
|
+
} ? T extends unknown ? Omit<T, "as"> : never : never : never) & {
|
|
88
|
+
as?: As | undefined;
|
|
89
|
+
} & React.RefAttributes<any>) => React.ReactNode;
|
|
90
|
+
declare function CardIcon({ icon: IconComponent, 'aria-label': ariaLabel, className }: IconProps): React.JSX.Element;
|
|
91
|
+
declare namespace CardIcon {
|
|
92
|
+
var displayName: string;
|
|
93
|
+
}
|
|
94
|
+
declare function CardImage({ src, alt, className, ...rest }: ImageProps): React.JSX.Element;
|
|
95
|
+
declare namespace CardImage {
|
|
96
|
+
var displayName: string;
|
|
97
|
+
}
|
|
98
|
+
/**
|
|
99
|
+
* Heading shown at the top of a Card.
|
|
100
|
+
*
|
|
101
|
+
* When the parent Card uses `as="section"`, the heading's `id` is
|
|
102
|
+
* automatically wired to the section's `aria-labelledby`.
|
|
103
|
+
*/
|
|
82
104
|
declare const CardHeading: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, "ref"> & {
|
|
83
105
|
/**
|
|
84
106
|
* The heading level to render. Defaults to 'h3'.
|
|
@@ -87,20 +109,34 @@ declare const CardHeading: React.ForwardRefExoticComponent<Omit<React.DetailedHT
|
|
|
87
109
|
children: React.ReactNode;
|
|
88
110
|
} & React.RefAttributes<HTMLHeadingElement>>;
|
|
89
111
|
declare const CardDescription: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
|
|
112
|
+
/**
|
|
113
|
+
* Card description. Rendered as a `<p>`, so keep it to flowing text.
|
|
114
|
+
*/
|
|
90
115
|
children: React.ReactNode;
|
|
91
116
|
} & React.RefAttributes<HTMLParagraphElement>>;
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
117
|
+
/**
|
|
118
|
+
* Top-right slot for a single interactive control.
|
|
119
|
+
*
|
|
120
|
+
* Give the control a label that names the card (e.g. `"More options for
|
|
121
|
+
* Project Alpha"`, not just `"More options"`) so users can tell which card
|
|
122
|
+
* the action applies to when several cards are visible.
|
|
123
|
+
*/
|
|
124
|
+
declare function CardAction({ children }: ActionProps): React.JSX.Element;
|
|
125
|
+
declare namespace CardAction {
|
|
126
|
+
var displayName: string;
|
|
127
|
+
}
|
|
96
128
|
declare const CardMetadata: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
129
|
+
/**
|
|
130
|
+
* Metadata row at the bottom of the card. Any content works: text, icons,
|
|
131
|
+
* a `Label`, an `Octicon`.
|
|
132
|
+
*/
|
|
97
133
|
children: React.ReactNode;
|
|
98
134
|
} & React.RefAttributes<HTMLDivElement>>;
|
|
99
|
-
export { CardImpl, CardIcon, CardImage, CardHeading, CardDescription,
|
|
135
|
+
export { CardImpl, CardIcon, CardImage, CardHeading, CardDescription, CardAction, CardMetadata };
|
|
100
136
|
export type { HeadingProps as CardHeadingProps };
|
|
101
137
|
export type { DescriptionProps as CardDescriptionProps };
|
|
102
138
|
export type { IconProps as CardIconProps };
|
|
103
139
|
export type { ImageProps as CardImageProps };
|
|
104
|
-
export type {
|
|
140
|
+
export type { ActionProps as CardActionProps };
|
|
105
141
|
export type { MetadataProps as CardMetadataProps };
|
|
106
142
|
//# sourceMappingURL=Card.d.ts.map
|
package/dist/Card/Card.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/Card/Card.tsx"],"names":[],"mappings":"AACA,OAAO,
|
|
1
|
+
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/Card/Card.tsx"],"names":[],"mappings":"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"}
|