@primer/react 38.1.1-rc.a581ae5ff → 38.2.0-rc.56f1b2a27

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.

Potentially problematic release.

This version of @primer/react might be problematic. Click here for more details.

Files changed (16) hide show
  1. package/CHANGELOG.md +7 -1
  2. package/dist/Button/IconButton.d.ts.map +1 -1
  3. package/dist/Button/IconButton.js +9 -0
  4. package/dist/StateLabel/StateLabel-47f1e690.css +2 -0
  5. package/dist/StateLabel/StateLabel-47f1e690.css.map +1 -0
  6. package/dist/StateLabel/StateLabel.d.ts +6 -2
  7. package/dist/StateLabel/StateLabel.d.ts.map +1 -1
  8. package/dist/StateLabel/StateLabel.js +43 -39
  9. package/dist/StateLabel/StateLabel.module.css.js +1 -1
  10. package/dist/TooltipV2/Tooltip.d.ts +10 -0
  11. package/dist/TooltipV2/Tooltip.d.ts.map +1 -1
  12. package/dist/TooltipV2/Tooltip.js +2 -1
  13. package/generated/components.json +1 -1
  14. package/package.json +1 -1
  15. package/dist/StateLabel/StateLabel-b586b0bc.css +0 -2
  16. package/dist/StateLabel/StateLabel-b586b0bc.css.map +0 -1
package/CHANGELOG.md CHANGED
@@ -1,6 +1,12 @@
1
1
  # @primer/react
2
2
 
