@primer/react 0.0.0-20260617235430 → 0.0.0-20260618024924

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 CHANGED
@@ -1,6 +1,6 @@
1
1
  # @primer/react
2
2
 
3
- ## 0.0.0-20260617235430
3
+ ## 0.0.0-20260618024924
4
4
 
5
5
  ### Minor Changes
6
6
 
@@ -8,6 +8,20 @@
8
8
 
9
9
  - [#7994](https://github.com/primer/react/pull/7994) [`8cb7f6d`](https://github.com/primer/react/commit/8cb7f6d9e1314e8c9b3bddeabebbf6a93fb4f768) Thanks [@TylerJDev](https://github.com/TylerJDev)! - ActionList: Adds `tooltipDirection` prop to `ActionList.TrailingAction`
10
10
 
11
+ - [#7991](https://github.com/primer/react/pull/7991) [`8d5609e`](https://github.com/primer/react/commit/8d5609e816db6cc8e548e73560363fc4e6fdb2dd) Thanks [@llastflowers](https://github.com/llastflowers)! - Add data-component attributes and associated tests for:
12
+
13
+ Radio
14
+ RadioGroup
15
+ RelativeTime
16
+ ScrollableRegion
17
+ SegmentedControl
18
+ Select
19
+ SideNav
20
+ SkeletonBox
21
+ SkeletonAvatar
22
+ SkeletonText
23
+ Spinner
24
+
11
25
  - [#7867](https://github.com/primer/react/pull/7867) [`4ec4248`](https://github.com/primer/react/commit/4ec4248b9c1ae662b761385110f1fd7ad7480a2f) Thanks [@llastflowers](https://github.com/llastflowers)! - Add data-component attributes and associated tests for ActionMenu, AnchoredOverlay, Autocomplete, and NavList
12
26
 
13
27
  - [#7897](https://github.com/primer/react/pull/7897) [`1f7b8af`](https://github.com/primer/react/commit/1f7b8af8127a859c472b3972ebe9fce934246c38) Thanks [@liuliu-dev](https://github.com/liuliu-dev)! - Add support for the `as` prop on `TreeView.Item`. This enables rendering the
@@ -27,8 +41,6 @@
27
41
 
28
42
  - [#7999](https://github.com/primer/react/pull/7999) [`eada357`](https://github.com/primer/react/commit/eada3574ff15bfd7680602f34e19308ea766a972) Thanks [@copilot-swe-agent](https://github.com/apps/copilot-swe-agent)! - Breadcrumbs: Improve rendering performance and refresh the overflow menu when breadcrumb content changes without changing the number of items.
29
43
 
30
- - [#7935](https://github.com/primer/react/pull/7935) [`2765933`](https://github.com/primer/react/commit/276593387ec84f72aeba02a940b5e0a4d0a026a9) Thanks [@copilot-swe-agent](https://github.com/apps/copilot-swe-agent)! - ConfirmationDialog: `useConfirm`/`confirm` now removes its host element from `document.body` after the dialog is closed, and uses a fresh host element per call, so the empty container no longer lingers or leaks into other components and tests
31
-
32
44
  - [#7929](https://github.com/primer/react/pull/7929) [`48c34ca`](https://github.com/primer/react/commit/48c34ca452a5449b0ba901783edb169b6a1e1882) Thanks [@joshblack](https://github.com/joshblack)! - FilteredActionList: Make body skeleton widths stable for server rendering
33
45
 
34
46
  - [#7985](https://github.com/primer/react/pull/7985) [`969c874`](https://github.com/primer/react/commit/969c8749b40a8f5075dd9ca91314cde5c41e3814) Thanks [@joshblack](https://github.com/joshblack)! - AnchoredOverlay: Render the popover target attribute correctly for popover anchors
@@ -1 +1 @@
1
- {"version":3,"file":"useConfirm.d.ts","sourceRoot":"","sources":["../../src/ConfirmationDialog/useConfirm.ts"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAGxC,OAAO,EAAqB,KAAK,uBAAuB,EAAC,MAAM,sBAAsB,CAAA;AAErF,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,uBAAuB,EAAE,SAAS,CAAC,GAAG;IAAC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;CAAC,CAAA;AAuBlG;;;;GAIG;AACH,wBAAgB,UAAU,cACa,cAAc,sBAIpD"}
1
+ {"version":3,"file":"useConfirm.d.ts","sourceRoot":"","sources":["../../src/ConfirmationDialog/useConfirm.ts"],"names":[],"mappings":"AAAA,OAAO,KAAoB,MAAM,OAAO,CAAA;AAGxC,OAAO,EAAqB,KAAK,uBAAuB,EAAC,MAAM,sBAAsB,CAAA;AAIrF,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,uBAAuB,EAAE,SAAS,CAAC,GAAG;IAAC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAA;CAAC,CAAA;AA0BlG;;;;GAIG;AACH,wBAAgB,UAAU,cACa,cAAc,sBAIpD"}
@@ -3,19 +3,23 @@ import { createRoot } from 'react-dom/client';
3
3
  import BaseStyles from '../BaseStyles.js';
4
4
  import { ConfirmationDialog } from './ConfirmationDialog.js';
5
5
 
6
+ let hostElement = null;
6
7
  async function confirm(options) {
7
8
  const {
8
9
  content,
9
10
  ...confirmationDialogProps
10
11
  } = options;
11
12
  return new Promise(resolve => {
12
- const hostElement = document.createElement('div');
13
- document.body.append(hostElement);
13
+ hostElement ||= document.createElement('div');
14
+ if (!hostElement.isConnected) document.body.append(hostElement);
14
15
  const root = createRoot(hostElement);
15
16
  const onClose = gesture => {
16
17
  root.unmount();
17
- hostElement.remove();
18
- resolve(gesture === 'confirm');
18
+ if (gesture === 'confirm') {
19
+ resolve(true);
20
+ } else {
21
+ resolve(false);
22
+ }
19
23
  };
20
24
  root.render(/*#__PURE__*/React.createElement(BaseStyles, null, /*#__PURE__*/React.createElement(ConfirmationDialog, {
21
25
  ...confirmationDialogProps,
@@ -1 +1 @@
1
- {"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/Radio/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAqB,mBAAmB,EAAe,MAAM,OAAO,CAAA;AAChF,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAElD,MAAM,MAAM,UAAU,GAAG;IACvB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;IACvC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,CAAA;AAEzC;;GAEG;AACH,QAAA,MAAM,KAAK,kGA8CV,CAAA;wBAKuB,cAAc,CAAC,OAAO,KAAK,CAAC;AAApD,wBAAoD"}
1
+ {"version":3,"file":"Radio.d.ts","sourceRoot":"","sources":["../../src/Radio/Radio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAqB,mBAAmB,EAAe,MAAM,OAAO,CAAA;AAChF,OAAO,KAAmB,MAAM,OAAO,CAAA;AAKvC,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,gBAAgB,CAAA;AAElD,MAAM,MAAM,UAAU,GAAG;IACvB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;OAEG;IACH,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAA;IACvC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,mBAAmB,CAAC,gBAAgB,CAAC,CAAA;AAEzC;;GAEG;AACH,QAAA,MAAM,KAAK,kGA+CV,CAAA;wBAKuB,cAAc,CAAC,OAAO,KAAK,CAAC;AAApD,wBAAoD"}
@@ -94,7 +94,8 @@ const Radio = /*#__PURE__*/React.forwardRef((t0, ref) => {
94
94
  required: required,
95
95
  onChange: handleOnChange,
96
96
  className: t4,
97
- ...rest
97
+ ...rest,
98
+ "data-component": "Radio"
98
99
  });
99
100
  $[15] = checked;
100
101
  $[16] = disabled;
@@ -87,6 +87,7 @@ const RadioGroup = t0 => {
87
87
  if ($[16] !== children || $[17] !== disabled || $[18] !== rest) {
88
88
  t4 = /*#__PURE__*/jsx(CheckboxOrRadioGroup, {
89
89
  disabled: disabled,
90
+ "data-component": "RadioGroup",
90
91
  ...rest,
91
92
  children: children
92
93
  });
@@ -65,6 +65,7 @@ function RelativeTime(t0) {
65
65
  ...props,
66
66
  date: date,
67
67
  "no-title": t1,
68
+ "data-component": "RelativeTime",
68
69
  children: t2
69
70
  });
70
71
  $[11] = date;
@@ -1 +1 @@
1
- {"version":3,"file":"ScrollableRegion.d.ts","sourceRoot":"","sources":["../../src/ScrollableRegion/ScrollableRegion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,KAAK,QAAQ,GACT;IACE,YAAY,EAAE,MAAM,CAAA;IACpB,iBAAiB,CAAC,EAAE,KAAK,CAAA;CAC1B,GACD;IACE,YAAY,CAAC,EAAE,KAAK,CAAA;IACpB,iBAAiB,EAAE,MAAM,CAAA;CAC1B,CAAA;AAEL,KAAK,qBAAqB,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAA;AAE7E,iBAAS,gBAAgB,CAAC,EACxB,YAAY,EAAE,KAAK,EACnB,iBAAiB,EAAE,UAAU,EAC7B,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,qBAAqB,qBAiBvB;AAED,OAAO,EAAC,gBAAgB,EAAC,CAAA;AACzB,YAAY,EAAC,qBAAqB,EAAC,CAAA"}
1
+ {"version":3,"file":"ScrollableRegion.d.ts","sourceRoot":"","sources":["../../src/ScrollableRegion/ScrollableRegion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,KAAK,QAAQ,GACT;IACE,YAAY,EAAE,MAAM,CAAA;IACpB,iBAAiB,CAAC,EAAE,KAAK,CAAA;CAC1B,GACD;IACE,YAAY,CAAC,EAAE,KAAK,CAAA;IACpB,iBAAiB,EAAE,MAAM,CAAA;CAC1B,CAAA;AAEL,KAAK,qBAAqB,GAAG,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,GAAG,QAAQ,CAAA;AAE7E,iBAAS,gBAAgB,CAAC,EACxB,YAAY,EAAE,KAAK,EACnB,iBAAiB,EAAE,UAAU,EAC7B,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,qBAAqB,qBAuBvB;AAED,OAAO,EAAC,gBAAgB,EAAC,CAAA;AACzB,YAAY,EAAC,qBAAqB,EAAC,CAAA"}
@@ -66,6 +66,7 @@ function ScrollableRegion(t0) {
66
66
  ...regionProps,
67
67
  ref: ref,
68
68
  className: t2,
69
+ "data-component": "ScrollableRegion",
69
70
  children: children
70
71
  });
71
72
  $[12] = children;
@@ -1 +1 @@
1
- {"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyB,MAAM,OAAO,CAAA;AAC7C,OAAO,KAAK,EAAC,2BAA2B,EAAC,MAAM,0BAA0B,CAAA;AAEzE,OAAO,KAAK,EAAC,+BAA+B,EAAC,MAAM,8BAA8B,CAAA;AAIjF,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,6BAA6B,CAAA;AAEhE,OAAO,KAAK,EAAC,0BAA0B,EAAC,MAAM,kCAAkC,CAAA;AAMhF,MAAM,MAAM,qBAAqB,GAAG;IAClC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC,OAAO,CAAC,CAAA;IAC9C,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,8BAA8B;IAC9B,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACzB,6FAA6F;IAC7F,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,0BAA0B,EAAE,YAAY,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC,CAAA;IACxG,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAsMD,eAAO,MAAM,gBAAgB;;;CAG3B,CAAA"}
1
+ {"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyB,MAAM,OAAO,CAAA;AAC7C,OAAO,KAAK,EAAC,2BAA2B,EAAC,MAAM,0BAA0B,CAAA;AAEzE,OAAO,KAAK,EAAC,+BAA+B,EAAC,MAAM,8BAA8B,CAAA;AAIjF,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,6BAA6B,CAAA;AAEhE,OAAO,KAAK,EAAC,0BAA0B,EAAC,MAAM,kCAAkC,CAAA;AAMhF,MAAM,MAAM,qBAAqB,GAAG;IAClC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,CAAC,OAAO,CAAC,CAAA;IAC9C,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,8BAA8B;IAC9B,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACzB,6FAA6F;IAC7F,OAAO,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,0BAA0B,EAAE,YAAY,GAAG,UAAU,GAAG,SAAS,CAAC,CAAC,CAAA;IACxG,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAuMD,eAAO,MAAM,gBAAgB;;;CAG3B,CAAA"}
@@ -226,6 +226,7 @@ const Root = t0 => {
226
226
  ...t7,
227
227
  "data-size": size,
228
228
  ...rest,
229
+ "data-component": "SegmentedControl",
229
230
  children: t8
230
231
  });
231
232
  $[41] = ariaLabel;
@@ -1 +1 @@
1
- {"version":3,"file":"SegmentedControlButton.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControlButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,OAAO,CAAA;AAC/C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,wBAAwB,CAAA;AAMrD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,2BAA2B,GAAG;IACxC,+CAA+C;IAC/C,QAAQ,EAAE,MAAM,CAAA;IAChB,oKAAoK;IACpK,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,sKAAsK;IACtK,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,iDAAiD;IAEjD,aAAa,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IACrG,wFAAwF;IAExF,WAAW,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IACnG,gHAAgH;IAChH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kEAAkE;IAClE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACxB,GAAG,oBAAoB,CAAC,iBAAiB,GAAG,aAAa,CAAC,CAAA;AAE3D,QAAA,MAAM,sBAAsB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,2BAA2B,CAAC,CAyClG,CAAA;AAED,eAAe,sBAAsB,CAAA"}
1
+ {"version":3,"file":"SegmentedControlButton.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControlButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,OAAO,CAAA;AAC/C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,wBAAwB,CAAA;AAMrD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,2BAA2B,GAAG;IACxC,+CAA+C;IAC/C,QAAQ,EAAE,MAAM,CAAA;IAChB,oKAAoK;IACpK,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,sKAAsK;IACtK,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,iDAAiD;IAEjD,aAAa,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IACrG,wFAAwF;IAExF,WAAW,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IACnG,gHAAgH;IAChH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kEAAkE;IAClE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CACxB,GAAG,oBAAoB,CAAC,iBAAiB,GAAG,aAAa,CAAC,CAAA;AAE3D,QAAA,MAAM,sBAAsB,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,2BAA2B,CAAC,CA0ClG,CAAA;AAED,eAAe,sBAAsB,CAAA"}
@@ -158,6 +158,7 @@ const SegmentedControlButton = t0 => {
158
158
  className: t4,
159
159
  type: "button",
160
160
  ...rest,
161
+ "data-component": "SegmentedControl.Button",
161
162
  children: t10
162
163
  });
163
164
  $[27] = rest;
@@ -1 +1 @@
1
- {"version":3,"file":"SegmentedControlIconButton.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControlIconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,OAAO,CAAA;AAC/C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,wBAAwB,CAAA;AAErD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAA;AAIlD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,+BAA+B,GAAG;IAC5C,YAAY,EAAE,MAAM,CAAA;IACpB,0DAA0D;IAE1D,IAAI,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IAC3F,8JAA8J;IAC9J,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kKAAkK;IAClK,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,kFAAkF;IAClF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oCAAoC;IACpC,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;IACnC,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,oBAAoB,CAAC,iBAAiB,GAAG,aAAa,CAAC,CAAA;AAE3D,eAAO,MAAM,0BAA0B,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,+BAA+B,CAAC,CAiCjH,CAAA;AAID,eAAe,0BAA0B,CAAA"}
1
+ {"version":3,"file":"SegmentedControlIconButton.d.ts","sourceRoot":"","sources":["../../src/SegmentedControl/SegmentedControlIconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,oBAAoB,EAAC,MAAM,OAAO,CAAA;AAC/C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,wBAAwB,CAAA;AAErD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,cAAc,CAAA;AAIlD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,gBAAgB,CAAA;AAEpD,MAAM,MAAM,+BAA+B,GAAG;IAC5C,YAAY,EAAE,MAAM,CAAA;IACpB,0DAA0D;IAE1D,IAAI,EAAE,KAAK,CAAC,iBAAiB,CAAC,KAAK,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,CAAC,CAAA;IAC3F,8JAA8J;IAC9J,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,kKAAkK;IAClK,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,kFAAkF;IAClF,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oCAAoC;IACpC,gBAAgB,CAAC,EAAE,gBAAgB,CAAA;IACnC,sCAAsC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,GAAG,oBAAoB,CAAC,iBAAiB,GAAG,aAAa,CAAC,CAAA;AAE3D,eAAO,MAAM,0BAA0B,EAAE,gBAAgB,CAAC,KAAK,CAAC,iBAAiB,CAAC,+BAA+B,CAAC,CAkCjH,CAAA;AAID,eAAe,0BAA0B,CAAA"}
@@ -114,6 +114,7 @@ const SegmentedControlIconButton = t0 => {
114
114
  "aria-disabled": t6,
115
115
  className: t7,
116
116
  ...rest,
117
+ "data-component": "SegmentedControl.IconButton",
117
118
  children: t10
118
119
  });
119
120
  $[20] = rest;
@@ -1 +1 @@
1
- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,yCAAyC,CAAA;AAE/E,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAI/F,MAAM,MAAM,WAAW,GAAG,IAAI,CAC5B,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,kBAAkB,EAAE,SAAS,GAAG,UAAU,CAAC,EAC/F,UAAU,GAAG,kBAAkB,GAAG,mBAAmB,GAAG,IAAI,CAC7D,GAAG;IACF,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;;;;eAoE2F,MAAM;;;;AAQlG,wBAIE"}
1
+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,yCAAyC,CAAA;AAE/E,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAI/F,MAAM,MAAM,WAAW,GAAG,IAAI,CAC5B,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC,GAAG,IAAI,CAAC,kBAAkB,EAAE,SAAS,GAAG,UAAU,CAAC,EAC/F,UAAU,GAAG,kBAAkB,GAAG,mBAAmB,GAAG,IAAI,CAC7D,GAAG;IACF,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;;;;eAqE2F,MAAM;;;;AAQlG,wBAIE"}
@@ -137,6 +137,7 @@ const Select = /*#__PURE__*/React.forwardRef((t0, ref) => {
137
137
  value: "",
138
138
  disabled: required,
139
139
  hidden: required,
140
+ "data-component": "Select.Option",
140
141
  children: placeholder
141
142
  });
142
143
  $[15] = placeholder;
@@ -156,6 +157,7 @@ const Select = /*#__PURE__*/React.forwardRef((t0, ref) => {
156
157
  className: t4,
157
158
  "data-hasplaceholder": t5,
158
159
  defaultValue: t6,
160
+ "data-component": "Select",
159
161
  children: [t7, children]
160
162
  });
161
163
  $[18] = children;
@@ -208,7 +210,8 @@ const Option = props => {
208
210
  let t0;
209
211
  if ($[0] !== props) {
210
212
  t0 = /*#__PURE__*/jsx("option", {
211
- ...props
213
+ ...props,
214
+ "data-component": "Select.Option"
212
215
  });
213
216
  $[0] = props;
214
217
  $[1] = t0;
@@ -222,7 +225,8 @@ const OptGroup = props => {
222
225
  let t0;
223
226
  if ($[0] !== props) {
224
227
  t0 = /*#__PURE__*/jsx("optgroup", {
225
- ...props
228
+ ...props,
229
+ "data-component": "Select.OptGroup"
226
230
  });
227
231
  $[0] = props;
228
232
  $[1] = t0;
@@ -1 +1 @@
1
- {"version":3,"file":"SideNav.d.ts","sourceRoot":"","sources":["../src/SideNav.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,EAAE,EAAC,MAAM,SAAS,CAAA;AAC/B,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,eAAe,CAAA;AACjD,OAAa,EAAC,KAAK,SAAS,EAAC,MAAM,QAAQ,CAAA;AAC3C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAC,KAAK,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAI5C,KAAK,gBAAgB,GAAG;IACtB,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IACtB,OAAO,CAAC,EAAE,aAAa,GAAG,QAAQ,CAAA;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,iBAAS,OAAO,CAAC,EACf,EAAE,EAAE,SAAiB,EACrB,OAAkB,EAClB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,YAAY,EAAE,SAAS,GACxB,EAAE,gBAAgB,qBAkBlB;AAED,KAAK,sBAAsB,GAAG,iBAAiB,CAAC;IAC9C,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAA;CAC5B,CAAC,GACA,SAAS,CAAA;AAEX,QAAA,MAAM,WAAW;8DAA2D,sBAAsB;;CAUjG,CAAA;AAID,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,CAAA;AACzD,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAA;AAEjE,4EAA4E;;;kEAjBA,sBAAsB;;;;AAkBlG,wBAA0D"}
1
+ {"version":3,"file":"SideNav.d.ts","sourceRoot":"","sources":["../src/SideNav.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,EAAE,EAAC,MAAM,SAAS,CAAA;AAC/B,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,eAAe,CAAA;AACjD,OAAa,EAAC,KAAK,SAAS,EAAC,MAAM,QAAQ,CAAA;AAC3C,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAC,KAAK,iBAAiB,EAAC,MAAM,OAAO,CAAA;AAI5C,KAAK,gBAAgB,GAAG;IACtB,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;IACtB,OAAO,CAAC,EAAE,aAAa,GAAG,QAAQ,CAAA;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;CACtB,CAAA;AAED,iBAAS,OAAO,CAAC,EACf,EAAE,EAAE,SAAiB,EACrB,OAAkB,EAClB,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,YAAY,EAAE,SAAS,GACxB,EAAE,gBAAgB,qBAkBlB;AAED,KAAK,sBAAsB,GAAG,iBAAiB,CAAC;IAC9C,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,CAAA;CAC5B,CAAC,GACA,SAAS,CAAA;AAEX,QAAA,MAAM,WAAW;8DAA2D,sBAAsB;;CAejG,CAAA;AAID,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,OAAO,CAAC,CAAA;AACzD,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,CAAA;AAEjE,4EAA4E;;;kEAtBA,sBAAsB;;;;AAuBlG,wBAA0D"}
package/dist/SideNav.js CHANGED
@@ -18,6 +18,7 @@ function SideNav({
18
18
  return /*#__PURE__*/jsx(Component, {
19
19
  className: newClassName,
20
20
  "aria-label": ariaLabel,
21
+ "data-component": "SideNav",
21
22
  children: children
22
23
  });
23
24
  }
@@ -40,6 +41,7 @@ const SideNavLink = ({
40
41
  "aria-current": isReactRouter || selected ? 'page' : undefined,
41
42
  className: newClassName,
42
43
  ...rest,
44
+ "data-component": "SideNav.Link",
43
45
  children: children
44
46
  });
45
47
  };
@@ -9,6 +9,7 @@ export type SkeletonBoxProps = {
9
9
  className?: string;
10
10
  /** Controls whether and how long to delay rendering the SkeletonBox. Set to 'short' to delay by 300ms, 'long' to delay by 1000ms, or provide a custom number of milliseconds.*/
11
11
  delay?: 'short' | 'long' | number;
12
+ 'data-component'?: string;
12
13
  } & HTMLProps<HTMLElement>;
13
14
  export declare const SkeletonBox: React.ForwardRefExoticComponent<Omit<SkeletonBoxProps, "ref"> & React.RefAttributes<HTMLElement>>;
14
15
  //# sourceMappingURL=SkeletonBox.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"SkeletonBox.d.ts","sourceRoot":"","sources":["../../src/Skeleton/SkeletonBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAChD,OAAO,EAAC,KAAK,aAAa,EAAE,KAAK,SAAS,EAAC,MAAM,OAAO,CAAA;AAIxD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAA;IAChC,wEAAwE;IACxE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC9B,wCAAwC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gLAAgL;IAChL,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAA;CAClC,GAAG,SAAS,CAAC,WAAW,CAAC,CAAA;AAE1B,eAAO,MAAM,WAAW,mGA+BtB,CAAA"}
1
+ {"version":3,"file":"SkeletonBox.d.ts","sourceRoot":"","sources":["../../src/Skeleton/SkeletonBox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAChD,OAAO,EAAC,KAAK,aAAa,EAAE,KAAK,SAAS,EAAC,MAAM,OAAO,CAAA;AAIxD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAA;IAChC,wEAAwE;IACxE,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAA;IAC9B,wCAAwC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,gLAAgL;IAChL,KAAK,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAA;IACjC,gBAAgB,CAAC,EAAE,MAAM,CAAA;CAC1B,GAAG,SAAS,CAAC,WAAW,CAAC,CAAA;AAE1B,eAAO,MAAM,WAAW,mGAgCtB,CAAA"}
@@ -5,12 +5,13 @@ import classes from './SkeletonBox.module.css.js';
5
5
  import { jsx } from 'react/jsx-runtime';
6
6
 
7
7
  const SkeletonBox = /*#__PURE__*/React.forwardRef(function SkeletonBox(t0, ref) {
8
- const $ = c(23);
8
+ const $ = c(25);
9
9
  let className;
10
10
  let delay;
11
11
  let height;
12
12
  let props;
13
13
  let style;
14
+ let t1;
14
15
  let width;
15
16
  if ($[0] !== t0) {
16
17
  ({
@@ -19,6 +20,7 @@ const SkeletonBox = /*#__PURE__*/React.forwardRef(function SkeletonBox(t0, ref)
19
20
  className,
20
21
  style,
21
22
  delay,
23
+ "data-component": t1,
22
24
  ...props
23
25
  } = t0);
24
26
  $[0] = t0;
@@ -27,20 +29,23 @@ const SkeletonBox = /*#__PURE__*/React.forwardRef(function SkeletonBox(t0, ref)
27
29
  $[3] = height;
28
30
  $[4] = props;
29
31
  $[5] = style;
30
- $[6] = width;
32
+ $[6] = t1;
33
+ $[7] = width;
31
34
  } else {
32
35
  className = $[1];
33
36
  delay = $[2];
34
37
  height = $[3];
35
38
  props = $[4];
36
39
  style = $[5];
37
- width = $[6];
40
+ t1 = $[6];
41
+ width = $[7];
38
42
  }
43
+ const dataComponent = t1 === undefined ? "SkeletonBox" : t1;
39
44
  const [isVisible, setIsVisible] = useState(!delay);
40
- let t1;
41
45
  let t2;
42
- if ($[7] !== delay) {
43
- t1 = () => {
46
+ let t3;
47
+ if ($[8] !== delay) {
48
+ t2 = () => {
44
49
  if (delay) {
45
50
  const timeoutId = setTimeout(() => {
46
51
  setIsVisible(true);
@@ -48,66 +53,68 @@ const SkeletonBox = /*#__PURE__*/React.forwardRef(function SkeletonBox(t0, ref)
48
53
  return () => clearTimeout(timeoutId);
49
54
  }
50
55
  };
51
- t2 = [delay];
52
- $[7] = delay;
53
- $[8] = t1;
56
+ t3 = [delay];
57
+ $[8] = delay;
54
58
  $[9] = t2;
59
+ $[10] = t3;
55
60
  } else {
56
- t1 = $[8];
57
61
  t2 = $[9];
62
+ t3 = $[10];
58
63
  }
59
- useEffect(t1, t2);
64
+ useEffect(t2, t3);
60
65
  if (!isVisible) {
61
66
  return null;
62
67
  }
63
- const t3 = ref;
64
- let t4;
65
- if ($[10] !== className) {
66
- t4 = clsx(className, classes.SkeletonBox);
67
- $[10] = className;
68
- $[11] = t4;
69
- } else {
70
- t4 = $[11];
71
- }
68
+ const t4 = ref;
72
69
  let t5;
73
- if ($[12] !== style) {
74
- t5 = style || {};
75
- $[12] = style;
76
- $[13] = t5;
70
+ if ($[11] !== className) {
71
+ t5 = clsx(className, classes.SkeletonBox);
72
+ $[11] = className;
73
+ $[12] = t5;
77
74
  } else {
78
- t5 = $[13];
75
+ t5 = $[12];
79
76
  }
80
77
  let t6;
81
- if ($[14] !== height || $[15] !== t5 || $[16] !== width) {
82
- t6 = {
78
+ if ($[13] !== style) {
79
+ t6 = style || {};
80
+ $[13] = style;
81
+ $[14] = t6;
82
+ } else {
83
+ t6 = $[14];
84
+ }
85
+ let t7;
86
+ if ($[15] !== height || $[16] !== t6 || $[17] !== width) {
87
+ t7 = {
83
88
  height,
84
89
  width,
85
- ...t5
90
+ ...t6
86
91
  };
87
- $[14] = height;
88
- $[15] = t5;
89
- $[16] = width;
90
- $[17] = t6;
92
+ $[15] = height;
93
+ $[16] = t6;
94
+ $[17] = width;
95
+ $[18] = t7;
91
96
  } else {
92
- t6 = $[17];
97
+ t7 = $[18];
93
98
  }
94
- let t7;
95
- if ($[18] !== props || $[19] !== t3 || $[20] !== t4 || $[21] !== t6) {
96
- t7 = /*#__PURE__*/jsx("div", {
97
- ref: t3,
98
- className: t4,
99
- style: t6,
100
- ...props
99
+ let t8;
100
+ if ($[19] !== dataComponent || $[20] !== props || $[21] !== t4 || $[22] !== t5 || $[23] !== t7) {
101
+ t8 = /*#__PURE__*/jsx("div", {
102
+ ref: t4,
103
+ className: t5,
104
+ style: t7,
105
+ ...props,
106
+ "data-component": dataComponent
101
107
  });
102
- $[18] = props;
103
- $[19] = t3;
104
- $[20] = t4;
105
- $[21] = t6;
106
- $[22] = t7;
108
+ $[19] = dataComponent;
109
+ $[20] = props;
110
+ $[21] = t4;
111
+ $[22] = t5;
112
+ $[23] = t7;
113
+ $[24] = t8;
107
114
  } else {
108
- t7 = $[22];
115
+ t8 = $[24];
109
116
  }
110
- return t7;
117
+ return t8;
111
118
  });
112
119
 
113
120
  export { SkeletonBox };
@@ -1 +1 @@
1
- {"version":3,"file":"SkeletonText.d.ts","sourceRoot":"","sources":["../../src/SkeletonText/SkeletonText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAA;AAKpC,UAAU,iBAAkB,SAAQ,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IACtE,uDAAuD;IACvD,IAAI,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,aAAa,GAAG,YAAY,GAAG,WAAW,GAAG,YAAY,GAAG,WAAW,GAAG,UAAU,CAAA;IACtH,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,6GAA6G;IAC7G,QAAQ,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAA;IAC1C,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,YAAY,CAAC,EAAC,KAAS,EAAE,QAAQ,EAAE,IAAmB,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAC,EAAE,iBAAiB,qBAsC7G;AAED,OAAO,EAAC,YAAY,EAAC,CAAA;AACrB,YAAY,EAAC,iBAAiB,EAAC,CAAA"}
1
+ {"version":3,"file":"SkeletonText.d.ts","sourceRoot":"","sources":["../../src/SkeletonText/SkeletonText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAA;AAKpC,UAAU,iBAAkB,SAAQ,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IACtE,uDAAuD;IACvD,IAAI,CAAC,EAAE,SAAS,GAAG,YAAY,GAAG,aAAa,GAAG,YAAY,GAAG,WAAW,GAAG,YAAY,GAAG,WAAW,GAAG,UAAU,CAAA;IACtH,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,6GAA6G;IAC7G,QAAQ,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,CAAA;IAC1C,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED,iBAAS,YAAY,CAAC,EAAC,KAAS,EAAE,QAAQ,EAAE,IAAmB,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAC,EAAE,iBAAiB,qBAuC7G;AAED,OAAO,EAAC,YAAY,EAAC,CAAA;AACrB,YAAY,EAAC,iBAAiB,EAAC,CAAA"}
@@ -62,12 +62,12 @@ function SkeletonText(t0) {
62
62
  let t5;
63
63
  if ($[12] !== rest || $[13] !== size || $[14] !== t3 || $[15] !== t4) {
64
64
  t5 = /*#__PURE__*/jsx(SkeletonBox, {
65
- "data-component": "SkeletonText",
66
65
  "data-text-skeleton-size": size,
67
66
  width: "100%",
68
67
  className: t3,
69
68
  style: t4,
70
- ...rest
69
+ ...rest,
70
+ "data-component": "SkeletonText"
71
71
  });
72
72
  $[12] = rest;
73
73
  $[13] = size;
@@ -191,6 +191,7 @@ function Spinner(t0) {
191
191
  if ($[32] !== t14 || $[33] !== t15) {
192
192
  t16 = /*#__PURE__*/jsxs("span", {
193
193
  className: classes.Box,
194
+ "data-component": "Spinner",
194
195
  children: [t14, t15]
195
196
  });
196
197
  $[32] = t14;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@primer/react",
3
3
  "type": "module",
4
- "version": "0.0.0-20260617235430",
4
+ "version": "0.0.0-20260618024924",
5
5
  "description": "An implementation of GitHub's Primer Design System using React",
6
6
  "main": "./dist/index.js",
7
7
  "module": "./dist/index.js",