@primer/react 38.1.1-rc.a581ae5ff → 38.2.0-rc.4eefb9375

package/CHANGELOG.md

@@ -1,6 +1,12 @@
 # @primer/react
 
-## 38.1.1
+## 38.2.0
+
+### Minor Changes
+
+- [#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.
+
+- [#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`.
 
 ### Patch Changes
 

package/dist/BranchName/BranchName.js

@@ -58,6 +58,6 @@ function BranchName(props, ref) {
   return t2;
 }
 BranchName.displayName = 'BranchName';
-var BranchName$1 = fixedForwardRef(BranchName);
+var BranchName_default = fixedForwardRef(BranchName);
 
-export { BranchName$1 as default };
+export { BranchName_default as default };

package/dist/Breadcrumbs/Breadcrumbs.js

@@ -454,7 +454,7 @@ function BreadcrumbsItemComponent(props, ref) {
 BreadcrumbsItemComponent.displayName = 'Breadcrumbs.Item';
 const BreadcrumbsItem = /*#__PURE__*/React.forwardRef(BreadcrumbsItemComponent);
 Breadcrumbs.displayName = 'Breadcrumbs';
-var Breadcrumbs$1 = Object.assign(Breadcrumbs, {
+var Breadcrumbs_default = Object.assign(Breadcrumbs, {
   Item: BreadcrumbsItem
 });
 
@@ -485,4 +485,4 @@ function _temp(item, index) {
 }
 _temp.displayName = "_temp";
 
-export { Breadcrumb, Breadcrumbs$1 as default };
+export { Breadcrumb, Breadcrumbs_default as default };

package/dist/Button/IconButton.d.ts.map

@@ -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"}
+{"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

@@ -27,7 +27,15 @@ const IconButton = /*#__PURE__*/forwardRef(({
     tooltipId: tooltipIdV1
   } = React.useContext(TooltipContext$1); // Tooltip v1
 
+  const {
+    'aria-expanded': isExpanded,
+    'aria-haspopup': hasPopup
+  } = props;
   const hasExternalTooltip = tooltipId || tooltipIdV1;
+
+  // If the button has an active "popup" (like a menu), we don't want to show the tooltip.
+  // This is mostly for `ActionMenu`, but could be applicable elsewhere.
+  const hasActivePopup = (isExpanded === true || isExpanded === 'true') && hasPopup === 'true';
   const withoutTooltip = unsafeDisableTooltip || disabled || ariaLabel === undefined || ariaLabel === '' || hasExternalTooltip;
   if (withoutTooltip) {
     return /*#__PURE__*/jsx(ButtonBase, {
@@ -49,6 +57,7 @@ const IconButton = /*#__PURE__*/forwardRef(({
       type: description ? undefined : 'label',
       direction: tooltipDirection,
       keybindingHint: keybindingHint !== null && keybindingHint !== void 0 ? keybindingHint : keyshortcuts,
+      _privateDisableTooltip: hasActivePopup,
       children: /*#__PURE__*/jsx(ButtonBase, {
         icon: Icon,
         className: clsx(className, classes.IconButton),

package/dist/CheckboxGroup/CheckboxGroup.js

@@ -121,7 +121,7 @@ const CheckboxGroup = t0 => {
   }
   return t6;
 };
-var CheckboxGroup$1 = Object.assign(CheckboxGroup, {
+var CheckboxGroup_default = Object.assign(CheckboxGroup, {
   Caption: CheckboxOrRadioGroupCaption,
   Label: CheckboxOrRadioGroupLabel,
   Validation: CheckboxOrRadioGroupValidation
@@ -140,4 +140,4 @@ function _temp4(checkbox) {
   return /*#__PURE__*/React.isValidElement(checkbox) && (checkbox.props.checked || checkbox.props.defaultChecked) && checkbox.props.value;
 }
 
-export { CheckboxGroupContext, CheckboxGroup$1 as default };
+export { CheckboxGroupContext, CheckboxGroup_default as default };

package/dist/CircleBadge/CircleBadge.js

@@ -90,8 +90,8 @@ CircleBadgeIcon.displayName = 'CircleBadge.Icon';
  * @deprecated This component is deprecated.
  * Replace component with specific icon imports from `@primer/octicons-react` and customized styling.
  */
-var CircleBadge$1 = Object.assign(CircleBadge, {
+var CircleBadge_default = Object.assign(CircleBadge, {
   Icon: CircleBadgeIcon
 });
 
-export { CircleBadge$1 as default };
+export { CircleBadge_default as default };

package/dist/Header/Header.js

@@ -163,9 +163,9 @@ const HeaderLink = /*#__PURE__*/React.forwardRef(function HeaderLink(t0, forward
   return t3;
 });
 HeaderLink.displayName = 'Header.Link';
-var Header$1 = Object.assign(Header, {
+var Header_default = Object.assign(Header, {
   Link: HeaderLink,
   Item: HeaderItem
 });
 
-export { Header$1 as default };
+export { Header_default as default };

package/dist/Popover/Popover.js

@@ -148,9 +148,9 @@ const PopoverContent = t0 => {
   return t6;
 };
 PopoverContent.displayName = 'Popover.Content';
-var Popover$1 = Object.assign(Popover, {
+var Popover_default = Object.assign(Popover, {
   Content: PopoverContent
 });
 function _temp() {}
 
-export { Popover$1 as default };
+export { Popover_default as default };

package/dist/RadioGroup/RadioGroup.js

@@ -112,11 +112,11 @@ const RadioGroup = t0 => {
   }
   return t5;
 };
-var RadioGroup$1 = Object.assign(RadioGroup, {
+var RadioGroup_default = Object.assign(RadioGroup, {
   __SLOT__: Symbol('RadioGroup'),
   Caption: CheckboxOrRadioGroupCaption,
   Label: CheckboxOrRadioGroupLabel,
   Validation: CheckboxOrRadioGroupValidation
 });
 
-export { RadioGroupContext, RadioGroup$1 as default };
+export { RadioGroupContext, RadioGroup_default as default };

package/dist/SideNav.js

@@ -46,8 +46,8 @@ const SideNavLink = ({
 SideNavLink.displayName = "SideNavLink";
 SideNavLink.displayName = 'SideNav.Link';
 /** @deprecated Use [NavList](https://primer.style/react/NavList) instead */
-var SideNav$1 = Object.assign(SideNav, {
+var SideNav_default = Object.assign(SideNav, {
   Link: SideNavLink
 });
 
-export { SideNav$1 as default };
+export { SideNav_default as default };

package/dist/StateLabel/StateLabel-47f1e690.css

@@ -0,0 +1,2 @@
+.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}
+/*# sourceMappingURL=StateLabel-47f1e690.css.map */

package/dist/StateLabel/StateLabel-47f1e690.css.map

@@ -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,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

@@ -14,11 +14,15 @@ declare const octiconMap: {
     closed: null;
 };
 export type StateLabelProps = React.HTMLAttributes<HTMLSpanElement> & {
-    variant?: 'small' | 'normal';
+    size?: 'small' | 'medium';
+    /** @deprecated use size property with value 'small' or 'medium' instead */
+    variant?: 'normal' | 'small';
     status: keyof typeof octiconMap;
 };
 declare const StateLabel: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & {
-    variant?: "small" | "normal";
+    size?: "small" | "medium";
+    /** @deprecated use size property with value 'small' or 'medium' instead */
+    variant?: "normal" | "small";
     status: keyof typeof octiconMap;
 } & React.RefAttributes<HTMLSpanElement>>;
 export default StateLabel;

package/dist/StateLabel/StateLabel.d.ts.map

@@ -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"}
+{"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

@@ -35,17 +35,19 @@ const labelMap = {
   closed: ''
 };
 const StateLabel = /*#__PURE__*/forwardRef((t0, ref) => {
-  const $ = c(20);
+  const $ = c(21);
   let children;
   let className;
   let rest;
+  let size;
   let status;
-  let t1;
+  let variant;
   if ($[0] !== t0) {
     ({
       children,
       status,
-      variant: t1,
+      size,
+      variant,
       className,
       ...rest
     } = t0);
@@ -53,62 +55,64 @@ const StateLabel = /*#__PURE__*/forwardRef((t0, ref) => {
     $[1] = children;
     $[2] = className;
     $[3] = rest;
-    $[4] = status;
-    $[5] = t1;
+    $[4] = size;
+    $[5] = status;
+    $[6] = variant;
   } else {
     children = $[1];
     className = $[2];
     rest = $[3];
-    status = $[4];
-    t1 = $[5];
+    size = $[4];
+    status = $[5];
+    variant = $[6];
   }
-  const variantProp = t1 === undefined ? "normal" : t1;
   const noIconStatus = status === "open" || status === "closed";
-  let t2;
-  if ($[6] !== className) {
-    t2 = clsx(classes.StateLabel, className);
-    $[6] = className;
-    $[7] = t2;
+  const inferredSize = size || (variant === "small" ? "small" : "medium");
+  let t1;
+  if ($[7] !== className) {
+    t1 = clsx(classes.StateLabel, className);
+    $[7] = className;
+    $[8] = t1;
   } else {
-    t2 = $[7];
+    t1 = $[8];
   }
-  let t3;
-  if ($[8] !== noIconStatus || $[9] !== status || $[10] !== variantProp) {
-    t3 = !noIconStatus && /*#__PURE__*/jsx(Octicon, {
-      "data-variant-small": variantProp === "small" ? "" : undefined,
+  let t2;
+  if ($[9] !== inferredSize || $[10] !== noIconStatus || $[11] !== status) {
+    t2 = !noIconStatus && /*#__PURE__*/jsx(Octicon, {
+      "data-size-small": inferredSize === "small" ? "" : undefined,
       icon: octiconMap[status],
       "aria-label": labelMap[status],
       className: classes.Icon
     });
-    $[8] = noIconStatus;
-    $[9] = status;
-    $[10] = variantProp;
-    $[11] = t3;
+    $[9] = inferredSize;
+    $[10] = noIconStatus;
+    $[11] = status;
+    $[12] = t2;
   } else {
-    t3 = $[11];
+    t2 = $[12];
   }
-  let t4;
-  if ($[12] !== children || $[13] !== ref || $[14] !== rest || $[15] !== status || $[16] !== t2 || $[17] !== t3 || $[18] !== variantProp) {
-    t4 = /*#__PURE__*/jsxs("span", {
+  let t3;
+  if ($[13] !== children || $[14] !== inferredSize || $[15] !== ref || $[16] !== rest || $[17] !== status || $[18] !== t1 || $[19] !== t2) {
+    t3 = /*#__PURE__*/jsxs("span", {
       ...rest,
       ref: ref,
-      className: t2,
-      "data-variant": variantProp,
+      className: t1,
+      "data-size": inferredSize,
       "data-status": status,
-      children: [t3, children]
+      children: [t2, children]
     });
-    $[12] = children;
-    $[13] = ref;
-    $[14] = rest;
-    $[15] = status;
-    $[16] = t2;
-    $[17] = t3;
-    $[18] = variantProp;
-    $[19] = t4;
+    $[13] = children;
+    $[14] = inferredSize;
+    $[15] = ref;
+    $[16] = rest;
+    $[17] = status;
+    $[18] = t1;
+    $[19] = t2;
+    $[20] = t3;
   } else {
-    t4 = $[19];
+    t3 = $[20];
   }
-  return t4;
+  return t3;
 });
 StateLabel.displayName = 'StateLabel';
 

package/dist/StateLabel/StateLabel.module.css.js

@@ -1,4 +1,4 @@
-import './StateLabel-b586b0bc.css';
+import './StateLabel-47f1e690.css';
 
 var classes = {"StateLabel":"prc-StateLabel-StateLabel-ukDwa","Icon":"prc-StateLabel-Icon-NuDm4"};
 

package/dist/SubNav/SubNav.js

@@ -193,11 +193,11 @@ const SubNavLink = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
   return t2;
 });
 SubNavLink.displayName = 'SubNav.Link';
-var SubNav$1 = Object.assign(SubNav, {
+var SubNav_default = Object.assign(SubNav, {
   Link: SubNavLink,
   Links: SubNavLinks,
   __SLOT__: Symbol('SubNav')
 });
 SubNavLink.__SLOT__ = Symbol('SubNav.Link');
 
-export { SubNav$1 as default };
+export { SubNav_default as default };

package/dist/TabNav/TabNav.js

@@ -201,8 +201,8 @@ const TabNavLink = /*#__PURE__*/React.forwardRef(function TabNavLink(t0, ref) {
   return t6;
 });
 TabNavLink.displayName = 'TabNav.Link';
-var TabNav$1 = Object.assign(TabNav, {
+var TabNav_default = Object.assign(TabNav, {
   Link: TabNavLink
 });
 
-export { TabNav$1 as default };
+export { TabNav_default as default };

package/dist/Timeline/Timeline.js

@@ -229,11 +229,11 @@ const TimelineBreak = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
   return t2;
 });
 TimelineBreak.displayName = 'TimelineBreak';
-var Timeline$1 = Object.assign(Timeline, {
+var Timeline_default = Object.assign(Timeline, {
   Item: TimelineItem,
   Badge: TimelineBadge,
   Body: TimelineBody,
   Break: TimelineBreak
 });
 
-export { Timeline$1 as default };
+export { Timeline_default as default };

package/dist/TooltipV2/Tooltip.d.ts

@@ -14,6 +14,16 @@ export type TooltipProps = React.PropsWithChildren<{
      * long (1200ms)
      */
     delay?: 'short' | 'medium' | 'long';
+    /**
+     * Private API for use internally only. Prevents the tooltip from opening if `true`.
+     *
+     * Accessibility note: This prop should be used with caution. Only use when needing to
+     * programmatically close the tooltip in response to a specific user action, such as
+     * opening a menu, or content where the tooltip could overlap with interactive content.
+     *
+     * @default false
+     */
+    _privateDisableTooltip?: boolean;
 }> & React.HTMLAttributes<HTMLElement>;
 export declare const TooltipContext: React.Context<{
     tooltipId?: string;

package/dist/TooltipV2/Tooltip.d.ts.map

@@ -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"}
+{"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

@@ -85,6 +85,7 @@ const Tooltip = /*#__PURE__*/React.forwardRef(({
   className,
   keybindingHint,
   delay = 'short',
+  _privateDisableTooltip = false,
   ...rest
 }, forwardedRef) => {
   const tooltipId = useId(id);
@@ -100,7 +101,7 @@ const Tooltip = /*#__PURE__*/React.forwardRef(({
   } = useSafeTimeout();
   const openTooltip = () => {
     try {
-      if (tooltipElRef.current && triggerRef.current && tooltipElRef.current.hasAttribute('popover') && !tooltipElRef.current.matches(':popover-open')) {
+      if (tooltipElRef.current && triggerRef.current && tooltipElRef.current.hasAttribute('popover') && !tooltipElRef.current.matches(':popover-open') && !_privateDisableTooltip) {
         const tooltip = tooltipElRef.current;
         const trigger = triggerRef.current;
         tooltip.showPopover();

package/dist/deprecated/DialogV1/Dialog.js

@@ -200,8 +200,8 @@ const Dialog = /*#__PURE__*/forwardRef((t0, forwardedRef) => {
 });
 DialogHeader.displayName = 'Dialog.Header';
 Dialog.displayName = 'Dialog';
-var Dialog$1 = Object.assign(Dialog, {
+var Dialog_default = Object.assign(Dialog, {
   Header: DialogHeader
 });
 
-export { Dialog$1 as default };
+export { Dialog_default as default };

package/dist/deprecated/UnderlineNav/UnderlineNav.js

@@ -158,8 +158,8 @@ UnderlineNavLink.displayName = 'UnderlineNav.Link';
 /**
  * @deprecated UnderlineNav is deprecated and will be replaced by the draft `UnderlineNav` in the next major release. See https://primer.style/react/drafts/UnderlineNav2 for more details.
  */
-var UnderlineNav$1 = Object.assign(UnderlineNav, {
+var UnderlineNav_default = Object.assign(UnderlineNav, {
   Link: UnderlineNavLink
 });
 
-export { UnderlineNav$1 as default };
+export { UnderlineNav_default as default };

package/dist/experimental/UnderlinePanels/UnderlinePanels.js

@@ -209,7 +209,7 @@ const Panel = t0 => {
   return t1;
 };
 Panel.displayName = 'UnderlinePanels.Panel';
-var UnderlinePanels$1 = Object.assign(UnderlinePanels, {
+var UnderlinePanels_default = Object.assign(UnderlinePanels, {
   Panel,
   Tab
 });
@@ -217,4 +217,4 @@ UnderlinePanels.__SLOT__ = Symbol('UnderlinePanels');
 Tab.__SLOT__ = Symbol('UnderlinePanels.Tab');
 Panel.__SLOT__ = Symbol('UnderlinePanels.Panel');
 
-export { UnderlinePanels$1 as default };
+export { UnderlinePanels_default as default };

package/generated/components.json

@@ -6754,7 +6754,7 @@
         },
         {
           "id": "components-statelabel-features--small",
-          "code": "() => (\n  <StateLabel status=\"issueOpened\" variant=\"small\">\n    Open\n  </StateLabel>\n)"
+          "code": "() => (\n  <StateLabel status=\"issueOpened\" size=\"small\">\n    Open\n  </StateLabel>\n)"
         },
         {
           "id": "components-statelabel-features--open",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@primer/react",
   "type": "module",
-  "version": "38.1.1-rc.a581ae5ff",
+  "version": "38.2.0-rc.4eefb9375",
   "description": "An implementation of GitHub's Primer Design System using React",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -74,7 +74,7 @@
   },
   "dependencies": {
     "@github/mini-throttle": "^2.1.1",
-    "@github/relative-time-element": "^4.4.5",
+    "@github/relative-time-element": "^4.5.0",
     "@github/tab-container-element": "^4.8.2",
     "@lit-labs/react": "1.2.1",
     "@oddbird/popover-polyfill": "^0.5.2",
@@ -107,10 +107,10 @@
     "@primer/css": "^21.5.1",
     "@primer/doc-gen": "^0.0.1",
     "@rollup/plugin-babel": "6.1.0",
-    "@rollup/plugin-commonjs": "28.0.9",
+    "@rollup/plugin-commonjs": "29.0.0",
     "@rollup/plugin-json": "6.1.0",
     "@rollup/plugin-node-resolve": "16.0.3",
-    "@rollup/plugin-replace": "6.0.2",
+    "@rollup/plugin-replace": "6.0.3",
     "@rollup/plugin-terser": "0.4.4",
     "@rollup/plugin-typescript": "12.3.0",
     "@rollup/plugin-virtual": "3.0.2",
@@ -170,7 +170,7 @@
     "react-is": "18.3.1",
     "recast": "0.23.7",
     "rimraf": "5.0.5",
-    "rollup": "4.52.5",
+    "rollup": "4.53.1",
     "rollup-plugin-import-css": "^0.0.0",
     "rollup-plugin-postcss": "4.0.2",
     "rollup-plugin-visualizer": "6.0.5",

package/dist/StateLabel/StateLabel-b586b0bc.css

@@ -1,2 +0,0 @@
-.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}
-/*# sourceMappingURL=StateLabel-b586b0bc.css.map */

package/dist/StateLabel/StateLabel-b586b0bc.css.map

@@ -1 +0,0 @@
-{"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"]}