3
- ## 38.1.1
3
+ ## 38.2.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#7149](https://github.com/primer/react/pull/7149) [`5e6e04e`](https://github.com/primer/react/commit/5e6e04e9fe0a6c6b3eef166dbc88d5d695ac02f3) Thanks [@lukasoppermann](https://github.com/lukasoppermann)! - StateLabel: Add size prop and deprecate variant prop to align with APIs in other components.
8
+
9
+ - [#7142](https://github.com/primer/react/pull/7142) [`4f3be9c`](https://github.com/primer/react/commit/4f3be9c657c1a300c50266d90a65bdde9fcb8dc8) Thanks [@TylerJDev](https://github.com/TylerJDev)! - IconButton: Hide tooltip when popup is open via new `closeTooltip` prop in `Tooltip`.
4
10
 
5
11
  ### Patch Changes
6
12
 
package/dist/Button/IconButton.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../src/Button/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,SAAS,CAAA;AAC5C,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAO/F,QAAA,MAAM,UAAU,EA+DX,8BAA8B,CAAC,QAAQ,GAAG,GAAG,EAAE,eAAe,CAAC,CAAA;AAEpE,OAAO,EAAC,UAAU,EAAC,CAAA"}
1
+ {"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../src/Button/IconButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,SAAS,CAAA;AAC5C,OAAO,KAAK,EAAC,mBAAmB,IAAI,8BAA8B,EAAC,MAAM,sBAAsB,CAAA;AAO/F,QAAA,MAAM,UAAU,EAuEX,8BAA8B,CAAC,QAAQ,GAAG,GAAG,EAAE,eAAe,CAAC,CAAA;AAEpE,OAAO,EAAC,UAAU,EAAC,CAAA"}
package/dist/Button/IconButton.js CHANGED
@@ -27,7 +27,15 @@ const IconButton = /*#__PURE__*/forwardRef(({
27
27
  tooltipId: tooltipIdV1
28
28
  } = React.useContext(TooltipContext$1); // Tooltip v1
29
29
 
30
+ const {
31
+ 'aria-expanded': isExpanded,
32
+ 'aria-haspopup': hasPopup
33
+ } = props;
30
34
  const hasExternalTooltip = tooltipId || tooltipIdV1;
35
+
36
+ // If the button has an active "popup" (like a menu), we don't want to show the tooltip.
37
+ // This is mostly for `ActionMenu`, but could be applicable elsewhere.
38
+ const hasActivePopup = (isExpanded === true || isExpanded === 'true') && hasPopup === 'true';
31
39
  const withoutTooltip = unsafeDisableTooltip || disabled || ariaLabel === undefined || ariaLabel === '' || hasExternalTooltip;
32
40
  if (withoutTooltip) {
33
41
  return /*#__PURE__*/jsx(ButtonBase, {
@@ -49,6 +57,7 @@ const IconButton = /*#__PURE__*/forwardRef(({
49
57
  type: description ? undefined : 'label',
50
58
  direction: tooltipDirection,
51
59
  keybindingHint: keybindingHint !== null && keybindingHint !== void 0 ? keybindingHint : keyshortcuts,
60
+ _privateDisableTooltip: hasActivePopup,
52
61
  children: /*#__PURE__*/jsx(ButtonBase, {
53
62
  icon: Icon,
54
63
  className: clsx(className, classes.IconButton),
package/dist/StateLabel/StateLabel-47f1e690.css ADDED
@@ -0,0 +1,2 @@
1
+ .prc-StateLabel-StateLabel-ukDwa{align-items:center;border-radius:var(--borderRadius-full,624.9375rem);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis));display:inline-flex;font-weight:var(--base-text-weight-semibold,600);line-height:16px;text-align:center}.prc-StateLabel-StateLabel-ukDwa:where([data-size=small]){font-size:var(--text-body-size-small,.75rem);padding:var(--base-size-4,.25rem) var(--base-size-8,.5rem)}.prc-StateLabel-StateLabel-ukDwa:where([data-size=medium]){font-size:var(--text-body-size-medium,.875rem);padding:var(--base-size-8,.5rem) var(--base-size-12,.75rem)}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueClosed]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueClosedNotPlanned]){background-color:var(--bgColor-neutral-emphasis,var(--color-fg-subtle));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-neutral-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullClosed]){background-color:var(--bgColor-closed-emphasis,var(--color-closed-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-closed-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullMerged]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullQueued]){background-color:var(--bgColor-attention-emphasis,var(--color-attention-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-attention-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueOpened]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullOpened]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=draft]){background-color:var(--bgColor-draft-emphasis,var(--bgColor-neutral-emphasis,var(--color-fg-subtle)));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-draft-emphasis,var(--borderColor-neutral-emphasis,transparent));color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueDraft]){background-color:var(--bgColor-draft-emphasis,var(--bgColor-neutral-emphasis,var(--color-fg-subtle)));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-draft-emphasis,var(--borderColor-neutral-emphasis,transparent));color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=unavailable]){background-color:var(--bgColor-neutral-emphasis,var(--color-fg-subtle));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-neutral-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=open]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=closed]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-Icon-NuDm4{margin-right:var(--base-size-4,.25rem)}.prc-StateLabel-Icon-NuDm4:where([data-size-small]){width:1em}
2
+ /*# sourceMappingURL=StateLabel-47f1e690.css.map */
package/dist/StateLabel/StateLabel-47f1e690.css.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/StateLabel/StateLabel.module.css"],"names":[],"mappings":"AAAA,iCAEE,kBAAmB,CAMnB,kDAAuC,CAFvC,2DAAgC,CALhC,mBAAoB,CAEpB,gDAA6C,CAE7C,gBAAiB,CAEjB,iBAEF,CAGA,0DAEE,4CAAsC,CADtC,0DAEF,CAEA,2DAEE,8CAAuC,CADvC,2DAEF,CAGA,kEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,4EACE,uEAAiD,CAEjD,gGAAmG,CADnG,2DAEF,CAEA,iEACE,4EAAgD,CAEhD,+FAAkG,CADlG,2DAEF,CAEA,iEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,iEACE,kFAAmD,CAEnD,kGAAqG,CADrG,2DAEF,CAEA,kEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,iEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,4DAEE,qGAAgF,CAEhF,kIACqF,CAFrF,2DAGF,CAEA,iEAEE,qGAAgF,CAEhF,kIACqF,CAFrF,2DAGF,CAEA,kEACE,uEAAiD,CAEjD,gGAAmG,CADnG,2DAEF,CAEA,2DACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,6DACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,2BACE,sCACF,CAEA,oDACE,SACF","file":"StateLabel-47f1e690.css","sourcesContent":[".StateLabel {\n display: inline-flex;\n align-items: center;\n font-weight: var(--base-text-weight-semibold);\n /* stylelint-disable-next-line primer/typography */\n line-height: 16px;\n color: var(--fgColor-onEmphasis);\n text-align: center;\n border-radius: var(--borderRadius-full);\n}\n\n/* Size variants */\n.StateLabel:where([data-size='small']) {\n padding: var(--base-size-4) var(--base-size-8);\n font-size: var(--text-body-size-small);\n}\n\n.StateLabel:where([data-size='medium']) {\n padding: var(--base-size-8) var(--base-size-12);\n font-size: var(--text-body-size-medium);\n}\n\n/* Status color variants */\n.StateLabel:where([data-status='issueClosed']) {\n background-color: var(--bgColor-done-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-done-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='issueClosedNotPlanned']) {\n background-color: var(--bgColor-neutral-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-neutral-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullClosed']) {\n background-color: var(--bgColor-closed-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-closed-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullMerged']) {\n background-color: var(--bgColor-done-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-done-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullQueued']) {\n background-color: var(--bgColor-attention-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-attention-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='issueOpened']) {\n background-color: var(--bgColor-open-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-open-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullOpened']) {\n background-color: var(--bgColor-open-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-open-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='draft']) {\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--bgColor-draft-emphasis, var(--bgColor-neutral-emphasis));\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px)\n var(--borderColor-draft-emphasis, var(--borderColor-neutral-emphasis, transparent));\n}\n\n.StateLabel:where([data-status='issueDraft']) {\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--bgColor-draft-emphasis, var(--bgColor-neutral-emphasis));\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px)\n var(--borderColor-draft-emphasis, var(--borderColor-neutral-emphasis, transparent));\n}\n\n.StateLabel:where([data-status='unavailable']) {\n background-color: var(--bgColor-neutral-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-neutral-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='open']) {\n background-color: var(--bgColor-open-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-open-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='closed']) {\n background-color: var(--bgColor-done-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-done-emphasis, transparent);\n}\n\n.Icon {\n margin-right: var(--base-size-4);\n}\n\n.Icon:where([data-size-small]) {\n width: 1em;\n}\n"]}
package/dist/StateLabel/StateLabel.d.ts CHANGED
@@ -14,11 +14,15 @@ declare const octiconMap: {
14
14
  closed: null;
15
15
  };
