@primer/react 0.0.0-20260511210424 → 0.0.0-20260511213809
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 +2 -2
- package/dist/Blankslate/Blankslate.d.ts.map +1 -1
- package/dist/Blankslate/Blankslate.js +0 -6
- package/dist/BranchName/BranchName.js +0 -1
- package/dist/Breadcrumbs/Breadcrumbs.d.ts.map +1 -1
- package/dist/Breadcrumbs/Breadcrumbs.js +0 -4
- package/dist/ButtonGroup/ButtonGroup.d.ts.map +1 -1
- package/dist/ButtonGroup/ButtonGroup.js +0 -1
- package/dist/Checkbox/Checkbox.d.ts +0 -1
- package/dist/Checkbox/Checkbox.d.ts.map +1 -1
- package/dist/Checkbox/Checkbox.js +5 -10
- package/dist/CheckboxGroup/CheckboxGroup.js +0 -1
- package/dist/CircleBadge/CircleBadge.d.ts.map +1 -1
- package/dist/CircleBadge/CircleBadge.js +28 -44
- package/dist/ConfirmationDialog/ConfirmationDialog.d.ts.map +1 -1
- package/dist/ConfirmationDialog/ConfirmationDialog.js +0 -1
- package/dist/CounterLabel/CounterLabel.d.ts +0 -2
- package/dist/CounterLabel/CounterLabel.d.ts.map +1 -1
- package/dist/CounterLabel/CounterLabel.js +90 -25
- package/dist/Dialog/Dialog-b7da369a.css +2 -0
- package/dist/Dialog/Dialog-b7da369a.css.map +1 -0
- package/dist/Dialog/Dialog.d.ts +4 -3
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +21 -18
- package/dist/Dialog/Dialog.module.css.js +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.d.ts +0 -2
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.js +1 -4
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.js +1 -3
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.d.ts +0 -1
- 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 +1 -3
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.d.ts.map +1 -1
- package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.js +1 -3
- package/dist/internal/components/InputValidation.d.ts +1 -1
- package/dist/internal/components/InputValidation.d.ts.map +1 -1
- package/dist/internal/components/InputValidation.js +33 -58
- package/generated/components.json +2 -2
- package/package.json +1 -1
- package/dist/Dialog/Dialog-f9bb927a.css +0 -2
- package/dist/Dialog/Dialog-f9bb927a.css.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# @primer/react
|
|
2
2
|
|
|
3
|
-
## 0.0.0-
|
|
3
|
+
## 0.0.0-20260511213809
|
|
4
4
|
|
|
5
5
|
### Minor Changes
|
|
6
6
|
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
- Export `ActionListContainerContext` as `ActionList.ContainerContext`.
|
|
10
10
|
- Export `useRovingTabIndex` from the public API with additional configuration options (`preventScroll` and `dependencies`).
|
|
11
11
|
|
|
12
|
-
- [#
|
|
12
|
+
- [#7831](https://github.com/primer/react/pull/7831) [`c0111d7`](https://github.com/primer/react/commit/c0111d7a2f296434cf6ec671defd4f76bf772a8b) Thanks [@liuliu-dev](https://github.com/liuliu-dev)! - Dialog: Support custom width values.
|
|
13
13
|
|
|
14
14
|
### Patch Changes
|
|
15
15
|
|
|
@@ -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,qBAsB7G;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,qBAM5F;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,qBAM9E;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,7 +70,6 @@ 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",
|
|
74
73
|
"data-border": t4,
|
|
75
74
|
"data-narrow": t5,
|
|
76
75
|
"data-spacious": t6,
|
|
@@ -147,7 +146,6 @@ function Visual(t0) {
|
|
|
147
146
|
t2 = /*#__PURE__*/jsx("span", {
|
|
148
147
|
...rest,
|
|
149
148
|
className: t1,
|
|
150
|
-
"data-component": "Blankslate.Visual",
|
|
151
149
|
children: children
|
|
152
150
|
});
|
|
153
151
|
$[6] = children;
|
|
@@ -197,7 +195,6 @@ function Heading(t0) {
|
|
|
197
195
|
t3 = /*#__PURE__*/jsx(Component, {
|
|
198
196
|
...rest,
|
|
199
197
|
className: t2,
|
|
200
|
-
"data-component": "Blankslate.Heading",
|
|
201
198
|
children: children
|
|
202
199
|
});
|
|
203
200
|
$[7] = Component;
|
|
@@ -243,7 +240,6 @@ function Description(t0) {
|
|
|
243
240
|
t2 = /*#__PURE__*/jsx("p", {
|
|
244
241
|
...rest,
|
|
245
242
|
className: t1,
|
|
246
|
-
"data-component": "Blankslate.Description",
|
|
247
243
|
children: children
|
|
248
244
|
});
|
|
249
245
|
$[6] = children;
|
|
@@ -291,7 +287,6 @@ function PrimaryAction(t0) {
|
|
|
291
287
|
if ($[5] !== children || $[6] !== href || $[7] !== props || $[8] !== t2 || $[9] !== t3) {
|
|
292
288
|
t4 = /*#__PURE__*/jsx("div", {
|
|
293
289
|
className: t1,
|
|
294
|
-
"data-component": "Blankslate.PrimaryAction",
|
|
295
290
|
children: /*#__PURE__*/jsx(ButtonComponent, {
|
|
296
291
|
...props,
|
|
297
292
|
as: t2,
|
|
@@ -329,7 +324,6 @@ function SecondaryAction(t0) {
|
|
|
329
324
|
if ($[1] !== children || $[2] !== href) {
|
|
330
325
|
t2 = /*#__PURE__*/jsx("div", {
|
|
331
326
|
className: t1,
|
|
332
|
-
"data-component": "Blankslate.SecondaryAction",
|
|
333
327
|
children: /*#__PURE__*/jsx(Link, {
|
|
334
328
|
href: href,
|
|
335
329
|
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,qBAmMzG;kBAnMQ,WAAW;;;AA+MpB,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;AAsBD,MAAM,MAAM,oBAAoB,CAAC,EAAE,SAAS,KAAK,CAAC,WAAW,GAAG,GAAG,IAAI,0BAA0B,CAAC,EAAE,CAAC,CAAA;;YAnBlG,EAAE,SAAS,KAAK,CAAC,WAAW;aANtB,EAAE;mBACI,OAAO;;aADb,EAAE;mBACI,OAAO;;;;;;;AA2BtB,wBAAiF;AAEjF;;GAEG;AACH,eAAO,MAAM,UAAU;WA3BpB,EAAE,SAAS,KAAK,CAAC,WAAW;aANtB,EAAE;mBACI,OAAO;;aADb,EAAE;mBACI,OAAO;;;;CAgCuD,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,7 +189,6 @@ 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",
|
|
193
192
|
children: [t10, t12]
|
|
194
193
|
});
|
|
195
194
|
$[21] = detailsRefCallback;
|
|
@@ -324,7 +323,6 @@ function Breadcrumbs({
|
|
|
324
323
|
if (overflow === 'wrap' || menuItems.length === 0) {
|
|
325
324
|
return React.Children.map(children, child_0 => /*#__PURE__*/jsx("li", {
|
|
326
325
|
className: classes.ItemWrapper,
|
|
327
|
-
"data-component": "Breadcrumbs.ItemWrapper",
|
|
328
326
|
children: child_0
|
|
329
327
|
}));
|
|
330
328
|
}
|
|
@@ -364,7 +362,6 @@ function Breadcrumbs({
|
|
|
364
362
|
ref: containerRef,
|
|
365
363
|
"data-overflow": overflow,
|
|
366
364
|
"data-variant": variant,
|
|
367
|
-
"data-component": "Breadcrumbs",
|
|
368
365
|
children: /*#__PURE__*/jsx(BreadcrumbsList, {
|
|
369
366
|
children: finalChildren
|
|
370
367
|
})
|
|
@@ -406,7 +403,6 @@ const BreadcrumbsItem = fixedForwardRef((props, ref) => {
|
|
|
406
403
|
className: clsx(className, classes.Item, selected && 'selected'),
|
|
407
404
|
"aria-current": selected ? 'page' : undefined,
|
|
408
405
|
ref: ref,
|
|
409
|
-
"data-component": "Breadcrumbs.Item",
|
|
410
406
|
...rest
|
|
411
407
|
});
|
|
412
408
|
});
|
|
@@ -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,EAoBX,8BAA8B,CAAC,KAAK,EAAE,gBAAgB,CAAC,CAAA;AAI7D,eAAe,WAAW,CAAA"}
|
|
@@ -27,7 +27,6 @@ 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;
|
|
31
30
|
} & Exclude<InputHTMLAttributes<HTMLInputElement>, 'value'>;
|
|
32
31
|
/**
|
|
33
32
|
* 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;CACf,GAAG,OAAO,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAC,CAAA;AAE3D;;GAEG;AACH,QAAA,MAAM,QAAQ,qGAqDb,CAAA;wBAK0B,cAAc,CAAC,OAAO,QAAQ,CAAC;AAA1D,wBAA0D"}
|
|
@@ -20,7 +20,6 @@ const Checkbox = /*#__PURE__*/React.forwardRef(({
|
|
|
20
20
|
required,
|
|
21
21
|
validationStatus,
|
|
22
22
|
value,
|
|
23
|
-
['data-component']: dataComponent,
|
|
24
23
|
...rest
|
|
25
24
|
}, ref
|
|
26
25
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
@@ -67,15 +66,11 @@ const Checkbox = /*#__PURE__*/React.forwardRef(({
|
|
|
67
66
|
checkbox.setAttribute('aria-checked', checkbox.checked ? 'true' : 'false');
|
|
68
67
|
}
|
|
69
68
|
});
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
"data-component": dataComponent !== null && dataComponent !== void 0 ? dataComponent : 'Checkbox',
|
|
76
|
-
className: clsx(className, sharedClasses.Input, classes.Checkbox)
|
|
77
|
-
})
|
|
78
|
-
);
|
|
69
|
+
// @ts-expect-error inputProp needs a non nullable ref
|
|
70
|
+
return /*#__PURE__*/jsx("input", {
|
|
71
|
+
...inputProps,
|
|
72
|
+
className: clsx(className, sharedClasses.Input, classes.Checkbox)
|
|
73
|
+
});
|
|
79
74
|
});
|
|
80
75
|
Checkbox.displayName = 'Checkbox';
|
|
81
76
|
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;AAmBxE,QAAA,MAAM,eAAe;YAAW,YAAY;;CAA8D,CAAA;AAI1G,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,OAAO,eAAe,CAAC,CAAA;AAEzE;;;GAGG;0BAlBkB,EAAE,SAAS,KAAK,CAAC,WAAW,+BAAqC,gBAAgB,CAAC,EAAE,CAAC;;gBAS1E,YAAY;;;;AAU5C,wBAAkE"}
|
|
@@ -21,85 +21,69 @@ const sizeStyles = ({
|
|
|
21
21
|
};
|
|
22
22
|
};
|
|
23
23
|
const CircleBadge = t0 => {
|
|
24
|
-
const $ = c(
|
|
24
|
+
const $ = c(12);
|
|
25
25
|
let T0;
|
|
26
26
|
let t1;
|
|
27
27
|
let t2;
|
|
28
28
|
let t3;
|
|
29
29
|
let t4;
|
|
30
|
-
let t5;
|
|
31
30
|
if ($[0] !== t0) {
|
|
32
31
|
const {
|
|
33
|
-
as:
|
|
32
|
+
as: t5,
|
|
34
33
|
...props
|
|
35
34
|
} = t0;
|
|
36
|
-
const Component =
|
|
35
|
+
const Component = t5 === undefined ? "div" : t5;
|
|
37
36
|
T0 = Component;
|
|
38
37
|
t1 = props;
|
|
39
|
-
t2 =
|
|
40
|
-
t3 =
|
|
41
|
-
t4 = props
|
|
42
|
-
t5 = sizeStyles(props);
|
|
38
|
+
t2 = clsx(styles.CircleBadge, props.className);
|
|
39
|
+
t3 = props.inline ? "" : undefined;
|
|
40
|
+
t4 = sizeStyles(props);
|
|
43
41
|
$[0] = t0;
|
|
44
42
|
$[1] = T0;
|
|
45
43
|
$[2] = t1;
|
|
46
44
|
$[3] = t2;
|
|
47
45
|
$[4] = t3;
|
|
48
46
|
$[5] = t4;
|
|
49
|
-
$[6] = t5;
|
|
50
47
|
} else {
|
|
51
48
|
T0 = $[1];
|
|
52
49
|
t1 = $[2];
|
|
53
50
|
t2 = $[3];
|
|
54
51
|
t3 = $[4];
|
|
55
52
|
t4 = $[5];
|
|
56
|
-
t5 = $[6];
|
|
57
53
|
}
|
|
58
|
-
let
|
|
59
|
-
if ($[
|
|
60
|
-
|
|
54
|
+
let t5;
|
|
55
|
+
if ($[6] !== T0 || $[7] !== t1 || $[8] !== t2 || $[9] !== t3 || $[10] !== t4) {
|
|
56
|
+
t5 = /*#__PURE__*/jsx(T0, {
|
|
61
57
|
...t1,
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
style: t5
|
|
58
|
+
className: t2,
|
|
59
|
+
"data-inline": t3,
|
|
60
|
+
style: t4
|
|
66
61
|
});
|
|
67
|
-
$[
|
|
68
|
-
$[
|
|
69
|
-
$[
|
|
70
|
-
$[
|
|
71
|
-
$[
|
|
72
|
-
$[
|
|
73
|
-
$[13] = t6;
|
|
62
|
+
$[6] = T0;
|
|
63
|
+
$[7] = t1;
|
|
64
|
+
$[8] = t2;
|
|
65
|
+
$[9] = t3;
|
|
66
|
+
$[10] = t4;
|
|
67
|
+
$[11] = t5;
|
|
74
68
|
} else {
|
|
75
|
-
|
|
69
|
+
t5 = $[11];
|
|
76
70
|
}
|
|
77
|
-
return
|
|
71
|
+
return t5;
|
|
78
72
|
};
|
|
79
73
|
const CircleBadgeIcon = props => {
|
|
80
|
-
const $ = c(
|
|
74
|
+
const $ = c(2);
|
|
81
75
|
let t0;
|
|
82
|
-
if ($[0] !== props
|
|
83
|
-
t0 =
|
|
84
|
-
|
|
76
|
+
if ($[0] !== props) {
|
|
77
|
+
t0 = /*#__PURE__*/jsx(Octicon, {
|
|
78
|
+
className: styles.CircleBadgeIcon,
|
|
79
|
+
...props
|
|
80
|
+
});
|
|
81
|
+
$[0] = props;
|
|
85
82
|
$[1] = t0;
|
|
86
83
|
} else {
|
|
87
84
|
t0 = $[1];
|
|
88
85
|
}
|
|
89
|
-
|
|
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;
|
|
86
|
+
return t0;
|
|
103
87
|
};
|
|
104
88
|
CircleBadgeIcon.displayName = 'CircleBadge.Icon';
|
|
105
89
|
/**
|
|
@@ -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,CAoDzF,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,14 +5,12 @@ 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;
|
|
9
8
|
}>;
|
|
10
9
|
declare const CounterLabel: React.ForwardRefExoticComponent<HTMLAttributes<HTMLSpanElement> & {
|
|
11
10
|
/** @deprecated use variant instead */
|
|
12
11
|
scheme?: "primary" | "secondary";
|
|
13
12
|
variant?: "primary" | "secondary";
|
|
14
13
|
className?: string;
|
|
15
|
-
'data-component'?: string;
|
|
16
14
|
} & {
|
|
17
15
|
children?: React.ReactNode | undefined;
|
|
18
16
|
} & 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;CACnB,CACF,CAAA;AAED,QAAA,MAAM,YAAY;IAPd,sCAAsC;aAC7B,SAAS,GAAG,WAAW;cACtB,SAAS,GAAG,WAAW;gBACrB,MAAM;;;yCA0BrB,CAAA;AAID,eAAe,YAAY,CAAA"}
|
|
@@ -1,35 +1,100 @@
|
|
|
1
|
+
import { c } from 'react-compiler-runtime';
|
|
1
2
|
import { clsx } from 'clsx';
|
|
2
3
|
import { forwardRef } from 'react';
|
|
3
4
|
import classes from './CounterLabel.module.css.js';
|
|
4
|
-
import { jsxs, Fragment
|
|
5
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
5
6
|
import { VisuallyHidden } from '../VisuallyHidden/VisuallyHidden.js';
|
|
6
7
|
|
|
7
|
-
const CounterLabel = /*#__PURE__*/forwardRef(({
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
className
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
[
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
8
|
+
const CounterLabel = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
|
|
9
|
+
const $ = c(21);
|
|
10
|
+
let children;
|
|
11
|
+
let className;
|
|
12
|
+
let rest;
|
|
13
|
+
let scheme;
|
|
14
|
+
let variant;
|
|
15
|
+
if ($[0] !== t0) {
|
|
16
|
+
({
|
|
17
|
+
variant,
|
|
18
|
+
scheme,
|
|
19
|
+
className,
|
|
20
|
+
children,
|
|
21
|
+
...rest
|
|
22
|
+
} = t0);
|
|
23
|
+
$[0] = t0;
|
|
24
|
+
$[1] = children;
|
|
25
|
+
$[2] = className;
|
|
26
|
+
$[3] = rest;
|
|
27
|
+
$[4] = scheme;
|
|
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", {
|
|
27
75
|
...counterProps,
|
|
28
|
-
|
|
29
|
-
className: clsx(className, classes.CounterLabel),
|
|
76
|
+
className: t3,
|
|
30
77
|
children: children
|
|
31
|
-
})
|
|
32
|
-
|
|
78
|
+
});
|
|
79
|
+
$[14] = children;
|
|
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;
|
|
33
98
|
});
|
|
34
99
|
CounterLabel.displayName = 'CounterLabel';
|
|
35
100
|
|
|
@@ -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":"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","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,7 +30,6 @@ 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;
|
|
34
33
|
/**
|
|
35
34
|
* Title of the Dialog. Also serves as the aria-label for this Dialog.
|
|
36
35
|
*/
|
|
@@ -88,6 +87,8 @@ export interface DialogProps {
|
|
|
88
87
|
* medium: 320px
|
|
89
88
|
* large: 480px
|
|
90
89
|
* xlarge: 640px
|
|
90
|
+
*
|
|
91
|
+
* Also accepts any valid CSS width value (e.g. '400px', '80rem').
|
|
91
92
|
*/
|
|
92
93
|
width?: DialogWidth;
|
|
93
94
|
/**
|
|
@@ -152,7 +153,7 @@ declare const widthMap: {
|
|
|
152
153
|
readonly large: "480px";
|
|
153
154
|
readonly xlarge: "640px";
|
|
154
155
|
};
|
|
155
|
-
export type DialogWidth = keyof typeof widthMap
|
|
156
|
+
export type DialogWidth = keyof typeof widthMap | Exclude<CSSProperties['width'], undefined>;
|
|
156
157
|
export type DialogHeight = keyof typeof heightMap;
|
|
157
158
|
export declare const DialogContext: React.Context<object | undefined>;
|
|
158
159
|
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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"}
|
package/dist/Dialog/Dialog.js
CHANGED
|
@@ -18,6 +18,14 @@ import { ScrollableRegion } from '../ScrollableRegion/ScrollableRegion.js';
|
|
|
18
18
|
import { useProvidedRefOrCreate } from '../hooks/useProvidedRefOrCreate.js';
|
|
19
19
|
|
|
20
20
|
let dialogScrollDisabledCount = 0;
|
|
21
|
+
const widthMap = {
|
|
22
|
+
small: '296px',
|
|
23
|
+
medium: '320px',
|
|
24
|
+
large: '480px',
|
|
25
|
+
xlarge: '640px'
|
|
26
|
+
};
|
|
27
|
+
const isWidthMapKey = width => typeof width === 'string' && Object.hasOwn(widthMap, width);
|
|
28
|
+
const normalizeWidth = width => typeof width === 'number' ? `${width}px` : width;
|
|
21
29
|
const DefaultHeader = ({
|
|
22
30
|
dialogLabelId,
|
|
23
31
|
title,
|
|
@@ -85,7 +93,6 @@ const DIALOG_CONTEXT_VALUE = Object.freeze({});
|
|
|
85
93
|
const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
|
|
86
94
|
var _slots$header, _slots$body, _slots$footer;
|
|
87
95
|
const {
|
|
88
|
-
'data-component': dataComponentProp,
|
|
89
96
|
title = 'Dialog',
|
|
90
97
|
subtitle = '',
|
|
91
98
|
renderHeader,
|
|
@@ -193,7 +200,6 @@ const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
|
|
|
193
200
|
} : Object.fromEntries(Object.entries(position).map(([key, value]) => {
|
|
194
201
|
return [`data-position-${key}`, value];
|
|
195
202
|
}));
|
|
196
|
-
const dataComponent = dataComponentProp !== null && dataComponentProp !== void 0 ? dataComponentProp : 'Dialog';
|
|
197
203
|
return /*#__PURE__*/jsx(DialogContext.Provider, {
|
|
198
204
|
value: DIALOG_CONTEXT_VALUE,
|
|
199
205
|
children: /*#__PURE__*/jsx(Portal, {
|
|
@@ -218,13 +224,17 @@ const _Dialog = /*#__PURE__*/React.forwardRef((props, forwardedRef) => {
|
|
|
218
224
|
...(align && {
|
|
219
225
|
'data-align': align
|
|
220
226
|
}),
|
|
221
|
-
"data-width": width,
|
|
227
|
+
"data-width": isWidthMapKey(width) ? width : undefined,
|
|
222
228
|
"data-height": height,
|
|
223
229
|
"data-has-footer": hasFooter ? '' : undefined,
|
|
224
230
|
"data-footer-button-layout": hasFooter ? footerButtonLayout : undefined,
|
|
225
231
|
className: clsx(className, classes.Dialog),
|
|
226
|
-
style:
|
|
227
|
-
|
|
232
|
+
style: {
|
|
233
|
+
...style,
|
|
234
|
+
...(!isWidthMapKey(width) ? {
|
|
235
|
+
'--dialog-width': normalizeWidth(width)
|
|
236
|
+
} : {})
|
|
237
|
+
},
|
|
228
238
|
children: [header, /*#__PURE__*/jsx(ScrollableRegion, {
|
|
229
239
|
"aria-labelledby": dialogLabelId,
|
|
230
240
|
className: classes.DialogOverflowWrapper,
|
|
@@ -243,8 +253,7 @@ const Header = /*#__PURE__*/React.forwardRef(function Header({
|
|
|
243
253
|
return /*#__PURE__*/jsx("div", {
|
|
244
254
|
ref: forwardRef,
|
|
245
255
|
className: clsx(className, classes.Header),
|
|
246
|
-
...rest
|
|
247
|
-
"data-component": "Dialog.Header"
|
|
256
|
+
...rest
|
|
248
257
|
});
|
|
249
258
|
});
|
|
250
259
|
Header.displayName = 'Dialog.Header';
|
|
@@ -255,8 +264,7 @@ const Title = /*#__PURE__*/React.forwardRef(function Title({
|
|
|
255
264
|
return /*#__PURE__*/jsx("h1", {
|
|
256
265
|
ref: forwardRef,
|
|
257
266
|
className: clsx(className, classes.Title),
|
|
258
|
-
...rest
|
|
259
|
-
"data-component": "Dialog.Title"
|
|
267
|
+
...rest
|
|
260
268
|
});
|
|
261
269
|
});
|
|
262
270
|
Title.displayName = 'Dialog.Title';
|
|
@@ -267,8 +275,7 @@ const Subtitle = /*#__PURE__*/React.forwardRef(function Subtitle({
|
|
|
267
275
|
return /*#__PURE__*/jsx("h2", {
|
|
268
276
|
ref: forwardRef,
|
|
269
277
|
className: clsx(className, classes.Subtitle),
|
|
270
|
-
...rest
|
|
271
|
-
"data-component": "Dialog.Subtitle"
|
|
278
|
+
...rest
|
|
272
279
|
});
|
|
273
280
|
});
|
|
274
281
|
Subtitle.displayName = 'Dialog.Subtitle';
|
|
@@ -279,8 +286,7 @@ const Body = /*#__PURE__*/React.forwardRef(function Body({
|
|
|
279
286
|
return /*#__PURE__*/jsx("div", {
|
|
280
287
|
ref: forwardRef,
|
|
281
288
|
className: clsx(className, classes.Body),
|
|
282
|
-
...rest
|
|
283
|
-
"data-component": "Dialog.Body"
|
|
289
|
+
...rest
|
|
284
290
|
});
|
|
285
291
|
});
|
|
286
292
|
Body.displayName = 'Dialog.Body';
|
|
@@ -291,8 +297,7 @@ const Footer = /*#__PURE__*/React.forwardRef(function Footer({
|
|
|
291
297
|
return /*#__PURE__*/jsx("div", {
|
|
292
298
|
ref: forwardRef,
|
|
293
299
|
className: clsx(className, classes.Footer),
|
|
294
|
-
...rest
|
|
295
|
-
"data-component": "Dialog.Footer"
|
|
300
|
+
...rest
|
|
296
301
|
});
|
|
297
302
|
});
|
|
298
303
|
Footer.displayName = 'Dialog.Footer';
|
|
@@ -322,7 +327,6 @@ const Buttons = ({
|
|
|
322
327
|
...buttonProps
|
|
323
328
|
} = dialogButtonProps;
|
|
324
329
|
return /*#__PURE__*/jsx(ButtonComponent, {
|
|
325
|
-
"data-component": "Dialog.FooterButton",
|
|
326
330
|
...buttonProps,
|
|
327
331
|
// 'normal' value is equivalent to 'default', this is used for backwards compatibility
|
|
328
332
|
variant: buttonType === 'normal' ? 'default' : buttonType
|
|
@@ -341,8 +345,7 @@ const CloseButton = ({
|
|
|
341
345
|
icon: XIcon,
|
|
342
346
|
"aria-label": "Close",
|
|
343
347
|
onClick: onClose,
|
|
344
|
-
variant: "invisible"
|
|
345
|
-
"data-component": "Dialog.CloseButton"
|
|
348
|
+
variant: "invisible"
|
|
346
349
|
});
|
|
347
350
|
};
|
|
348
351
|
CloseButton.displayName = "CloseButton";
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './Dialog-
|
|
1
|
+
import './Dialog-b7da369a.css';
|
|
2
2
|
|
|
3
3
|
var classes = {"Backdrop":"prc-Dialog-Backdrop-5Nt2U","dialog-backdrop-appear":"prc-Dialog-dialog-backdrop-appear-tCG2K","Dialog":"prc-Dialog-Dialog-G8cDF","Overlay--motion-scaleFade":"prc-Dialog-Overlay--motion-scaleFade-mE6-C","Overlay--motion-slideInRight":"prc-Dialog-Overlay--motion-slideInRight-BR-CZ","Overlay--motion-slideInLeft":"prc-Dialog-Overlay--motion-slideInLeft-ISmQZ","Overlay--motion-slideUp":"prc-Dialog-Overlay--motion-slideUp-tPElO","DialogOverflowWrapper":"prc-Dialog-DialogOverflowWrapper-JvHzz","detect-scroll":"prc-Dialog-detect-scroll-b3i8Q","Header":"prc-Dialog-Header-f7Me-","HeaderInner":"prc-Dialog-HeaderInner-H-fFY","HeaderContent":"prc-Dialog-HeaderContent-mjAsn","Title":"prc-Dialog-Title-M-iPn","Subtitle":"prc-Dialog-Subtitle-aBFSq","Body":"prc-Dialog-Body-bB903","Footer":"prc-Dialog-Footer-PMeQk"};
|
|
4
4
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroup.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAazB,MAAM,MAAM,yBAAyB,GAAG;IACtC,
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroup.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAazB,MAAM,MAAM,yBAAyB,GAAG;IACtC,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,CAAC,iBAAiB,CAAC,CAAC,EAAE,MAAM,CAAA;IAC5B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;OAGG;IACH,EAAE,CAAC,EAAE,MAAM,CAAA;IACX;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAyHD,YAAY,EAAC,8BAA8B,EAAC,MAAM,6BAA6B,CAAA;;;;;;;;;;AAC/E,wBAIE"}
|
|
@@ -13,7 +13,6 @@ import { isSlot } from '../../../utils/is-slot.js';
|
|
|
13
13
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
14
14
|
|
|
15
15
|
const CheckboxOrRadioGroup = ({
|
|
16
|
-
parentName,
|
|
17
16
|
'aria-labelledby': ariaLabelledby,
|
|
18
17
|
children,
|
|
19
18
|
disabled = false,
|
|
@@ -44,12 +43,10 @@ const CheckboxOrRadioGroup = ({
|
|
|
44
43
|
disabled,
|
|
45
44
|
required,
|
|
46
45
|
captionId,
|
|
47
|
-
validationMessageId
|
|
48
|
-
parentName
|
|
46
|
+
validationMessageId
|
|
49
47
|
},
|
|
50
48
|
children: /*#__PURE__*/jsxs("div", {
|
|
51
49
|
children: [/*#__PURE__*/jsxs(Component, {
|
|
52
|
-
"data-component": parentName,
|
|
53
50
|
className: clsx(className, classes.GroupFieldset),
|
|
54
51
|
"data-validation": validationChild ? '' : undefined,
|
|
55
52
|
...(labelChild ? {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroupCaption.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,KAAK,gCAAgC,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAC,CAAC,CAAA;AAErF,QAAA,MAAM,2BAA2B,EAAE,gBAAgB,CAAC,gCAAgC,
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroupCaption.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,KAAK,gCAAgC,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAC,CAAC,CAAA;AAErF,QAAA,MAAM,2BAA2B,EAAE,gBAAgB,CAAC,gCAAgC,CAOnF,CAAA;AAED,eAAe,2BAA2B,CAAA"}
|
|
@@ -10,13 +10,11 @@ const CheckboxOrRadioGroupCaption = ({
|
|
|
10
10
|
children
|
|
11
11
|
}) => {
|
|
12
12
|
const {
|
|
13
|
-
captionId
|
|
14
|
-
parentName
|
|
13
|
+
captionId
|
|
15
14
|
} = React.useContext(CheckboxOrRadioGroupContext);
|
|
16
15
|
return /*#__PURE__*/jsx(Text, {
|
|
17
16
|
className: clsx(className, classes.CheckboxOrRadioGroupCaption),
|
|
18
17
|
id: captionId,
|
|
19
|
-
"data-component": parentName && `${parentName}.Caption`,
|
|
20
18
|
children: children
|
|
21
19
|
});
|
|
22
20
|
};
|
|
@@ -3,7 +3,6 @@ import type { CheckboxOrRadioGroupProps } from './CheckboxOrRadioGroup';
|
|
|
3
3
|
export type CheckboxOrRadioGroupContext = {
|
|
4
4
|
validationMessageId?: string;
|
|
5
5
|
captionId?: string;
|
|
6
|
-
parentName?: string;
|
|
7
6
|
} & CheckboxOrRadioGroupProps;
|
|
8
7
|
declare const CheckboxOrRadioGroupContext: React.Context<CheckboxOrRadioGroupContext>;
|
|
9
8
|
export default CheckboxOrRadioGroupContext;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroupContext.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAC,yBAAyB,EAAC,MAAM,wBAAwB,CAAA;AAErE,MAAM,MAAM,2BAA2B,GAAG;IACxC,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroupContext.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,KAAK,EAAC,yBAAyB,EAAC,MAAM,wBAAwB,CAAA;AAErE,MAAM,MAAM,2BAA2B,GAAG;IACxC,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,GAAG,yBAAyB,CAAA;AAE7B,QAAA,MAAM,2BAA2B,4CAAuD,CAAA;AAExF,eAAe,2BAA2B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroupLabel.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,MAAM,MAAM,8BAA8B,GAAG;IAC3C,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAAA;AAED,QAAA,MAAM,yBAAyB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,8BAA8B,CAAC,
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroupLabel.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAMzB,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,MAAM,MAAM,8BAA8B,GAAG;IAC3C,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAA;CACzB,CAAA;AAED,QAAA,MAAM,yBAAyB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,8BAA8B,CAAC,CAwBxG,CAAA;AAED,eAAe,yBAAyB,CAAA"}
|
|
@@ -13,15 +13,13 @@ const CheckboxOrRadioGroupLabel = ({
|
|
|
13
13
|
}) => {
|
|
14
14
|
const {
|
|
15
15
|
required,
|
|
16
|
-
disabled
|
|
17
|
-
parentName
|
|
16
|
+
disabled
|
|
18
17
|
} = React.useContext(CheckboxOrRadioGroupContext);
|
|
19
18
|
return /*#__PURE__*/jsx(VisuallyHidden, {
|
|
20
19
|
className: clsx(className, classes.RadioGroupLabel),
|
|
21
20
|
isVisible: !visuallyHidden,
|
|
22
21
|
title: required ? 'required field' : undefined,
|
|
23
22
|
"data-label-disabled": disabled ? '' : undefined,
|
|
24
|
-
"data-component": parentName && `${parentName}.Label`,
|
|
25
23
|
children: required ? /*#__PURE__*/jsxs(Stack, {
|
|
26
24
|
direction: "horizontal",
|
|
27
25
|
gap: "none",
|
package/dist/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxOrRadioGroupValidation.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,2CAA2C,CAAA;AAEnF,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,MAAM,MAAM,mCAAmC,GAAG;IAChD,8DAA8D;IAC9D,OAAO,EAAE,oBAAoB,CAAA;CAC9B,CAAA;AAED,QAAA,MAAM,8BAA8B,EAAE,gBAAgB,CACpD,KAAK,CAAC,iBAAiB,CAAC,mCAAmC,CAAC,
|
|
1
|
+
{"version":3,"file":"CheckboxOrRadioGroupValidation.d.ts","sourceRoot":"","sources":["../../../../src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,2CAA2C,CAAA;AAEnF,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAA;AAE1D,MAAM,MAAM,mCAAmC,GAAG;IAChD,8DAA8D;IAC9D,OAAO,EAAE,oBAAoB,CAAA;CAC9B,CAAA;AAED,QAAA,MAAM,8BAA8B,EAAE,gBAAgB,CACpD,KAAK,CAAC,iBAAiB,CAAC,mCAAmC,CAAC,CAQ7D,CAAA;AAED,eAAe,8BAA8B,CAAA"}
|
|
@@ -8,13 +8,11 @@ const CheckboxOrRadioGroupValidation = ({
|
|
|
8
8
|
variant
|
|
9
9
|
}) => {
|
|
10
10
|
const {
|
|
11
|
-
validationMessageId = ''
|
|
12
|
-
parentName
|
|
11
|
+
validationMessageId = ''
|
|
13
12
|
} = React.useContext(CheckboxOrRadioGroupContext);
|
|
14
13
|
return /*#__PURE__*/jsx(InputValidation, {
|
|
15
14
|
validationStatus: variant,
|
|
16
15
|
id: validationMessageId,
|
|
17
|
-
"data-component": parentName && `${parentName}.Validation`,
|
|
18
16
|
children: children
|
|
19
17
|
});
|
|
20
18
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputValidation.d.ts","sourceRoot":"","sources":["../../../src/internal/components/InputValidation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,wCAAwC,CAAA;AAIhF,KAAK,KAAK,GAAG
|
|
1
|
+
{"version":3,"file":"InputValidation.d.ts","sourceRoot":"","sources":["../../../src/internal/components/InputValidation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,wCAAwC,CAAA;AAIhF,KAAK,KAAK,GAAG;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,EAAE,EAAE,MAAM,CAAA;IACV,gBAAgB,CAAC,EAAE,oBAAoB,CAAA;IACvC,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAA;AAUD,QAAA,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAuC7D,CAAA;AAED,eAAe,eAAe,CAAA"}
|
|
@@ -2,7 +2,7 @@ import { c } from 'react-compiler-runtime';
|
|
|
2
2
|
import { AlertFillIcon, CheckCircleFillIcon } from '@primer/octicons-react';
|
|
3
3
|
import classes from './InputValidation.module.css.js';
|
|
4
4
|
import { clsx } from 'clsx';
|
|
5
|
-
import {
|
|
5
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
6
6
|
import Text from '../../Text/Text.js';
|
|
7
7
|
|
|
8
8
|
const validationIconMap = {
|
|
@@ -10,48 +10,25 @@ const validationIconMap = {
|
|
|
10
10
|
error: AlertFillIcon
|
|
11
11
|
};
|
|
12
12
|
const InputValidation = t0 => {
|
|
13
|
-
const $ = c(
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
({
|
|
22
|
-
children,
|
|
23
|
-
className,
|
|
24
|
-
id,
|
|
25
|
-
validationStatus,
|
|
26
|
-
style,
|
|
27
|
-
...rest
|
|
28
|
-
} = t0);
|
|
29
|
-
$[0] = t0;
|
|
30
|
-
$[1] = children;
|
|
31
|
-
$[2] = className;
|
|
32
|
-
$[3] = id;
|
|
33
|
-
$[4] = rest;
|
|
34
|
-
$[5] = style;
|
|
35
|
-
$[6] = validationStatus;
|
|
36
|
-
} else {
|
|
37
|
-
children = $[1];
|
|
38
|
-
className = $[2];
|
|
39
|
-
id = $[3];
|
|
40
|
-
rest = $[4];
|
|
41
|
-
style = $[5];
|
|
42
|
-
validationStatus = $[6];
|
|
43
|
-
}
|
|
13
|
+
const $ = c(14);
|
|
14
|
+
const {
|
|
15
|
+
children,
|
|
16
|
+
className,
|
|
17
|
+
id,
|
|
18
|
+
validationStatus,
|
|
19
|
+
style
|
|
20
|
+
} = t0;
|
|
44
21
|
const IconComponent = validationStatus ? validationIconMap[validationStatus] : undefined;
|
|
45
22
|
let t1;
|
|
46
|
-
if ($[
|
|
23
|
+
if ($[0] !== className) {
|
|
47
24
|
t1 = clsx(className, classes.InputValidation);
|
|
48
|
-
$[
|
|
49
|
-
$[
|
|
25
|
+
$[0] = className;
|
|
26
|
+
$[1] = t1;
|
|
50
27
|
} else {
|
|
51
|
-
t1 = $[
|
|
28
|
+
t1 = $[1];
|
|
52
29
|
}
|
|
53
30
|
let t2;
|
|
54
|
-
if ($[
|
|
31
|
+
if ($[2] !== IconComponent) {
|
|
55
32
|
t2 = IconComponent ? /*#__PURE__*/jsx("span", {
|
|
56
33
|
"aria-hidden": "true",
|
|
57
34
|
className: classes.ValidationIcon,
|
|
@@ -63,52 +40,50 @@ const InputValidation = t0 => {
|
|
|
63
40
|
fill: "currentColor"
|
|
64
41
|
})
|
|
65
42
|
}) : null;
|
|
66
|
-
$[
|
|
67
|
-
$[
|
|
43
|
+
$[2] = IconComponent;
|
|
44
|
+
$[3] = t2;
|
|
68
45
|
} else {
|
|
69
|
-
t2 = $[
|
|
46
|
+
t2 = $[3];
|
|
70
47
|
}
|
|
71
48
|
let t3;
|
|
72
|
-
if ($[
|
|
49
|
+
if ($[4] === Symbol.for("react.memo_cache_sentinel")) {
|
|
73
50
|
t3 = {
|
|
74
51
|
"--inputValidation-lineHeight": 1.3333333333333333
|
|
75
52
|
};
|
|
76
|
-
$[
|
|
53
|
+
$[4] = t3;
|
|
77
54
|
} else {
|
|
78
|
-
t3 = $[
|
|
55
|
+
t3 = $[4];
|
|
79
56
|
}
|
|
80
57
|
let t4;
|
|
81
|
-
if ($[
|
|
58
|
+
if ($[5] !== children || $[6] !== id) {
|
|
82
59
|
t4 = /*#__PURE__*/jsx("span", {
|
|
83
60
|
id: id,
|
|
84
61
|
className: classes.ValidationText,
|
|
85
62
|
style: t3,
|
|
86
63
|
children: children
|
|
87
64
|
});
|
|
88
|
-
$[
|
|
89
|
-
$[
|
|
90
|
-
$[
|
|
65
|
+
$[5] = children;
|
|
66
|
+
$[6] = id;
|
|
67
|
+
$[7] = t4;
|
|
91
68
|
} else {
|
|
92
|
-
t4 = $[
|
|
69
|
+
t4 = $[7];
|
|
93
70
|
}
|
|
94
71
|
let t5;
|
|
95
|
-
if ($[
|
|
72
|
+
if ($[8] !== style || $[9] !== t1 || $[10] !== t2 || $[11] !== t4 || $[12] !== validationStatus) {
|
|
96
73
|
t5 = /*#__PURE__*/jsxs(Text, {
|
|
97
|
-
...rest,
|
|
98
74
|
className: t1,
|
|
99
75
|
"data-validation-status": validationStatus,
|
|
100
76
|
style: style,
|
|
101
77
|
children: [t2, t4]
|
|
102
78
|
});
|
|
103
|
-
$[
|
|
104
|
-
$[
|
|
105
|
-
$[
|
|
106
|
-
$[
|
|
107
|
-
$[
|
|
108
|
-
$[
|
|
109
|
-
$[21] = t5;
|
|
79
|
+
$[8] = style;
|
|
80
|
+
$[9] = t1;
|
|
81
|
+
$[10] = t2;
|
|
82
|
+
$[11] = t4;
|
|
83
|
+
$[12] = validationStatus;
|
|
84
|
+
$[13] = t5;
|
|
110
85
|
} else {
|
|
111
|
-
t5 = $[
|
|
86
|
+
t5 = $[13];
|
|
112
87
|
}
|
|
113
88
|
return t5;
|
|
114
89
|
};
|
|
@@ -3166,8 +3166,8 @@
|
|
|
3166
3166
|
},
|
|
3167
3167
|
{
|
|
3168
3168
|
"name": "width",
|
|
3169
|
-
"type": "'small' | 'medium' | 'large' | 'xlarge'",
|
|
3170
|
-
"description": "The width of the dialog.\nsmall: 296px\nmedium: 320px\nlarge: 480px\nxlarge: 640px"
|
|
3169
|
+
"type": "'small' | 'medium' | 'large' | 'xlarge' | string | number",
|
|
3170
|
+
"description": "The width of the dialog.\nsmall: 296px\nmedium: 320px\nlarge: 480px\nxlarge: 640px\n\nAlso accepts any valid CSS width value (e.g. '400px', '80rem') or a number, which is interpreted as a pixel width."
|
|
3171
3171
|
},
|
|
3172
3172
|
{
|
|
3173
3173
|
"name": "height",
|
package/package.json
CHANGED
|
@@ -1,2 +0,0 @@
|
|
|
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: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: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-f9bb927a.css.map */
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/Dialog/Dialog.module.css.js"],"names":[],"mappings":"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","file":"Dialog-f9bb927a.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: 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: 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"]}
|