@primer/react 38.24.0-rc.ff9ea71b3 → 38.25.0-rc.89740d738
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 +24 -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/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/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
package/dist/Card/index.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { CardImpl, CardMetadata,
|
|
1
|
+
import { CardImpl, CardMetadata, CardAction, CardDescription, CardHeading, CardImage, CardIcon } from './Card.js';
|
|
2
2
|
|
|
3
3
|
const Card = Object.assign(CardImpl, {
|
|
4
4
|
Icon: CardIcon,
|
|
5
5
|
Image: CardImage,
|
|
6
6
|
Heading: CardHeading,
|
|
7
7
|
Description: CardDescription,
|
|
8
|
-
|
|
8
|
+
Action: CardAction,
|
|
9
9
|
Metadata: CardMetadata
|
|
10
10
|
});
|
|
11
11
|
|
|
@@ -27,6 +27,7 @@ export type CheckboxProps = {
|
|
|
27
27
|
* Used during form submission and to identify which checkbox inputs are selected
|
|
28
28
|
*/
|
|
29
29
|
value?: string;
|
|
30
|
+
'data-component'?: string;
|
|
30
31
|
} & Exclude<InputHTMLAttributes<HTMLInputElement>, 'value'>;
|
|
31
32
|
/**
|
|
32
33
|
* An accessible, native checkbox component
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../src/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAiD,KAAK,mBAAmB,EAAoB,MAAM,OAAO,CAAA;AAExH,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,qCAAqC,CAAA;AAI7E,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAElD,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;IACvC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,gBAAgB,CAAC,EAAE,oBAAoB,CAAA;IACvC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../src/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAAiD,KAAK,mBAAmB,EAAoB,MAAM,OAAO,CAAA;AAExH,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,qCAAqC,CAAA;AAI7E,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAElD,MAAM,MAAM,aAAa,GAAG;IAC1B;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;IACvC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,gBAAgB,CAAC,EAAE,oBAAoB,CAAA;IACvC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B,GAAG,OAAO,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAC,CAAA;AAE3D;;GAEG;AACH,QAAA,MAAM,QAAQ,qGAuEb,CAAA;wBAK0B,cAAc,CAAC,OAAO,QAAQ,CAAC;AAA1D,wBAA0D"}
|
|
@@ -20,6 +20,7 @@ const Checkbox = /*#__PURE__*/React.forwardRef(({
|
|
|
20
20
|
required,
|
|
21
21
|
validationStatus,
|
|
22
22
|
value,
|
|
23
|
+
['data-component']: dataComponent,
|
|
23
24
|
...rest
|
|
24
25
|
}, ref
|
|
25
26
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -66,11 +67,15 @@ const Checkbox = /*#__PURE__*/React.forwardRef(({
|
|
|
66
67
|
checkbox.setAttribute('aria-checked', checkbox.checked ? 'true' : 'false');
|
|
67
68
|
}
|
|
68
69
|
});
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
70
|
+
return (
|
|
71
|
+
/*#__PURE__*/
|
|
72
|
+
// @ts-expect-error inputProp needs a non nullable ref
|
|
73
|
+
jsx("input", {
|
|
74
|
+
...inputProps,
|
|
75
|
+
"data-component": dataComponent !== null && dataComponent !== void 0 ? dataComponent : 'Checkbox',
|
|
76
|
+
className: clsx(className, sharedClasses.Input, classes.Checkbox)
|
|
77
|
+
})
|
|
78
|
+
);
|
|
74
79
|
});
|
|
75
80
|
Checkbox.displayName = 'Checkbox';
|
|
76
81
|
Checkbox.__SLOT__ = Symbol('Checkbox');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CircleBadge.d.ts","sourceRoot":"","sources":["../../src/CircleBadge/CircleBadge.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAGlD,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,YAAY,CAAA;AAG5C,QAAA,MAAM,YAAY;;;;CAIjB,CAAA;AAED,MAAM,MAAM,gBAAgB,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,IAAI;IAC3D,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,OAAO,YAAY,CAAA;IACnC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,KAAK,CAAC,qBAAqB,CAAC,KAAK,CAAC,WAAW,SAAS,EAAE,GAAG,GAAG,GAAG,EAAE,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"CircleBadge.d.ts","sourceRoot":"","sources":["../../src/CircleBadge/CircleBadge.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAGlD,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,YAAY,CAAA;AAG5C,QAAA,MAAM,YAAY;;;;CAIjB,CAAA;AAED,MAAM,MAAM,gBAAgB,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,IAAI;IAC3D,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,OAAO,YAAY,CAAA;IACnC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,KAAK,CAAC,qBAAqB,CAAC,KAAK,CAAC,WAAW,SAAS,EAAE,GAAG,GAAG,GAAG,EAAE,CAAC,CAAA;AAoBxE,QAAA,MAAM,eAAe;YAAW,YAAY;;CAE3C,CAAA;AAID,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,CAAA;AAEzE;;;GAGG;0BArBkB,EAAE,SAAS,KAAK,CAAC,WAAW,+BAAqC,gBAAgB,CAAC,EAAE,CAAC;;gBAU1E,YAAY;;;;AAY5C,wBAAkE"}
|
|
@@ -21,69 +21,85 @@ const sizeStyles = ({
|
|
|
21
21
|
};
|
|
22
22
|
};
|
|
23
23
|
const CircleBadge = t0 => {
|
|
24
|
-
const $ = c(
|
|
24
|
+
const $ = c(14);
|
|
25
25
|
let T0;
|
|
26
26
|
let t1;
|
|
27
27
|
let t2;
|
|
28
28
|
let t3;
|
|
29
29
|
let t4;
|
|
30
|
+
let t5;
|
|
30
31
|
if ($[0] !== t0) {
|
|
31
32
|
const {
|
|
32
|
-
as:
|
|
33
|
+
as: t6,
|
|
33
34
|
...props
|
|
34
35
|
} = t0;
|
|
35
|
-
const Component =
|
|
36
|
+
const Component = t6 === undefined ? "div" : t6;
|
|
36
37
|
T0 = Component;
|
|
37
38
|
t1 = props;
|
|
38
|
-
t2 =
|
|
39
|
-
t3 = props.
|
|
40
|
-
t4 =
|
|
39
|
+
t2 = "CircleBadge";
|
|
40
|
+
t3 = clsx(styles.CircleBadge, props.className);
|
|
41
|
+
t4 = props.inline ? "" : undefined;
|
|
42
|
+
t5 = sizeStyles(props);
|
|
41
43
|
$[0] = t0;
|
|
42
44
|
$[1] = T0;
|
|
43
45
|
$[2] = t1;
|
|
44
46
|
$[3] = t2;
|
|
45
47
|
$[4] = t3;
|
|
46
48
|
$[5] = t4;
|
|
49
|
+
$[6] = t5;
|
|
47
50
|
} else {
|
|
48
51
|
T0 = $[1];
|
|
49
52
|
t1 = $[2];
|
|
50
53
|
t2 = $[3];
|
|
51
54
|
t3 = $[4];
|
|
52
55
|
t4 = $[5];
|
|
56
|
+
t5 = $[6];
|
|
53
57
|
}
|
|
54
|
-
let
|
|
55
|
-
if ($[
|
|
56
|
-
|
|
58
|
+
let t6;
|
|
59
|
+
if ($[7] !== T0 || $[8] !== t1 || $[9] !== t2 || $[10] !== t3 || $[11] !== t4 || $[12] !== t5) {
|
|
60
|
+
t6 = /*#__PURE__*/jsx(T0, {
|
|
57
61
|
...t1,
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
62
|
+
"data-component": t2,
|
|
63
|
+
className: t3,
|
|
64
|
+
"data-inline": t4,
|
|
65
|
+
style: t5
|
|
61
66
|
});
|
|
62
|
-
$[
|
|
63
|
-
$[
|
|
64
|
-
$[
|
|
65
|
-
$[
|
|
66
|
-
$[
|
|
67
|
-
$[
|
|
67
|
+
$[7] = T0;
|
|
68
|
+
$[8] = t1;
|
|
69
|
+
$[9] = t2;
|
|
70
|
+
$[10] = t3;
|
|
71
|
+
$[11] = t4;
|
|
72
|
+
$[12] = t5;
|
|
73
|
+
$[13] = t6;
|
|
68
74
|
} else {
|
|
69
|
-
|
|
75
|
+
t6 = $[13];
|
|
70
76
|
}
|
|
71
|
-
return
|
|
77
|
+
return t6;
|
|
72
78
|
};
|
|
73
79
|
const CircleBadgeIcon = props => {
|
|
74
|
-
const $ = c(
|
|
80
|
+
const $ = c(5);
|
|
75
81
|
let t0;
|
|
76
|
-
if ($[0] !== props) {
|
|
77
|
-
t0 =
|
|
78
|
-
|
|
79
|
-
...props
|
|
80
|
-
});
|
|
81
|
-
$[0] = props;
|
|
82
|
+
if ($[0] !== props.className) {
|
|
83
|
+
t0 = clsx(styles.CircleBadgeIcon, props.className);
|
|
84
|
+
$[0] = props.className;
|
|
82
85
|
$[1] = t0;
|
|
83
86
|
} else {
|
|
84
87
|
t0 = $[1];
|
|
85
88
|
}
|
|
86
|
-
|
|
89
|
+
let t1;
|
|
90
|
+
if ($[2] !== props || $[3] !== t0) {
|
|
91
|
+
t1 = /*#__PURE__*/jsx(Octicon, {
|
|
92
|
+
...props,
|
|
93
|
+
"data-component": "CircleBadge.Icon",
|
|
94
|
+
className: t0
|
|
95
|
+
});
|
|
96
|
+
$[2] = props;
|
|
97
|
+
$[3] = t0;
|
|
98
|
+
$[4] = t1;
|
|
99
|
+
} else {
|
|
100
|
+
t1 = $[4];
|
|
101
|
+
}
|
|
102
|
+
return t1;
|
|
87
103
|
};
|
|
88
104
|
CircleBadgeIcon.displayName = 'CircleBadge.Icon';
|
|
89
105
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmationDialog.d.ts","sourceRoot":"","sources":["../../src/ConfirmationDialog/ConfirmationDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAoB,WAAW,EAAE,YAAY,EAAC,MAAM,WAAW,CAAA;AAI3E;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC;;;OAGG;IACH,OAAO,EAAE,CAAC,OAAO,EAAE,SAAS,GAAG,cAAc,GAAG,QAAQ,GAAG,QAAQ,KAAK,IAAI,CAAA;IAE5E;;;OAGG;IACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IAEtB;;OAEG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAErC;;OAEG;IACH,oBAAoB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAEtC;;OAEG;IACH,iBAAiB,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAA;IAEnD;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAE7B;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAE9B;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAE1C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,WAAW,CAAA;IAEnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,YAAY,CAAA;CACtB;AAED;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,uBAAuB,CAAC,
|
|
1
|
+
{"version":3,"file":"ConfirmationDialog.d.ts","sourceRoot":"","sources":["../../src/ConfirmationDialog/ConfirmationDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAoB,WAAW,EAAE,YAAY,EAAC,MAAM,WAAW,CAAA;AAI3E;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC;;;OAGG;IACH,OAAO,EAAE,CAAC,OAAO,EAAE,SAAS,GAAG,cAAc,GAAG,QAAQ,GAAG,QAAQ,KAAK,IAAI,CAAA;IAE5E;;;OAGG;IACH,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IAEtB;;OAEG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAErC;;OAEG;IACH,oBAAoB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAEtC;;OAEG;IACH,iBAAiB,CAAC,EAAE,QAAQ,GAAG,SAAS,GAAG,QAAQ,CAAA;IAEnD;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAE7B;;OAEG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAE9B;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAE1C;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,WAAW,CAAA;IAEnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,YAAY,CAAA;CACtB;AAED;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,uBAAuB,CAAC,CAqDzF,CAAA;AAGD,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,uBAAuB,EAAE,SAAS,CAAC,GAAG;IAAC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;CAAC,CAAA;AAyBlG;;;;GAIG;AACH,wBAAgB,UAAU,cACa,cAAc,sBAIpD"}
|
|
@@ -5,12 +5,14 @@ export type CounterLabelProps = React.PropsWithChildren<HTMLAttributes<HTMLSpanE
|
|
|
5
5
|
scheme?: 'primary' | 'secondary';
|
|
6
6
|
variant?: 'primary' | 'secondary';
|
|
7
7
|
className?: string;
|
|
8
|
+
'data-component'?: string;
|
|
8
9
|
}>;
|
|
9
10
|
declare const CounterLabel: React.ForwardRefExoticComponent<HTMLAttributes<HTMLSpanElement> & {
|
|
10
11
|
/** @deprecated use variant instead */
|
|
11
12
|
scheme?: "primary" | "secondary";
|
|
12
13
|
variant?: "primary" | "secondary";
|
|
13
14
|
className?: string;
|
|
15
|
+
'data-component'?: string;
|
|
14
16
|
} & {
|
|
15
17
|
children?: React.ReactNode | undefined;
|
|
16
18
|
} & React.RefAttributes<HTMLSpanElement>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CounterLabel.d.ts","sourceRoot":"","sources":["../../src/CounterLabel/CounterLabel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,iBAAiB,CACrD,cAAc,CAAC,eAAe,CAAC,GAAG;IAChC,sCAAsC;IACtC,MAAM,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IAChC,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IACjC,SAAS,CAAC,EAAE,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"CounterLabel.d.ts","sourceRoot":"","sources":["../../src/CounterLabel/CounterLabel.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,OAAO,CAAA;AACzC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,MAAM,MAAM,iBAAiB,GAAG,KAAK,CAAC,iBAAiB,CACrD,cAAc,CAAC,eAAe,CAAC,GAAG;IAChC,sCAAsC;IACtC,MAAM,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IAChC,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;IACjC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B,CACF,CAAA;AAED,QAAA,MAAM,YAAY;IARd,sCAAsC;aAC7B,SAAS,GAAG,WAAW;cACtB,SAAS,GAAG,WAAW;gBACrB,MAAM;uBACC,MAAM;;;yCA8B5B,CAAA;AAID,eAAe,YAAY,CAAA"}
|
|
@@ -1,100 +1,35 @@
|
|
|
1
|
-
import { c } from 'react-compiler-runtime';
|
|
2
1
|
import { clsx } from 'clsx';
|
|
3
2
|
import { forwardRef } from 'react';
|
|
4
3
|
import classes from './CounterLabel.module.css.js';
|
|
5
|
-
import {
|
|
4
|
+
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
6
5
|
import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
|
|
7
6
|
|
|
8
|
-
const CounterLabel = /*#__PURE__*/forwardRef((
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
$[5] = variant;
|
|
29
|
-
} else {
|
|
30
|
-
children = $[1];
|
|
31
|
-
className = $[2];
|
|
32
|
-
rest = $[3];
|
|
33
|
-
scheme = $[4];
|
|
34
|
-
variant = $[5];
|
|
35
|
-
}
|
|
36
|
-
let t1;
|
|
37
|
-
if ($[6] !== children) {
|
|
38
|
-
t1 = /*#__PURE__*/jsxs(VisuallyHidden, {
|
|
39
|
-
children: ["\xA0(", children, ")"]
|
|
40
|
-
});
|
|
41
|
-
$[6] = children;
|
|
42
|
-
$[7] = t1;
|
|
43
|
-
} else {
|
|
44
|
-
t1 = $[7];
|
|
45
|
-
}
|
|
46
|
-
const label = t1;
|
|
47
|
-
const inferredVariant = variant || scheme || "secondary";
|
|
48
|
-
let t2;
|
|
49
|
-
if ($[8] !== forwardedRef || $[9] !== inferredVariant || $[10] !== rest) {
|
|
50
|
-
t2 = {
|
|
51
|
-
ref: forwardedRef,
|
|
52
|
-
"aria-hidden": "true",
|
|
53
|
-
"data-variant": inferredVariant,
|
|
54
|
-
...rest
|
|
55
|
-
};
|
|
56
|
-
$[8] = forwardedRef;
|
|
57
|
-
$[9] = inferredVariant;
|
|
58
|
-
$[10] = rest;
|
|
59
|
-
$[11] = t2;
|
|
60
|
-
} else {
|
|
61
|
-
t2 = $[11];
|
|
62
|
-
}
|
|
63
|
-
const counterProps = t2;
|
|
64
|
-
let t3;
|
|
65
|
-
if ($[12] !== className) {
|
|
66
|
-
t3 = clsx(className, classes.CounterLabel);
|
|
67
|
-
$[12] = className;
|
|
68
|
-
$[13] = t3;
|
|
69
|
-
} else {
|
|
70
|
-
t3 = $[13];
|
|
71
|
-
}
|
|
72
|
-
let t4;
|
|
73
|
-
if ($[14] !== children || $[15] !== counterProps || $[16] !== t3) {
|
|
74
|
-
t4 = /*#__PURE__*/jsx("span", {
|
|
7
|
+
const CounterLabel = /*#__PURE__*/forwardRef(({
|
|
8
|
+
variant,
|
|
9
|
+
scheme,
|
|
10
|
+
className,
|
|
11
|
+
children,
|
|
12
|
+
['data-component']: dataComponent,
|
|
13
|
+
...rest
|
|
14
|
+
}, forwardedRef) => {
|
|
15
|
+
const label = /*#__PURE__*/jsxs(VisuallyHidden, {
|
|
16
|
+
children: ["\xA0(", children, ")"]
|
|
17
|
+
});
|
|
18
|
+
const inferredVariant = variant || scheme || 'secondary';
|
|
19
|
+
const counterProps = {
|
|
20
|
+
ref: forwardedRef,
|
|
21
|
+
['aria-hidden']: 'true',
|
|
22
|
+
['data-variant']: inferredVariant,
|
|
23
|
+
...rest
|
|
24
|
+
};
|
|
25
|
+
return /*#__PURE__*/jsxs(Fragment, {
|
|
26
|
+
children: [/*#__PURE__*/jsx("span", {
|
|
75
27
|
...counterProps,
|
|
76
|
-
|
|
28
|
+
"data-component": dataComponent !== null && dataComponent !== void 0 ? dataComponent : 'CounterLabel',
|
|
29
|
+
className: clsx(className, classes.CounterLabel),
|
|
77
30
|
children: children
|
|
78
|
-
})
|
|
79
|
-
|
|
80
|
-
$[15] = counterProps;
|
|
81
|
-
$[16] = t3;
|
|
82
|
-
$[17] = t4;
|
|
83
|
-
} else {
|
|
84
|
-
t4 = $[17];
|
|
85
|
-
}
|
|
86
|
-
let t5;
|
|
87
|
-
if ($[18] !== label || $[19] !== t4) {
|
|
88
|
-
t5 = /*#__PURE__*/jsxs(Fragment, {
|
|
89
|
-
children: [t4, label]
|
|
90
|
-
});
|
|
91
|
-
$[18] = label;
|
|
92
|
-
$[19] = t4;
|
|
93
|
-
$[20] = t5;
|
|
94
|
-
} else {
|
|
95
|
-
t5 = $[20];
|
|
96
|
-
}
|
|
97
|
-
return t5;
|
|
31
|
+
}), label]
|
|
32
|
+
});
|
|
98
33
|
});
|
|
99
34
|
CounterLabel.displayName = 'CounterLabel';
|
|
100
35
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTable.d.ts","sourceRoot":"","sources":["../../src/DataTable/useTable.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,UAAU,CAAA;AACpC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAA;AACpC,OAAO,EAAyB,aAAa,EAAyB,MAAM,WAAW,CAAA;AAGvF,UAAU,WAAW,CAAC,IAAI,SAAS,SAAS;IAC1C,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAA;IAC5B,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,CAAA;IACjB,iBAAiB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACnC,oBAAoB,CAAC,EAAE,OAAO,CAAC,aAAa,EAAE,MAAM,CAAC,CAAA;IACrD,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,QAAQ,EAAE,CAAC,OAAO,EAAE,IAAI,KAAK,MAAM,GAAG,MAAM,CAAA;CAC7C;AAED,UAAU,KAAK,CAAC,IAAI,SAAS,SAAS;IACpC,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAA;IAC5B,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAA;IACtB,OAAO,EAAE;QACP,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,IAAI,CAAA;KACvC,CAAA;IACD,mBAAmB,EAAE,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAA;CAChE;AAED,UAAU,MAAM,CAAC,IAAI,SAAS,SAAS;IACrC,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,CAAA;IACpB,UAAU,EAAE,MAAM,OAAO,CAAA;IACzB,gBAAgB,EAAE,MAAM,aAAa,GAAG,OAAO,CAAC,aAAa,EAAE,MAAM,CAAC,CAAA;CACvE;AAED,UAAU,GAAG,CAAC,IAAI,SAAS,SAAS;IAClC,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB,QAAQ,EAAE,MAAM,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IACjC,QAAQ,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,UAAU,IAAI,CAAC,IAAI,SAAS,SAAS;IACnC,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,CAAA;IACpB,QAAQ,EAAE,MAAM,IAAI,CAAC,MAAM,IAAI,CAAC,CAAA;IAChC,SAAS,EAAE,OAAO,CAAA;CACnB;AAID,wBAAgB,QAAQ,CAAC,IAAI,SAAS,SAAS,EAAE,EAC/C,OAAO,EACP,IAAI,EACJ,iBAAiB,EACjB,oBAAoB,EACpB,eAAe,EACf,QAAQ,GACT,EAAE,WAAW,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,
|
|
1
|
+
{"version":3,"file":"useTable.d.ts","sourceRoot":"","sources":["../../src/DataTable/useTable.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,MAAM,EAAC,MAAM,UAAU,CAAA;AACpC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAA;AACpC,OAAO,EAAyB,aAAa,EAAyB,MAAM,WAAW,CAAA;AAGvF,UAAU,WAAW,CAAC,IAAI,SAAS,SAAS;IAC1C,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAA;IAC5B,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,CAAA;IACjB,iBAAiB,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACnC,oBAAoB,CAAC,EAAE,OAAO,CAAC,aAAa,EAAE,MAAM,CAAC,CAAA;IACrD,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,QAAQ,EAAE,CAAC,OAAO,EAAE,IAAI,KAAK,MAAM,GAAG,MAAM,CAAA;CAC7C;AAED,UAAU,KAAK,CAAC,IAAI,SAAS,SAAS;IACpC,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAA;IAC5B,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAA;IACtB,OAAO,EAAE;QACP,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,KAAK,IAAI,CAAA;KACvC,CAAA;IACD,mBAAmB,EAAE,KAAK,CAAC,aAAa,CAAC,qBAAqB,CAAC,CAAA;CAChE;AAED,UAAU,MAAM,CAAC,IAAI,SAAS,SAAS;IACrC,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,CAAA;IACpB,UAAU,EAAE,MAAM,OAAO,CAAA;IACzB,gBAAgB,EAAE,MAAM,aAAa,GAAG,OAAO,CAAC,aAAa,EAAE,MAAM,CAAC,CAAA;CACvE;AAED,UAAU,GAAG,CAAC,IAAI,SAAS,SAAS;IAClC,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB,QAAQ,EAAE,MAAM,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IACjC,QAAQ,EAAE,MAAM,IAAI,CAAA;CACrB;AAED,UAAU,IAAI,CAAC,IAAI,SAAS,SAAS;IACnC,EAAE,EAAE,MAAM,CAAA;IACV,MAAM,EAAE,MAAM,CAAC,IAAI,CAAC,CAAA;IACpB,QAAQ,EAAE,MAAM,IAAI,CAAC,MAAM,IAAI,CAAC,CAAA;IAChC,SAAS,EAAE,OAAO,CAAA;CACnB;AAID,wBAAgB,QAAQ,CAAC,IAAI,SAAS,SAAS,EAAE,EAC/C,OAAO,EACP,IAAI,EACJ,iBAAiB,EACjB,oBAAoB,EACpB,eAAe,EACf,QAAQ,GACT,EAAE,WAAW,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,IAAI,CAAC,CA0KjC;AAyED,wBAAgB,cAAc,CAAC,IAAI,SAAS,SAAS,EAAE,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,GAAG;IAAC,mBAAmB,EAAE,MAAM,CAAA;CAAC,CAIlH;AAED,wBAAgB,0BAA0B,CAAC,IAAI,SAAS,SAAS,EAAE,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,GAAG,MAAM,EAAE,CAwCzG"}
|
|
@@ -114,16 +114,18 @@ function useTable(t0) {
|
|
|
114
114
|
}
|
|
115
115
|
const valueA = get(a, header_1.column.field);
|
|
116
116
|
const valueB = get(b, header_1.column.field);
|
|
117
|
-
|
|
117
|
+
const valueAIsBlank = isBlankValue(valueA);
|
|
118
|
+
const valueBIsBlank = isBlankValue(valueB);
|
|
119
|
+
if (!valueAIsBlank && !valueBIsBlank) {
|
|
118
120
|
if (state.direction === SortDirection.ASC) {
|
|
119
121
|
return sortMethod(valueA, valueB);
|
|
120
122
|
}
|
|
121
123
|
return sortMethod(valueB, valueA);
|
|
122
124
|
}
|
|
123
|
-
if (
|
|
125
|
+
if (!valueAIsBlank) {
|
|
124
126
|
return -1;
|
|
125
127
|
}
|
|
126
|
-
if (
|
|
128
|
+
if (!valueBIsBlank) {
|
|
127
129
|
return 1;
|
|
128
130
|
}
|
|
129
131
|
return 0;
|
|
@@ -296,5 +298,8 @@ function get(object, path) {
|
|
|
296
298
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
297
299
|
}, object);
|
|
298
300
|
}
|
|
301
|
+
function isBlankValue(value) {
|
|
302
|
+
return value === null || value === undefined || value === '';
|
|
303
|
+
}
|
|
299
304
|
|
|
300
305
|
export { getGridTemplateFromColumns, useTable, useTableLayout };
|
|
@@ -11,9 +11,13 @@ declare namespace Summary {
|
|
|
11
11
|
var displayName: string;
|
|
12
12
|
}
|
|
13
13
|
export { Summary };
|
|
14
|
-
declare const Details: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.DetailsHTMLAttributes<HTMLDetailsElement>, HTMLDetailsElement>, "ref"> &
|
|
14
|
+
declare const Details: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.DetailsHTMLAttributes<HTMLDetailsElement>, HTMLDetailsElement>, "ref"> & {
|
|
15
|
+
'data-component'?: string;
|
|
16
|
+
} & React.RefAttributes<HTMLDetailsElement>> & {
|
|
15
17
|
Summary: typeof Summary;
|
|
16
18
|
};
|
|
17
|
-
export type DetailsProps = ComponentPropsWithoutRef<'details'
|
|
19
|
+
export type DetailsProps = ComponentPropsWithoutRef<'details'> & {
|
|
20
|
+
'data-component'?: string;
|
|
21
|
+
};
|
|
18
22
|
export default Details;
|
|
19
23
|
//# sourceMappingURL=Details.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Details.d.ts","sourceRoot":"","sources":["../../src/Details/Details.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAY,KAAK,wBAAwB,EAAoB,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"Details.d.ts","sourceRoot":"","sources":["../../src/Details/Details.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAY,KAAK,wBAAwB,EAAoB,MAAM,OAAO,CAAA;AA2CxF,MAAM,MAAM,YAAY,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,IAAI;IACvD;;OAEG;IACH,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,WAAW,SAAS,EAAE,GAAG,EAAE,GAAG,SAAS,CAAC,CAAA;AAEjF,iBAAS,OAAO,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,EAAE,EAAC,EAAE,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAC,EAAE,YAAY,CAAC,EAAE,CAAC,qBAOxF;kBAPQ,OAAO;;;AAUhB,OAAO,EAAC,OAAO,EAAC,CAAA;AAEhB,QAAA,MAAM,OAAO;uBAKQ,MAAM;;;CAHzB,CAAA;AAEF,MAAM,MAAM,YAAY,GAAG,wBAAwB,CAAC,SAAS,CAAC,GAAG;IAC/D,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B,CAAA;AACD,eAAe,OAAO,CAAA"}
|
package/dist/Details/Details.js
CHANGED
|
@@ -9,30 +9,35 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
9
9
|
const Root = /*#__PURE__*/React.forwardRef(
|
|
10
10
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
11
11
|
(t0, forwardRef) => {
|
|
12
|
-
|
|
12
|
+
var _dataComponent;
|
|
13
|
+
const $ = c(15);
|
|
13
14
|
let children;
|
|
14
15
|
let className;
|
|
16
|
+
let dataComponent;
|
|
15
17
|
let rest;
|
|
16
18
|
if ($[0] !== t0) {
|
|
17
19
|
({
|
|
18
20
|
className,
|
|
19
21
|
children,
|
|
22
|
+
"data-component": dataComponent,
|
|
20
23
|
...rest
|
|
21
24
|
} = t0);
|
|
22
25
|
$[0] = t0;
|
|
23
26
|
$[1] = children;
|
|
24
27
|
$[2] = className;
|
|
25
|
-
$[3] =
|
|
28
|
+
$[3] = dataComponent;
|
|
29
|
+
$[4] = rest;
|
|
26
30
|
} else {
|
|
27
31
|
children = $[1];
|
|
28
32
|
className = $[2];
|
|
29
|
-
|
|
33
|
+
dataComponent = $[3];
|
|
34
|
+
rest = $[4];
|
|
30
35
|
}
|
|
31
36
|
const detailsRef = React.useRef(null);
|
|
32
37
|
const ref = useMergedRefs(forwardRef, detailsRef);
|
|
33
38
|
let t1;
|
|
34
39
|
let t2;
|
|
35
|
-
if ($[
|
|
40
|
+
if ($[5] === Symbol.for("react.memo_cache_sentinel")) {
|
|
36
41
|
t1 = () => {
|
|
37
42
|
if (!(process.env.NODE_ENV !== "production")) {
|
|
38
43
|
return;
|
|
@@ -47,38 +52,41 @@ const Root = /*#__PURE__*/React.forwardRef(
|
|
|
47
52
|
process.env.NODE_ENV !== "production" ? warning(summary === null, "The <Details> component must have a <summary> child component. You can either use <Details.Summary> or a native <summary> element.") : void 0;
|
|
48
53
|
};
|
|
49
54
|
t2 = [];
|
|
50
|
-
$[
|
|
51
|
-
$[
|
|
55
|
+
$[5] = t1;
|
|
56
|
+
$[6] = t2;
|
|
52
57
|
} else {
|
|
53
|
-
t1 = $[
|
|
54
|
-
t2 = $[
|
|
58
|
+
t1 = $[5];
|
|
59
|
+
t2 = $[6];
|
|
55
60
|
}
|
|
56
61
|
useEffect(t1, t2);
|
|
57
62
|
let t3;
|
|
58
|
-
if ($[
|
|
63
|
+
if ($[7] !== className) {
|
|
59
64
|
t3 = clsx(className, classes.Details);
|
|
60
|
-
$[
|
|
61
|
-
$[
|
|
65
|
+
$[7] = className;
|
|
66
|
+
$[8] = t3;
|
|
62
67
|
} else {
|
|
63
|
-
t3 = $[
|
|
68
|
+
t3 = $[8];
|
|
64
69
|
}
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
70
|
+
const t4 = (_dataComponent = dataComponent) !== null && _dataComponent !== void 0 ? _dataComponent : "Details";
|
|
71
|
+
let t5;
|
|
72
|
+
if ($[9] !== children || $[10] !== ref || $[11] !== rest || $[12] !== t3 || $[13] !== t4) {
|
|
73
|
+
t5 = /*#__PURE__*/jsx("details", {
|
|
68
74
|
className: t3,
|
|
69
75
|
...rest,
|
|
70
76
|
ref: ref,
|
|
77
|
+
"data-component": t4,
|
|
71
78
|
children: children
|
|
72
79
|
});
|
|
73
|
-
$[
|
|
74
|
-
$[
|
|
75
|
-
$[
|
|
76
|
-
$[
|
|
77
|
-
$[
|
|
80
|
+
$[9] = children;
|
|
81
|
+
$[10] = ref;
|
|
82
|
+
$[11] = rest;
|
|
83
|
+
$[12] = t3;
|
|
84
|
+
$[13] = t4;
|
|
85
|
+
$[14] = t5;
|
|
78
86
|
} else {
|
|
79
|
-
|
|
87
|
+
t5 = $[14];
|
|
80
88
|
}
|
|
81
|
-
return
|
|
89
|
+
return t5;
|
|
82
90
|
});
|
|
83
91
|
Root.displayName = 'Details';
|
|
84
92
|
function Summary(t0) {
|
|
@@ -109,6 +117,7 @@ function Summary(t0) {
|
|
|
109
117
|
t2 = /*#__PURE__*/jsx(Component, {
|
|
110
118
|
as: t1,
|
|
111
119
|
...props,
|
|
120
|
+
"data-component": "Details.Summary",
|
|
112
121
|
children: children
|
|
113
122
|
});
|
|
114
123
|
$[4] = Component;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
@property --prc-dialog-scrollgutter{initial-value:0;inherits:false;syntax:"<length>"}@keyframes prc-Dialog-dialog-backdrop-appear-tCG2K{0%{opacity:0}to{opacity:1}}@keyframes prc-Dialog-Overlay--motion-scaleFade-mE6-C{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes prc-Dialog-Overlay--motion-slideUp-tPElO{0%{transform:translateY(100%)}}@keyframes prc-Dialog-Overlay--motion-slideInRight-BR-CZ{0%{transform:translateX(-100%)}}@keyframes prc-Dialog-Overlay--motion-slideInLeft-ISmQZ{0%{transform:translateX(100%)}}@keyframes prc-Dialog-detect-scroll-b3i8Q{0%,to{--can-scroll:1}}.prc-Dialog-Backdrop-5Nt2U{animation:prc-Dialog-dialog-backdrop-appear-tCG2K .2s cubic-bezier(.33,1,.68,1);background-color:var(--overlay-backdrop-bgColor,#c8d1da66);bottom:0;display:flex;left:0;position:fixed;right:0;top:0}.prc-Dialog-Backdrop-5Nt2U,.prc-Dialog-Backdrop-5Nt2U[data-position-regular=center]{align-items:center;justify-content:center}.prc-Dialog-Backdrop-5Nt2U[data-position-regular=left]{align-items:center;justify-content:flex-start}.prc-Dialog-Backdrop-5Nt2U[data-position-regular=right]{align-items:center;justify-content:flex-end}.prc-Dialog-Backdrop-5Nt2U[data-align=top]:where(:not([data-position-regular=left]):not([data-position-regular=right])){align-items:flex-start}.prc-Dialog-Backdrop-5Nt2U[data-align=center]:where(:not([data-position-regular=left]):not([data-position-regular=right])){align-items:center}.prc-Dialog-Backdrop-5Nt2U[data-align=bottom]:where(:not([data-position-regular=left]):not([data-position-regular=right])){align-items:flex-end}@media (max-width:767px){.prc-Dialog-Backdrop-5Nt2U[data-position-narrow=center]{align-items:center;justify-content:center}.prc-Dialog-Backdrop-5Nt2U[data-position-narrow=center][data-align=top]{align-items:flex-start}.prc-Dialog-Backdrop-5Nt2U[data-position-narrow=center][data-align=center]{align-items:center}.prc-Dialog-Backdrop-5Nt2U[data-position-narrow=center][data-align=bottom]{align-items:flex-end}.prc-Dialog-Backdrop-5Nt2U[data-position-narrow=bottom]{align-items:end;justify-content:center}}.prc-Dialog-Dialog-G8cDF{background-color:var(--overlay-bgColor,#fff);border-radius:var(--borderRadius-large,.75rem);border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));box-shadow:var(--shadow-floating-small,0 0 0 1px #d1d9e080,0 6px 12px -3px #25292e0a,0 6px 18px 0 #25292e1f);display:flex;flex-direction:column;height:auto;max-height:calc(100dvh - 64px);max-width:calc(100dvw - 64px);min-width:296px;opacity:1;width:var(--dialog-width,640px)}.prc-Dialog-Dialog-G8cDF:where([data-width=small]){width:296px}.prc-Dialog-Dialog-G8cDF:where([data-width=medium]){width:320px}.prc-Dialog-Dialog-G8cDF:where([data-width=large]){width:480px}.prc-Dialog-Dialog-G8cDF:where([data-height=small]){height:480px}.prc-Dialog-Dialog-G8cDF:where([data-height=large]){height:640px}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF{animation:prc-Dialog-Overlay--motion-scaleFade-mE6-C .2s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-regular=center]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem))}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-regular=center]{animation:prc-Dialog-Overlay--motion-scaleFade-mE6-C .2s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-regular=center][data-align=top]{margin-top:var(--base-size-64,4rem)}.prc-Dialog-Dialog-G8cDF[data-position-regular=center][data-align=bottom]{margin-bottom:var(--base-size-64,4rem)}.prc-Dialog-Dialog-G8cDF[data-position-regular=left]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));border-bottom-left-radius:0;border-top-left-radius:0;height:100dvh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-regular=left]{animation:prc-Dialog-Overlay--motion-slideInRight-BR-CZ .25s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-regular=right]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));border-bottom-right-radius:0;border-top-right-radius:0;height:100dvh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-regular=right]{animation:prc-Dialog-Overlay--motion-slideInLeft-ISmQZ .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}@media (max-width:767px){.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));height:auto;width:var(--dialog-width,640px)}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-width=small]){width:296px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-width=medium]){width:320px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-width=large]){width:480px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-height=small]){height:480px}.prc-Dialog-Dialog-G8cDF[data-position-narrow=center]:where([data-height=large]){height:640px}@media (max-height:280px){.prc-Dialog-Dialog-G8cDF{max-height:calc(100dvh - 12px);max-width:calc(100dvw - 12px)}}.prc-Dialog-Dialog-G8cDF[data-position-narrow=bottom]{border-radius:var(--borderRadius-large,var(--borderRadius-large,.75rem));border-bottom-left-radius:0;border-bottom-right-radius:0;height:auto;max-height:calc(100dvh - 64px);max-width:100dvw;width:100dvw}.prc-Dialog-Dialog-G8cDF[data-position-narrow=bottom][data-align]{margin-bottom:0;margin-top:0}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-narrow=bottom]{animation:prc-Dialog-Overlay--motion-slideUp-tPElO .25s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}.prc-Dialog-Dialog-G8cDF[data-position-narrow=fullscreen]{border-radius:unset!important;flex-grow:1;height:100%;max-height:100dvh;max-width:100dvw;width:100%}.prc-Dialog-Dialog-G8cDF[data-position-narrow=fullscreen][data-align]{margin-bottom:0;margin-top:0}@media screen and (prefers-reduced-motion:no-preference){.prc-Dialog-Dialog-G8cDF[data-position-narrow=fullscreen]{animation:prc-Dialog-Overlay--motion-scaleFade-mE6-C .2s cubic-bezier(.33,1,.68,1) 1ms 1 normal none running}}}body[data-dialog-scroll-disabled]{overflow:hidden!important;padding-right:var(--prc-dialog-scrollgutter)!important}.prc-Dialog-DialogOverflowWrapper-JvHzz{flex-grow:1}.prc-Dialog-Dialog-G8cDF[data-has-footer]{--can-scroll:0}.prc-Dialog-Dialog-G8cDF[data-has-footer] .prc-Dialog-DialogOverflowWrapper-JvHzz{animation:prc-Dialog-detect-scroll-b3i8Q;border-bottom:var(--borderWidth-default,.0625rem) solid var(--borderColor-default,#d1d9e0);animation-timeline:scroll(self)}@supports (animation-timeline:scroll(self)){.prc-Dialog-Dialog-G8cDF[data-has-footer] .prc-Dialog-DialogOverflowWrapper-JvHzz{border-bottom:calc(var(--borderWidth-thin,.0625rem)*var(--can-scroll)) solid var(--borderColor-default,#d1d9e0)}}.prc-Dialog-Header-f7Me-{box-shadow:0 1px 0 var(--borderColor-default,#d1d9e0);flex-shrink:0;max-height:35vh;overflow-y:auto;padding:var(--base-size-8,.5rem);z-index:1}.prc-Dialog-HeaderInner-H-fFY{display:flex}.prc-Dialog-HeaderContent-mjAsn{display:flex;flex-direction:column;flex-grow:1;padding-block:var(--base-size-6,.375rem);padding-inline:var(--base-size-8,.5rem)}.prc-Dialog-Title-M-iPn{font-size:var(--text-body-size-medium,.875rem);font-weight:var(--text-title-weight-large,600);margin:0}.prc-Dialog-Subtitle-aBFSq{color:var(--fgColor-muted,#59636e);font-size:var(--text-body-size-small,.75rem);font-weight:var(--base-text-weight-normal,400);margin:0;margin-top:var(--base-size-4,.25rem)}.prc-Dialog-Body-bB903{flex-grow:1;overflow:auto}.prc-Dialog-Body-bB903,.prc-Dialog-Footer-PMeQk{padding:var(--base-size-16,1rem)}.prc-Dialog-Footer-PMeQk{display:flex;flex-flow:wrap;flex-shrink:0;gap:var(--base-size-8,.5rem);justify-content:flex-end;z-index:1}.prc-Dialog-Dialog-G8cDF[data-footer-button-layout=scroll] .prc-Dialog-Footer-PMeQk{flex-direction:row;flex-wrap:nowrap;justify-content:unset;overflow-x:scroll}
|
|
2
|
+
/*# sourceMappingURL=Dialog-b7da369a.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/Dialog/Dialog.module.css.js"],"names":[],"mappings":"AAOA,oCACE,eAAgB,CAChB,cAAe,CACf,iBACF,CAEA,mDACE,GACE,SACF,CAEA,GACE,SACF,CACF,CAEA,sDACE,GACE,SAAU,CACV,mBACF,CAEA,GACE,SAAU,CACV,kBACF,CACF,CAEA,oDACE,GACE,0BACF,CACF,CAEA,yDACE,GACE,2BACF,CACF,CAEA,wDACE,GACE,0BACF,CACF,CAGA,0CACE,MAEE,cACF,CACF,CAEA,2BAQE,+EAAsE,CADtE,0DAAiD,CAHjD,QAAS,CAET,YAAa,CADb,MAAO,CAJP,cAAe,CAEf,OAAQ,CADR,KAkEF,CAxDE,oFAHA,kBAAmB,CACnB,sBAKA,CAEA,uDACE,kBAAmB,CACnB,0BACF,CAEA,wDACE,kBAAmB,CACnB,wBACF,CAME,wHACE,sBACF,CAEA,2HACE,kBACF,CAEA,2HACE,oBACF,CAGF,yBACE,wDACE,kBAAmB,CACnB,sBAcF,CAXE,wEACE,sBACF,CAEA,2EACE,kBACF,CAEA,2EACE,oBACF,CAGF,wDACE,eAAgB,CAChB,sBACF,CACF,CAGF,yBASE,4CAAwC,CACxC,8CAAwC,CACxC,wEAAmE,CACnE,4GAAwC,CAXxC,YAAa,CAOb,qBAAsB,CAFtB,WAAY,CACZ,8BAA+B,CAF/B,6BAA8B,CAD9B,eAAgB,CAShB,SAAU,CAVV,+BAuJF,CA3IE,mDACE,WACF,CAEA,oDACE,WACF,CAEA,mDAEE,WACF,CAEA,oDACE,YACF,CAEA,oDACE,YACF,CAEA,yDApCF,yBAqCI,4GAqHJ,CApHE,CAEA,uDACE,wEAcF,CAZE,yDAHF,uDAII,4GAWJ,CAVE,CAGA,uEACE,mCACF,CAEA,0EACE,sCACF,CAGF,qDAGE,wEAAmE,CAEnE,2BAA4B,CAD5B,wBAAyB,CAHzB,aAAc,CACd,gBAQF,CAHE,yDAPF,qDAQI,gHAEJ,CADE,CAGF,sDAGE,wEAAmE,CAEnE,4BAA6B,CAD7B,yBAA0B,CAH1B,aAAc,CACd,gBAQF,CAHE,yDAPF,sDAQI,8GAEJ,CADE,CAGF,yBACE,sDAIE,wEAAmE,CADnE,WAAY,CADZ,+BAwBF,CApBE,gFACE,WACF,CAEA,iFACE,WACF,CAEA,gFAEE,WACF,CAEA,iFACE,YACF,CAEA,iFACE,YACF,CAGF,0BA9GJ,yBA+GM,8BAA+B,CAC/B,6BA0CN,CAzCI,CAEA,sDAKE,wEAAmE,CAEnE,2BAA4B,CAD5B,4BAA6B,CAH7B,WAAY,CACZ,8BAA+B,CAF/B,gBAAiB,CADjB,YAiBF,CARE,kEAEE,eAAgB,CADhB,YAEF,CAEA,yDAfF,sDAgBI,2GAEJ,CADE,CAGF,0DAKE,6BAA+B,CAC/B,WAAY,CAHZ,WAAY,CACZ,iBAAkB,CAFlB,gBAAiB,CADjB,UAgBF,CARE,sEAEE,eAAgB,CADhB,YAEF,CAEA,yDAdF,0DAeI,4GAEJ,CADE,CAEJ,CAOF,kCAGE,yBAA2B,CAD3B,sDAEF,CAEA,wCACE,WACF,CAQA,0CACE,cAYF,CAVE,kFAGE,wCAAwB,CADxB,0FAA0E,CAE1E,+BAKF,CAHE,4CANF,kFAOI,+GAEJ,CADE,CAIJ,yBAME,qDAA8C,CAC9C,aAAc,CALd,eAAgB,CAEhB,eAAgB,CADhB,gCAA2B,CAF3B,SAOF,CAEA,8BACE,YACF,CAEA,gCACE,YAAa,CAGb,qBAAsB,CACtB,WAAY,CAFZ,wCAAiC,CADjC,uCAIF,CAEA,wBAEE,8CAAuC,CACvC,8CAA2C,CAF3C,QAGF,CAEA,2BAKE,kCAA2B,CAF3B,4CAAsC,CACtC,8CAA2C,CAH3C,QAAS,CACT,oCAIF,CAEA,uBAGE,WAAY,CADZ,aAEF,CAEA,gDALE,gCAaF,CARA,yBAEE,YAAa,CACb,cAAe,CAIf,aAAc,CADd,4BAAuB,CAFvB,wBAAyB,CAHzB,SAOF,CAEA,oFAGE,kBAAmB,CAFnB,gBAAiB,CAGjB,qBAAsB,CAFtB,iBAGF","file":"Dialog-b7da369a.css","sourcesContent":["/* The --prc-dialog-scrollgutter property is used only on the body element to\n * simulate scrollbar-gutter:stable. This property is not and should not\n * be used elsewhere in the DOM. There is a performance penalty to\n * setting inherited properties which can cause a large style recalc to\n * occur, so it benefits us to prevent inheritance for this property.\n * See https://web.dev/blog/at-property-performance\n */\n@property --prc-dialog-scrollgutter {\n initial-value: 0;\n inherits: false;\n syntax: '<length>';\n}\n\n@keyframes dialog-backdrop-appear {\n 0% {\n opacity: 0;\n }\n\n 100% {\n opacity: 1;\n }\n}\n\n@keyframes Overlay--motion-scaleFade {\n 0% {\n opacity: 0;\n transform: scale(0.5);\n }\n\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n@keyframes Overlay--motion-slideUp {\n from {\n transform: translateY(100%);\n }\n}\n\n@keyframes Overlay--motion-slideInRight {\n from {\n transform: translateX(-100%);\n }\n}\n\n@keyframes Overlay--motion-slideInLeft {\n from {\n transform: translateX(100%);\n }\n}\n\n/* Used to determine whether there should be a border between the body and footer */\n@keyframes detect-scroll {\n from,\n to {\n --can-scroll: 1;\n }\n}\n\n.Backdrop {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n display: flex;\n background-color: var(--overlay-backdrop-bgColor);\n animation: dialog-backdrop-appear 200ms cubic-bezier(0.33, 1, 0.68, 1);\n align-items: center;\n justify-content: center;\n\n &[data-position-regular='center'] {\n align-items: center;\n justify-content: center;\n }\n\n &[data-position-regular='left'] {\n align-items: center;\n justify-content: flex-start;\n }\n\n &[data-position-regular='right'] {\n align-items: center;\n justify-content: flex-end;\n }\n\n /* align only applies when regular position is center (or absent).\n * :where() zeroes out the :not() specificity so narrow-position rules (coming later)\n * always win when data-position-narrow is bottom or fullscreen. */\n &:where(:not([data-position-regular='left']):not([data-position-regular='right'])) {\n &[data-align='top'] {\n align-items: flex-start;\n }\n\n &[data-align='center'] {\n align-items: center;\n }\n\n &[data-align='bottom'] {\n align-items: flex-end;\n }\n }\n\n @media (max-width: 767px) {\n &[data-position-narrow='center'] {\n align-items: center;\n justify-content: center;\n\n /* align still applies when narrow position is center */\n &[data-align='top'] {\n align-items: flex-start;\n }\n\n &[data-align='center'] {\n align-items: center;\n }\n\n &[data-align='bottom'] {\n align-items: flex-end;\n }\n }\n\n &[data-position-narrow='bottom'] {\n align-items: end;\n justify-content: center;\n }\n }\n}\n\n.Dialog {\n display: flex;\n /* stylelint-disable-next-line primer/responsive-widths */\n width: var(--dialog-width, 640px);\n min-width: 296px;\n max-width: calc(100dvw - 64px);\n height: auto;\n max-height: calc(100dvh - 64px);\n flex-direction: column;\n background-color: var(--overlay-bgColor);\n border-radius: var(--borderRadius-large);\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n box-shadow: var(--shadow-floating-small);\n opacity: 1;\n\n &:where([data-width='small']) {\n width: 296px;\n }\n\n &:where([data-width='medium']) {\n width: 320px;\n }\n\n &:where([data-width='large']) {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 480px;\n }\n\n &:where([data-height='small']) {\n height: 480px;\n }\n\n &:where([data-height='large']) {\n height: 640px;\n }\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-scaleFade 0.2s cubic-bezier(0.33, 1, 0.68, 1) 1ms 1 normal none running;\n }\n\n &[data-position-regular='center'] {\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-scaleFade 0.2s cubic-bezier(0.33, 1, 0.68, 1) 1ms 1 normal none running;\n }\n\n /* align margins only apply when regular position is center */\n &[data-align='top'] {\n margin-top: var(--base-size-64);\n }\n\n &[data-align='bottom'] {\n margin-bottom: var(--base-size-64);\n }\n }\n\n &[data-position-regular='left'] {\n height: 100dvh;\n max-height: unset;\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-slideInRight 0.25s cubic-bezier(0.33, 1, 0.68, 1) 1ms 1 normal none running;\n }\n }\n\n &[data-position-regular='right'] {\n height: 100dvh;\n max-height: unset;\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-slideInLeft 0.25s cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running;\n }\n }\n\n @media (max-width: 767px) {\n &[data-position-narrow='center'] {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: var(--dialog-width, 640px);\n height: auto;\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n\n &:where([data-width='small']) {\n width: 296px;\n }\n\n &:where([data-width='medium']) {\n width: 320px;\n }\n\n &:where([data-width='large']) {\n /* stylelint-disable-next-line primer/responsive-widths */\n width: 480px;\n }\n\n &:where([data-height='small']) {\n height: 480px;\n }\n\n &:where([data-height='large']) {\n height: 640px;\n }\n }\n\n @media (max-height: 280px) {\n max-height: calc(100dvh - 12px);\n max-width: calc(100dvw - 12px);\n }\n\n &[data-position-narrow='bottom'] {\n width: 100dvw;\n max-width: 100dvw;\n height: auto;\n max-height: calc(100dvh - 64px);\n border-radius: var(--borderRadius-large, var(--borderRadius-large));\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n\n /* reset align margins since position wins at narrow */\n &[data-align] {\n margin-top: 0;\n margin-bottom: 0;\n }\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-slideUp 0.25s cubic-bezier(0.33, 1, 0.68, 1) 1ms 1 normal none running;\n }\n }\n\n &[data-position-narrow='fullscreen'] {\n width: 100%;\n max-width: 100dvw;\n height: 100%;\n max-height: 100dvh;\n border-radius: unset !important;\n flex-grow: 1;\n\n /* reset align margins since fullscreen wins at narrow */\n &[data-align] {\n margin-top: 0;\n margin-bottom: 0;\n }\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: Overlay--motion-scaleFade 0.2s cubic-bezier(0.33, 1, 0.68, 1) 1ms 1 normal none running;\n }\n }\n }\n}\n\n/*\n * PERFORMANCE OPTIMIZATION: Direct attribute on body - O(1) lookup\n */\n/* stylelint-disable-next-line selector-no-qualifying-type */\nbody[data-dialog-scroll-disabled] {\n /* stylelint-disable-next-line primer/spacing */\n padding-right: var(--prc-dialog-scrollgutter) !important;\n overflow: hidden !important;\n}\n\n.DialogOverflowWrapper {\n flex-grow: 1;\n}\n\n/*\nAdd a border between the body and footer if:\n- the dialog has a footer\n- the dialog has a body that can scroll\n- the browser supports the `animation-timeline` property and its `scroll()` function\n*/\n.Dialog[data-has-footer] {\n --can-scroll: 0;\n\n .DialogOverflowWrapper {\n /* If the browser does not support the `animation-timeline` property, always show a border */\n border-bottom: var(--borderWidth-default) solid var(--borderColor-default);\n animation: detect-scroll;\n animation-timeline: scroll(self);\n\n @supports (animation-timeline: scroll(self)) {\n border-bottom: calc(var(--borderWidth-thin) * var(--can-scroll)) solid var(--borderColor-default);\n }\n }\n}\n\n.Header {\n z-index: 1;\n max-height: 35vh;\n padding: var(--base-size-8);\n overflow-y: auto;\n /* stylelint-disable-next-line primer/box-shadow */\n box-shadow: 0 1px 0 var(--borderColor-default);\n flex-shrink: 0;\n}\n\n.HeaderInner {\n display: flex;\n}\n\n.HeaderContent {\n display: flex;\n padding-inline: var(--base-size-8);\n padding-block: var(--base-size-6);\n flex-direction: column;\n flex-grow: 1;\n}\n\n.Title {\n margin: 0; /* override default margin */\n font-size: var(--text-body-size-medium);\n font-weight: var(--text-title-weight-large);\n}\n\n.Subtitle {\n margin: 0; /* override default margin */\n margin-top: var(--base-size-4);\n font-size: var(--text-body-size-small);\n font-weight: var(--base-text-weight-normal);\n color: var(--fgColor-muted);\n}\n\n.Body {\n padding: var(--base-size-16);\n overflow: auto;\n flex-grow: 1;\n}\n\n.Footer {\n z-index: 1;\n display: flex;\n flex-flow: wrap;\n justify-content: flex-end;\n padding: var(--base-size-16);\n gap: var(--base-size-8);\n flex-shrink: 0;\n}\n\n.Dialog[data-footer-button-layout='scroll'] .Footer {\n flex-wrap: nowrap;\n overflow-x: scroll;\n flex-direction: row;\n justify-content: unset;\n}\n"]}
|
package/dist/Dialog/Dialog.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from 'react';
|
|
1
|
+
import React, { type CSSProperties } from 'react';
|
|
2
2
|
import type { ButtonProps } from '../Button';
|
|
3
3
|
import type { ResponsiveValue } from '../hooks/useResponsiveValue';
|
|
4
4
|
import type { ForwardRefComponent as PolymorphicForwardRefComponent } from '../utils/polymorphic';
|
|
@@ -30,6 +30,7 @@ export type DialogButtonProps = Omit<ButtonProps, 'content'> & {
|
|
|
30
30
|
* Props to customize the rendering of the Dialog.
|
|
31
31
|
*/
|
|
32
32
|
export interface DialogProps {
|
|
33
|
+
'data-component'?: string;
|
|
33
34
|
/**
|
|
34
35
|
* Title of the Dialog. Also serves as the aria-label for this Dialog.
|
|
35
36
|
*/
|
|
@@ -87,6 +88,8 @@ export interface DialogProps {
|
|
|
87
88
|
* medium: 320px
|
|
88
89
|
* large: 480px
|
|
89
90
|
* xlarge: 640px
|
|
91
|
+
*
|
|
92
|
+
* Also accepts any valid CSS width value (e.g. '400px', '80rem').
|
|
90
93
|
*/
|
|
91
94
|
width?: DialogWidth;
|
|
92
95
|
/**
|
|
@@ -151,7 +154,7 @@ declare const widthMap: {
|
|
|
151
154
|
readonly large: "480px";
|
|
152
155
|
readonly xlarge: "640px";
|
|
153
156
|
};
|
|
154
|
-
export type DialogWidth = keyof typeof widthMap
|
|
157
|
+
export type DialogWidth = keyof typeof widthMap | Exclude<CSSProperties['width'], undefined>;
|
|
155
158
|
export type DialogHeight = keyof typeof heightMap;
|
|
156
159
|
export declare const DialogContext: React.Context<object | undefined>;
|
|
157
160
|
export declare const Dialog: React.ForwardRefExoticComponent<DialogProps & {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/Dialog/Dialog.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../src/Dialog/Dialog.tsx"],"names":[],"mappings":"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"}
|