16
16
  export type StateLabelProps = React.HTMLAttributes<HTMLSpanElement> & {
17
- variant?: 'small' | 'normal';
17
+ size?: 'small' | 'medium';
18
+ /** @deprecated use size property with value 'small' or 'medium' instead */
19
+ variant?: 'normal' | 'small';
18
20
  status: keyof typeof octiconMap;
19
21
  };
20
22
  declare const StateLabel: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & {
21
- variant?: "small" | "normal";
23
+ size?: "small" | "medium";
24
+ /** @deprecated use size property with value 'small' or 'medium' instead */
25
+ variant?: "normal" | "small";
22
26
  status: keyof typeof octiconMap;
23
27
  } & React.RefAttributes<HTMLSpanElement>>;
24
28
  export default StateLabel;
package/dist/StateLabel/StateLabel.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"StateLabel.d.ts","sourceRoot":"","sources":["../../src/StateLabel/StateLabel.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,QAAA,MAAM,UAAU;;;;;;;;;;;;;CAaf,CAAA;AAiBD,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,GAAG;IACpE,OAAO,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAC5B,MAAM,EAAE,MAAM,OAAO,UAAU,CAAA;CAChC,CAAA;AAED,QAAA,MAAM,UAAU;cAJJ,OAAO,GAAG,QAAQ;YACpB,MAAM,OAAO,UAAU;yCA4BhC,CAAA;AAID,eAAe,UAAU,CAAA"}
1
+ {"version":3,"file":"StateLabel.d.ts","sourceRoot":"","sources":["../../src/StateLabel/StateLabel.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,QAAA,MAAM,UAAU;;;;;;;;;;;;;CAaf,CAAA;AAiBD,MAAM,MAAM,eAAe,GAAG,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,GAAG;IACpE,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IACzB,2EAA2E;IAC3E,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAA;IAC5B,MAAM,EAAE,MAAM,OAAO,UAAU,CAAA;CAChC,CAAA;AAED,QAAA,MAAM,UAAU;WANP,OAAO,GAAG,QAAQ;IACzB,2EAA2E;cACjE,QAAQ,GAAG,OAAO;YACpB,MAAM,OAAO,UAAU;yCA+BhC,CAAA;AAID,eAAe,UAAU,CAAA"}
package/dist/StateLabel/StateLabel.js CHANGED
@@ -35,17 +35,19 @@ const labelMap = {
35
35
  closed: ''
36
36
  };
37
37
  const StateLabel = /*#__PURE__*/forwardRef((t0, ref) => {
38
- const $ = c(20);
38
+ const $ = c(21);
39
39
  let children;
40
40
  let className;
41
41
  let rest;
42
+ let size;
42
43
  let status;
43
- let t1;
44
+ let variant;
44
45
  if ($[0] !== t0) {
45
46
  ({
46
47
  children,
47
48
  status,
48
- variant: t1,
49
+ size,
50
+ variant,
49
51
  className,
50
52
  ...rest
51
53
  } = t0);
@@ -53,62 +55,64 @@ const StateLabel = /*#__PURE__*/forwardRef((t0, ref) => {
53
55
  $[1] = children;
54
56
  $[2] = className;
55
57
  $[3] = rest;
56
- $[4] = status;
57
- $[5] = t1;
58
+ $[4] = size;
59
+ $[5] = status;
60
+ $[6] = variant;
58
61
  } else {
59
62
  children = $[1];
60
63
  className = $[2];
61
64
  rest = $[3];
62
- status = $[4];
63
- t1 = $[5];
65
+ size = $[4];
66
+ status = $[5];
67
+ variant = $[6];
64
68
  }
65
- const variantProp = t1 === undefined ? "normal" : t1;
66
69
  const noIconStatus = status === "open" || status === "closed";
67
- let t2;
68
- if ($[6] !== className) {
69
- t2 = clsx(classes.StateLabel, className);
70
- $[6] = className;
71
- $[7] = t2;
70
+ const inferredSize = size || (variant === "small" ? "small" : "medium");
71
+ let t1;
72
+ if ($[7] !== className) {
73
+ t1 = clsx(classes.StateLabel, className);
74
+ $[7] = className;
75
+ $[8] = t1;
72
76
  } else {
73
- t2 = $[7];
77
+ t1 = $[8];
74
78
  }
75
- let t3;
76
- if ($[8] !== noIconStatus || $[9] !== status || $[10] !== variantProp) {
77
- t3 = !noIconStatus && /*#__PURE__*/jsx(Octicon, {
78
- "data-variant-small": variantProp === "small" ? "" : undefined,
79
+ let t2;
80
+ if ($[9] !== inferredSize || $[10] !== noIconStatus || $[11] !== status) {
81
+ t2 = !noIconStatus && /*#__PURE__*/jsx(Octicon, {
82
+ "data-size-small": inferredSize === "small" ? "" : undefined,
79
83
  icon: octiconMap[status],
80
84
  "aria-label": labelMap[status],
81
85
  className: classes.Icon
82
86
  });
83
- $[8] = noIconStatus;
84
- $[9] = status;
85
- $[10] = variantProp;
86
- $[11] = t3;
87
+ $[9] = inferredSize;
88
+ $[10] = noIconStatus;
89
+ $[11] = status;
90
+ $[12] = t2;
87
91
  } else {
88
- t3 = $[11];
92
+ t2 = $[12];
89
93
  }
90
- let t4;
91
- if ($[12] !== children || $[13] !== ref || $[14] !== rest || $[15] !== status || $[16] !== t2 || $[17] !== t3 || $[18] !== variantProp) {
92
- t4 = /*#__PURE__*/jsxs("span", {
94
+ let t3;
95
+ if ($[13] !== children || $[14] !== inferredSize || $[15] !== ref || $[16] !== rest || $[17] !== status || $[18] !== t1 || $[19] !== t2) {
96
+ t3 = /*#__PURE__*/jsxs("span", {
93
97
  ...rest,
94
98
  ref: ref,
95
- className: t2,
96
- "data-variant": variantProp,
99
+ className: t1,
100
+ "data-size": inferredSize,
97
101
  "data-status": status,
98
- children: [t3, children]
102
+ children: [t2, children]
99
103
  });
100
- $[12] = children;
101
- $[13] = ref;
102
- $[14] = rest;
103
- $[15] = status;
104
- $[16] = t2;
105
- $[17] = t3;
106
- $[18] = variantProp;
107
- $[19] = t4;
104
+ $[13] = children;
105
+ $[14] = inferredSize;
106
+ $[15] = ref;
107
+ $[16] = rest;
108
+ $[17] = status;
109
+ $[18] = t1;
110
+ $[19] = t2;
111
+ $[20] = t3;
108
112
  } else {
109
- t4 = $[19];
113
+ t3 = $[20];
110
114
  }
111
- return t4;
115
+ return t3;
112
116
  });
113
117
  StateLabel.displayName = 'StateLabel';
114
118
 
package/dist/StateLabel/StateLabel.module.css.js CHANGED
@@ -1,4 +1,4 @@
1
- import './StateLabel-b586b0bc.css';
1
+ import './StateLabel-47f1e690.css';
2
2
 
3
3
  var classes = {"StateLabel":"prc-StateLabel-StateLabel-ukDwa","Icon":"prc-StateLabel-Icon-NuDm4"};
4
4
 
package/dist/TooltipV2/Tooltip.d.ts CHANGED
@@ -14,6 +14,16 @@ export type TooltipProps = React.PropsWithChildren<{
14
14
  * long (1200ms)
15
15
  */
16
16
  delay?: 'short' | 'medium' | 'long';
17
+ /**
18
+ * Private API for use internally only. Prevents the tooltip from opening if `true`.
19
+ *
20
+ * Accessibility note: This prop should be used with caution. Only use when needing to
21
+ * programmatically close the tooltip in response to a specific user action, such as
22
+ * opening a menu, or content where the tooltip could overlap with interactive content.
23
+ *
24
+ * @default false
25
+ */
26
+ _privateDisableTooltip?: boolean;
17
27
  }> & React.HTMLAttributes<HTMLElement>;
18
28
  export declare const TooltipContext: React.Context<{
19
29
  tooltipId?: string;
package/dist/TooltipV2/Tooltip.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/TooltipV2/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiD,KAAK,yBAAyB,EAAC,MAAM,OAAO,CAAA;AAS3G,OAAO,EAAoD,KAAK,mBAAmB,EAAC,MAAM,mBAAmB,CAAA;AAG7G,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,gBAAgB,CAAA;AAE9C,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,GAAG,GAAG,IAAI,GAAG,GAAG,GAAG,IAAI,GAAG,GAAG,GAAG,IAAI,GAAG,GAAG,CAAA;AAChF,MAAM,MAAM,YAAY,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACjD,SAAS,CAAC,EAAE,gBAAgB,CAAA;IAC5B,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,OAAO,GAAG,aAAa,CAAA;IAC9B,cAAc,CAAC,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAA;IAC5C;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAA;CACpC,CAAC,GACA,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;AAiEnC,eAAO,MAAM,cAAc;gBAAoC,MAAM;EAAM,CAAA;AAE3E,eAAO,MAAM,OAAO,EAAE,yBAAyB,CAC7C,KAAK,CAAC,eAAe,CAAC,YAAY,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CACvE,GACC,UA6QD,CAAA"}
1
+ {"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/TooltipV2/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAiD,KAAK,yBAAyB,EAAC,MAAM,OAAO,CAAA;AAS3G,OAAO,EAAoD,KAAK,mBAAmB,EAAC,MAAM,mBAAmB,CAAA;AAG7G,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,gBAAgB,CAAA;AAE9C,MAAM,MAAM,gBAAgB,GAAG,IAAI,GAAG,GAAG,GAAG,IAAI,GAAG,GAAG,GAAG,IAAI,GAAG,GAAG,GAAG,IAAI,GAAG,GAAG,CAAA;AAChF,MAAM,MAAM,YAAY,GAAG,KAAK,CAAC,iBAAiB,CAAC;IACjD,SAAS,CAAC,EAAE,gBAAgB,CAAA;IAC5B,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,OAAO,GAAG,aAAa,CAAA;IAC9B,cAAc,CAAC,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAA;IAC5C;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAA;IACnC;;;;;;;;OAQG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAA;CACjC,CAAC,GACA,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;AAiEnC,eAAO,MAAM,cAAc;gBAAoC,MAAM;EAAM,CAAA;AAE3E,eAAO,MAAM,OAAO,EAAE,yBAAyB,CAC7C,KAAK,CAAC,eAAe,CAAC,YAAY,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CACvE,GACC,UA+QD,CAAA"}
package/dist/TooltipV2/Tooltip.js CHANGED
@@ -85,6 +85,7 @@ const Tooltip = /*#__PURE__*/React.forwardRef(({
85
85
  className,
86
86
  keybindingHint,
87
87
  delay = 'short',
88
+ _privateDisableTooltip = false,
88
89
  ...rest
89
90
  }, forwardedRef) => {
90
91
  const tooltipId = useId(id);
@@ -100,7 +101,7 @@ const Tooltip = /*#__PURE__*/React.forwardRef(({
100
101
  } = useSafeTimeout();
101
102
  const openTooltip = () => {
102
103
  try {
103
- if (tooltipElRef.current && triggerRef.current && tooltipElRef.current.hasAttribute('popover') && !tooltipElRef.current.matches(':popover-open')) {
104
+ if (tooltipElRef.current && triggerRef.current && tooltipElRef.current.hasAttribute('popover') && !tooltipElRef.current.matches(':popover-open') && !_privateDisableTooltip) {
104
105
  const tooltip = tooltipElRef.current;
105
106
  const trigger = triggerRef.current;
106
107
  tooltip.showPopover();
package/generated/components.json CHANGED
@@ -6754,7 +6754,7 @@
6754
6754
  },
6755
6755
  {
6756
6756
  "id": "components-statelabel-features--small",
6757
- "code": "() => (\n <StateLabel status=\"issueOpened\" variant=\"small\">\n Open\n </StateLabel>\n)"
6757
+ "code": "() => (\n <StateLabel status=\"issueOpened\" size=\"small\">\n Open\n </StateLabel>\n)"
6758
6758
  },
6759
6759
  {
6760
6760
  "id": "components-statelabel-features--open",
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@primer/react",
3
3
  "type": "module",
4
- "version": "38.1.1-rc.a581ae5ff",
4
+ "version": "38.2.0-rc.56f1b2a27",
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",
package/dist/StateLabel/StateLabel-b586b0bc.css DELETED
@@ -1,2 +0,0 @@
1
- .prc-StateLabel-StateLabel-ukDwa{align-items:center;border-radius:var(--borderRadius-full,624.9375rem);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis));display:inline-flex;font-weight:var(--base-text-weight-semibold,600);line-height:16px;text-align:center}.prc-StateLabel-StateLabel-ukDwa:where([data-variant=small]){font-size:var(--text-body-size-small,.75rem);padding:var(--base-size-4,.25rem) var(--base-size-8,.5rem)}.prc-StateLabel-StateLabel-ukDwa:where([data-variant=normal]){font-size:var(--text-body-size-medium,.875rem);padding:var(--base-size-8,.5rem) var(--base-size-12,.75rem)}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueClosed]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueClosedNotPlanned]){background-color:var(--bgColor-neutral-emphasis,var(--color-fg-subtle));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-neutral-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullClosed]){background-color:var(--bgColor-closed-emphasis,var(--color-closed-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-closed-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullMerged]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullQueued]){background-color:var(--bgColor-attention-emphasis,var(--color-attention-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-attention-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueOpened]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=pullOpened]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=draft]){background-color:var(--bgColor-draft-emphasis,var(--bgColor-neutral-emphasis,var(--color-fg-subtle)));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-draft-emphasis,var(--borderColor-neutral-emphasis,transparent));color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=issueDraft]){background-color:var(--bgColor-draft-emphasis,var(--bgColor-neutral-emphasis,var(--color-fg-subtle)));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-draft-emphasis,var(--borderColor-neutral-emphasis,transparent));color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=unavailable]){background-color:var(--bgColor-neutral-emphasis,var(--color-fg-subtle));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-neutral-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=open]){background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-open-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-StateLabel-ukDwa:where([data-status=closed]){background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin,inset 0 0 0 1px) var(--borderColor-done-emphasis,transparent);color:var(--fgColor-onEmphasis,var(--color-fg-on-emphasis))}.prc-StateLabel-Icon-NuDm4{margin-right:var(--base-size-4,.25rem)}.prc-StateLabel-Icon-NuDm4:where([data-variant-small]){width:1em}
2
- /*# sourceMappingURL=StateLabel-b586b0bc.css.map */
package/dist/StateLabel/StateLabel-b586b0bc.css.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/StateLabel/StateLabel.module.css"],"names":[],"mappings":"AAAA,iCAEE,kBAAmB,CAMnB,kDAAuC,CAFvC,2DAAgC,CALhC,mBAAoB,CAEpB,gDAA6C,CAE7C,gBAAiB,CAEjB,iBAEF,CAGA,6DAEE,4CAAsC,CADtC,0DAEF,CAEA,8DAEE,8CAAuC,CADvC,2DAEF,CAGA,kEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,4EACE,uEAAiD,CAEjD,gGAAmG,CADnG,2DAEF,CAEA,iEACE,4EAAgD,CAEhD,+FAAkG,CADlG,2DAEF,CAEA,iEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,iEACE,kFAAmD,CAEnD,kGAAqG,CADrG,2DAEF,CAEA,kEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,iEACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,4DAEE,qGAAgF,CAEhF,kIACqF,CAFrF,2DAGF,CAEA,iEAEE,qGAAgF,CAEhF,kIACqF,CAFrF,2DAGF,CAEA,kEACE,uEAAiD,CAEjD,gGAAmG,CADnG,2DAEF,CAEA,2DACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,6DACE,wEAA8C,CAE9C,6FAAgG,CADhG,2DAEF,CAEA,2BACE,sCACF,CAEA,uDACE,SACF","file":"StateLabel-b586b0bc.css","sourcesContent":[".StateLabel {\n display: inline-flex;\n align-items: center;\n font-weight: var(--base-text-weight-semibold);\n /* stylelint-disable-next-line primer/typography */\n line-height: 16px;\n color: var(--fgColor-onEmphasis);\n text-align: center;\n border-radius: var(--borderRadius-full);\n}\n\n/* Size variants */\n.StateLabel:where([data-variant='small']) {\n padding: var(--base-size-4) var(--base-size-8);\n font-size: var(--text-body-size-small);\n}\n\n.StateLabel:where([data-variant='normal']) {\n padding: var(--base-size-8) var(--base-size-12);\n font-size: var(--text-body-size-medium);\n}\n\n/* Status color variants */\n.StateLabel:where([data-status='issueClosed']) {\n background-color: var(--bgColor-done-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-done-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='issueClosedNotPlanned']) {\n background-color: var(--bgColor-neutral-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-neutral-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullClosed']) {\n background-color: var(--bgColor-closed-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-closed-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullMerged']) {\n background-color: var(--bgColor-done-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-done-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullQueued']) {\n background-color: var(--bgColor-attention-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-attention-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='issueOpened']) {\n background-color: var(--bgColor-open-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-open-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='pullOpened']) {\n background-color: var(--bgColor-open-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-open-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='draft']) {\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--bgColor-draft-emphasis, var(--bgColor-neutral-emphasis));\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px)\n var(--borderColor-draft-emphasis, var(--borderColor-neutral-emphasis, transparent));\n}\n\n.StateLabel:where([data-status='issueDraft']) {\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--bgColor-draft-emphasis, var(--bgColor-neutral-emphasis));\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px)\n var(--borderColor-draft-emphasis, var(--borderColor-neutral-emphasis, transparent));\n}\n\n.StateLabel:where([data-status='unavailable']) {\n background-color: var(--bgColor-neutral-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-neutral-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='open']) {\n background-color: var(--bgColor-open-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-open-emphasis, transparent);\n}\n\n.StateLabel:where([data-status='closed']) {\n background-color: var(--bgColor-done-emphasis);\n color: var(--fgColor-onEmphasis);\n box-shadow: var(--boxShadow-thin, inset 0 0 0 1px) var(--borderColor-done-emphasis, transparent);\n}\n\n.Icon {\n margin-right: var(--base-size-4);\n}\n\n.Icon:where([data-variant-small]) {\n width: 1em;\n}\n"]}