@primer/react 38.27.0 → 38.28.0-rc.5b1595e6f

package/dist/Timeline/Timeline.js

@@ -3,6 +3,7 @@ import { clsx } from 'clsx';
 import React from 'react';
 import classes from './Timeline.module.css.js';
 import { jsx } from 'react/jsx-runtime';
+import { useFeatureFlag } from '../FeatureFlags/useFeatureFlag.js';
 
 function resolveClipSidebar(clipSidebar) {
   if (clipSidebar === true || clipSidebar === 'both') return 'both';
@@ -10,7 +11,7 @@ function resolveClipSidebar(clipSidebar) {
   return undefined;
 }
 const Timeline = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
-  const $ = c(13);
+  const $ = c(20);
   let className;
   let clipSidebar;
   let props;
@@ -29,6 +30,7 @@ const Timeline = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
     clipSidebar = $[2];
     props = $[3];
   }
+  const useListSemantics = useFeatureFlag("primer_react_timeline_list_semantics");
   let t1;
   if ($[4] !== clipSidebar) {
     t1 = resolveClipSidebar(clipSidebar);
@@ -38,31 +40,62 @@ const Timeline = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
     t1 = $[5];
   }
   const resolvedClipSidebar = t1;
-  let t2;
-  if ($[6] !== className) {
-    t2 = clsx(className, classes.Timeline);
-    $[6] = className;
-    $[7] = t2;
-  } else {
-    t2 = $[7];
+  if (useListSemantics) {
+    let t2;
+    if ($[6] !== className) {
+      t2 = clsx(className, classes.Timeline);
+      $[6] = className;
+      $[7] = t2;
+    } else {
+      t2 = $[7];
+    }
+    const t3 = forwardRef;
+    let t4;
+    if ($[8] !== props || $[9] !== resolvedClipSidebar || $[10] !== t2 || $[11] !== t3) {
+      t4 = /*#__PURE__*/jsx("ol", {
+        ...props,
+        role: "list",
+        className: t2,
+        ref: t3,
+        "data-clip-sidebar": resolvedClipSidebar
+      });
+      $[8] = props;
+      $[9] = resolvedClipSidebar;
+      $[10] = t2;
+      $[11] = t3;
+      $[12] = t4;
+    } else {
+      t4 = $[12];
+    }
+    return t4;
   }
+  const t2 = props;
   let t3;
-  if ($[8] !== forwardRef || $[9] !== props || $[10] !== resolvedClipSidebar || $[11] !== t2) {
-    t3 = /*#__PURE__*/jsx("div", {
-      ...props,
-      className: t2,
-      ref: forwardRef,
+  if ($[13] !== className) {
+    t3 = clsx(className, classes.Timeline);
+    $[13] = className;
+    $[14] = t3;
+  } else {
+    t3 = $[14];
+  }
+  const t4 = forwardRef;
+  let t5;
+  if ($[15] !== resolvedClipSidebar || $[16] !== t2 || $[17] !== t3 || $[18] !== t4) {
+    t5 = /*#__PURE__*/jsx("div", {
+      ...t2,
+      className: t3,
+      ref: t4,
       "data-clip-sidebar": resolvedClipSidebar
     });
-    $[8] = forwardRef;
-    $[9] = props;
-    $[10] = resolvedClipSidebar;
-    $[11] = t2;
-    $[12] = t3;
+    $[15] = resolvedClipSidebar;
+    $[16] = t2;
+    $[17] = t3;
+    $[18] = t4;
+    $[19] = t5;
   } else {
-    t3 = $[12];
+    t5 = $[19];
   }
-  return t3;
+  return t5;
 });
 Timeline.displayName = 'Timeline';
 
@@ -71,7 +104,7 @@ Timeline.displayName = 'Timeline';
  */
 
 const TimelineItem = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
-  const $ = c(11);
+  const $ = c(18);
   let className;
   let condensed;
   let props;
@@ -90,32 +123,64 @@ const TimelineItem = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
     condensed = $[2];
     props = $[3];
   }
-  let t1;
-  if ($[4] !== className) {
-    t1 = clsx(className, "Timeline-Item", classes.TimelineItem);
-    $[4] = className;
-    $[5] = t1;
+  const useListSemantics = useFeatureFlag("primer_react_timeline_list_semantics");
+  if (useListSemantics) {
+    let t1;
+    if ($[4] !== className) {
+      t1 = clsx(className, "Timeline-Item", classes.TimelineItem);
+      $[4] = className;
+      $[5] = t1;
+    } else {
+      t1 = $[5];
+    }
+    const t2 = forwardRef;
+    const t3 = condensed ? "" : undefined;
+    let t4;
+    if ($[6] !== props || $[7] !== t1 || $[8] !== t2 || $[9] !== t3) {
+      t4 = /*#__PURE__*/jsx("li", {
+        ...props,
+        className: t1,
+        ref: t2,
+        "data-condensed": t3
+      });
+      $[6] = props;
+      $[7] = t1;
+      $[8] = t2;
+      $[9] = t3;
+      $[10] = t4;
+    } else {
+      t4 = $[10];
+    }
+    return t4;
+  }
+  const t1 = props;
+  let t2;
+  if ($[11] !== className) {
+    t2 = clsx(className, "Timeline-Item", classes.TimelineItem);
+    $[11] = className;
+    $[12] = t2;
   } else {
-    t1 = $[5];
+    t2 = $[12];
   }
-  const t2 = condensed ? "" : undefined;
-  let t3;
-  if ($[6] !== forwardRef || $[7] !== props || $[8] !== t1 || $[9] !== t2) {
-    t3 = /*#__PURE__*/jsx("div", {
-      ...props,
-      className: t1,
-      ref: forwardRef,
-      "data-condensed": t2
+  const t3 = forwardRef;
+  const t4 = condensed ? "" : undefined;
+  let t5;
+  if ($[13] !== t1 || $[14] !== t2 || $[15] !== t3 || $[16] !== t4) {
+    t5 = /*#__PURE__*/jsx("div", {
+      ...t1,
+      className: t2,
+      ref: t3,
+      "data-condensed": t4
     });
-    $[6] = forwardRef;
-    $[7] = props;
-    $[8] = t1;
-    $[9] = t2;
-    $[10] = t3;
+    $[13] = t1;
+    $[14] = t2;
+    $[15] = t3;
+    $[16] = t4;
+    $[17] = t5;
   } else {
-    t3 = $[10];
+    t5 = $[17];
   }
-  return t3;
+  return t5;
 });
 TimelineItem.displayName = 'TimelineItem';
 const TimelineBadge = t0 => {
@@ -208,7 +273,7 @@ const TimelineBody = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
 });
 TimelineBody.displayName = 'TimelineBody';
 const TimelineBreak = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
-  const $ = c(9);
+  const $ = c(15);
   let className;
   let props;
   if ($[0] !== t0) {
@@ -223,29 +288,59 @@ const TimelineBreak = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {
     className = $[1];
     props = $[2];
   }
-  let t1;
-  if ($[3] !== className) {
-    t1 = clsx(className, classes.TimelineBreak);
-    $[3] = className;
-    $[4] = t1;
-  } else {
-    t1 = $[4];
+  const useListSemantics = useFeatureFlag("primer_react_timeline_list_semantics");
+  if (useListSemantics) {
+    let t1;
+    if ($[3] !== className) {
+      t1 = clsx(className, classes.TimelineBreak);
+      $[3] = className;
+      $[4] = t1;
+    } else {
+      t1 = $[4];
+    }
+    const t2 = forwardRef;
+    let t3;
+    if ($[5] !== props || $[6] !== t1 || $[7] !== t2) {
+      t3 = /*#__PURE__*/jsx("li", {
+        ...props,
+        className: t1,
+        ref: t2,
+        role: "presentation"
+      });
+      $[5] = props;
+      $[6] = t1;
+      $[7] = t2;
+      $[8] = t3;
+    } else {
+      t3 = $[8];
+    }
+    return t3;
   }
+  const t1 = props;
   let t2;
-  if ($[5] !== forwardRef || $[6] !== props || $[7] !== t1) {
-    t2 = /*#__PURE__*/jsx("div", {
-      ...props,
-      className: t1,
-      ref: forwardRef
+  if ($[9] !== className) {
+    t2 = clsx(className, classes.TimelineBreak);
+    $[9] = className;
+    $[10] = t2;
+  } else {
+    t2 = $[10];
+  }
+  const t3 = forwardRef;
+  let t4;
+  if ($[11] !== t1 || $[12] !== t2 || $[13] !== t3) {
+    t4 = /*#__PURE__*/jsx("div", {
+      ...t1,
+      className: t2,
+      ref: t3
     });
-    $[5] = forwardRef;
-    $[6] = props;
-    $[7] = t1;
-    $[8] = t2;
+    $[11] = t1;
+    $[12] = t2;
+    $[13] = t3;
+    $[14] = t4;
   } else {
-    t2 = $[8];
+    t4 = $[14];
   }
-  return t2;
+  return t4;
 });
 TimelineBreak.displayName = 'TimelineBreak';
 const TimelineActions = /*#__PURE__*/React.forwardRef((t0, forwardRef) => {

package/dist/Timeline/Timeline.module.css.js

@@ -1,4 +1,4 @@
-import './Timeline-0c88f21b.css';
+import './Timeline-ff81db92.css';
 
 var classes = {"Timeline":"prc-Timeline-Timeline-awSoC","TimelineItem":"prc-Timeline-TimelineItem-QwDVH","TimelineItemAvatar":"prc-Timeline-TimelineItemAvatar-4zO8f","TimelineBadge":"prc-Timeline-TimelineBadge-u0qSm","TimelineBadgeWrapper":"prc-Timeline-TimelineBadgeWrapper-SZw4k","TimelineBody":"prc-Timeline-TimelineBody-tjOtb","TimelineBreak":"prc-Timeline-TimelineBreak-X8eti","TimelineItemActions":"prc-Timeline-TimelineItemActions-56Y7h"};
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@primer/react",
   "type": "module",
-  "version": "38.27.0",
+  "version": "38.28.0-rc.5b1595e6f",
   "description": "An implementation of GitHub's Primer Design System using React",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -114,12 +114,12 @@
     "@rollup/plugin-node-resolve": "16.0.3",
     "@rollup/plugin-typescript": "12.3.0",
     "@rollup/plugin-virtual": "3.0.2",
-    "@storybook/addon-a11y": "^10.3.3",
-    "@storybook/addon-docs": "^10.3.3",
-    "@storybook/addon-links": "^10.3.3",
-    "@storybook/addon-mcp": "^0.4.2",
-    "@storybook/icons": "^2.0.1",
-    "@storybook/react-vite": "^10.3.3",
+    "@storybook/addon-a11y": "^10.4.2",
+    "@storybook/addon-docs": "^10.4.2",
+    "@storybook/addon-links": "^10.4.2",
+    "@storybook/addon-mcp": "^0.6.0",
+    "@storybook/icons": "^2.0.2",
+    "@storybook/react-vite": "^10.4.2",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/jest-dom": "^6.4.5",
     "@testing-library/react": "^16.3.0",
@@ -173,7 +173,7 @@
     "rimraf": "5.0.5",
     "rollup": "4.59.0",
     "rollup-plugin-import-css": "^0.0.0",
-    "storybook": "^10.3.3",
+    "storybook": "^10.4.2",
     "terser": "5.36.0",
     "ts-toolbelt": "9.6.0",
     "tsx": "4.20.3",
@@ -204,4 +204,4 @@
       "optional": true
     }
   }
-}
+}

package/dist/Card/Card-d8a02dd9.css

@@ -1,2 +0,0 @@
-.prc-Card-Card-pYjuL{background-color:var(--bgColor-default,#fff);border:var(--borderWidth-thin,.0625rem) solid var(--borderColor-default,#d1d9e0);box-shadow:var(--shadow-resting-small,0 1px 1px 0 #1f23280a,0 1px 2px 0 #1f232808);display:grid;gap:var(--stack-gap-normal,1rem);grid-auto-rows:max-content auto;overflow:hidden;position:relative}.prc-Card-Card-pYjuL[data-border-radius=large]{border-radius:var(--borderRadius-large,.75rem)}.prc-Card-Card-pYjuL[data-border-radius=medium]{border-radius:var(--borderRadius-medium,.375rem)}.prc-Card-Card-pYjuL[data-padding=normal]{padding:var(--stack-padding-spacious,1.5rem)}.prc-Card-Card-pYjuL[data-padding=condensed]{padding:var(--stack-padding-condensed,.5rem)}.prc-Card-Card-pYjuL[data-padding=none]{padding:0}.prc-Card-CardHeader-P5Qbb{display:block;height:auto;width:100%}.prc-Card-CardHeaderEdgeToEdge-3yCqT{margin-left:calc(var(--stack-padding-spacious,1.5rem)*-1);margin-right:calc(var(--stack-padding-spacious,1.5rem)*-1);margin-top:calc(var(--stack-padding-spacious,1.5rem)*-1);width:calc(100% + var(--stack-padding-spacious,1.5rem)*2)}.prc-Card-CardImage-2M8DM{display:block;height:auto;width:100%}.prc-Card-CardIcon-mIMfj{align-items:center;background-color:var(--bgColor-muted,#f6f8fa);border-radius:var(--borderRadius-medium,.375rem);color:var(--fgColor-muted,#59636e);display:flex;height:var(--base-size-32,2rem);justify-content:center;width:var(--base-size-32,2rem)}.prc-Card-CardBody-W1o-l{display:grid;gap:var(--stack-gap-normal,1rem)}.prc-Card-CardContent-omZDS{display:grid;gap:var(--stack-gap-condensed,.5rem)}.prc-Card-CardHeading-3HXyS{color:var(--fgColor-default,#1f2328);font:var(--text-title-shorthand-small,600 1rem/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji");margin:0}.prc-Card-CardDescription-MnJ3F{margin:0}.prc-Card-CardDescription-MnJ3F,.prc-Card-CardMetadataContainer-K-UlH{color:var(--fgColor-muted,#59636e);font:var(--text-body-shorthand-medium,400 .875rem/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji")}.prc-Card-CardMetadataContainer-K-UlH{align-items:center;display:flex;gap:var(--stack-gap-normal,1rem)}.prc-Card-CardMetadataItem-ellY9{align-items:center;display:flex;font:var(--text-body-shorthand-small,400 .75rem/1.625 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji");gap:var(--stack-gap-condensed,.5rem)}.prc-Card-CardAction-VtI49{position:absolute;right:var(--base-size-16,1rem);top:var(--base-size-16,1rem);z-index:1}
-/*# sourceMappingURL=Card-d8a02dd9.css.map */

package/dist/Card/Card-d8a02dd9.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/Card/Card.module.css.js"],"names":[],"mappings":"AAAA,qBAOE,4CAAwC,CAFxC,gFAAgE,CAChE,kFAAuC,CALvC,YAAa,CAOb,gCAA4B,CAJ5B,+BAAgC,CADhC,eAAgB,CADhB,iBA6BF,CArBE,+CACE,8CACF,CAEA,gDACE,gDACF,CAEA,0CAEE,4CACF,CAEA,6CAEE,4CACF,CAEA,wCACE,SACF,CAGF,2BACE,aAAc,CAEd,WAAY,CADZ,UAEF,CAEA,qCAIE,yDAAqD,CADrD,0DAAsD,CADtD,wDAAoD,CAGpD,yDAEF,CAEA,0BACE,aAAc,CAEd,WAAY,CADZ,UAEF,CAEA,yBAEE,kBAAmB,CAKnB,6CAAsC,CADtC,gDAAyC,CAEzC,kCAA2B,CAP3B,YAAa,CAIb,+BAA2B,CAF3B,sBAAuB,CACvB,8BAKF,CAEA,yBACE,YAAa,CACb,gCACF,CAEA,4BACE,YAAa,CACb,oCACF,CAEA,4BAEE,oCAA6B,CAD7B,2KAAuC,CAEvC,QACF,CAEA,gCAGE,QACF,CAEA,sEAJE,kCAA2B,CAD3B,8KAWF,CANA,sCAEE,kBAAmB,CADnB,YAAa,CAEb,gCAGF,CAEA,iCAEE,kBAAmB,CADnB,YAAa,CAGb,8KAAsC,CADtC,oCAEF,CAEA,2BACE,iBAAkB,CAElB,8BAA0B,CAD1B,4BAAwB,CAExB,SACF","file":"Card-d8a02dd9.css","sourcesContent":[".Card {\n  display: grid;\n  position: relative;\n  overflow: hidden;\n  grid-auto-rows: max-content auto;\n  border: var(--borderWidth-thin) solid var(--borderColor-default);\n  box-shadow: var(--shadow-resting-small);\n  background-color: var(--bgColor-default);\n  gap: var(--stack-gap-normal);\n\n  &[data-border-radius='large'] {\n    border-radius: var(--borderRadius-large);\n  }\n\n  &[data-border-radius='medium'] {\n    border-radius: var(--borderRadius-medium);\n  }\n\n  &[data-padding='normal'] {\n    /* stylelint-disable-next-line primer/spacing */\n    padding: var(--stack-padding-spacious);\n  }\n\n  &[data-padding='condensed'] {\n    /* stylelint-disable-next-line primer/spacing */\n    padding: var(--stack-padding-condensed);\n  }\n\n  &[data-padding='none'] {\n    padding: 0;\n  }\n}\n\n.CardHeader {\n  display: block;\n  width: 100%;\n  height: auto;\n}\n\n.CardHeaderEdgeToEdge {\n  /* stylelint-disable primer/spacing */\n  margin-top: calc(-1 * var(--stack-padding-spacious));\n  margin-right: calc(-1 * var(--stack-padding-spacious));\n  margin-left: calc(-1 * var(--stack-padding-spacious));\n  width: calc(100% + 2 * var(--stack-padding-spacious));\n  /* stylelint-enable primer/spacing */\n}\n\n.CardImage {\n  display: block;\n  width: 100%;\n  height: auto;\n}\n\n.CardIcon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--base-size-32);\n  height: var(--base-size-32);\n  border-radius: var(--borderRadius-medium);\n  background-color: var(--bgColor-muted);\n  color: var(--fgColor-muted);\n}\n\n.CardBody {\n  display: grid;\n  gap: var(--stack-gap-normal);\n}\n\n.CardContent {\n  display: grid;\n  gap: var(--stack-gap-condensed);\n}\n\n.CardHeading {\n  font: var(--text-title-shorthand-small);\n  color: var(--fgColor-default);\n  margin: 0;\n}\n\n.CardDescription {\n  font: var(--text-body-shorthand-medium);\n  color: var(--fgColor-muted);\n  margin: 0;\n}\n\n.CardMetadataContainer {\n  display: flex;\n  align-items: center;\n  gap: var(--stack-gap-normal);\n  font: var(--text-body-shorthand-medium);\n  color: var(--fgColor-muted);\n}\n\n.CardMetadataItem {\n  display: flex;\n  align-items: center;\n  gap: var(--stack-gap-condensed);\n  font: var(--text-body-shorthand-small);\n}\n\n.CardAction {\n  position: absolute;\n  top: var(--base-size-16);\n  right: var(--base-size-16);\n  z-index: 1;\n}\n"]}

package/dist/InlineMessage/InlineMessage-80d97643.css

@@ -1,2 +0,0 @@
-.prc-InlineMessage-InlineMessage-8xfK-{align-items:start;color:var(--inline-message-fgColor);column-gap:.5rem;display:grid;font-size:var(--inline-message-fontSize);grid-template-columns:auto 1fr;line-height:var(--inline-message-lineHeight)}.prc-InlineMessage-InlineMessage-8xfK-[data-size=small]{--inline-message-fontSize:var(--text-body-size-small,0.75rem);--inline-message-lineHeight:var(--text-body-lineHeight-small,1.6666)}.prc-InlineMessage-InlineMessage-8xfK-[data-size=medium]{--inline-message-fontSize:var(--text-body-size-medium,0.875rem);--inline-message-lineHeight:var(--text-body-lineHeight-medium,1.4285)}.prc-InlineMessage-InlineMessage-8xfK-[data-variant=warning]{--inline-message-fgColor:var(--fgColor-attention,#9a6700)}.prc-InlineMessage-InlineMessage-8xfK-[data-variant=critical]{--inline-message-fgColor:var(--fgColor-danger,#d1242f)}.prc-InlineMessage-InlineMessage-8xfK-[data-variant=success]{--inline-message-fgColor:var(--fgColor-success,#1a7f37)}.prc-InlineMessage-InlineMessage-8xfK-[data-variant=unavailable]{--inline-message-fgColor:var(--fgColor-muted,#59636e)}.prc-InlineMessage-InlineMessageIcon-rl8pZ{min-height:calc(var(--inline-message-lineHeight)*var(--inline-message-fontSize))}
-/*# sourceMappingURL=InlineMessage-80d97643.css.map */

package/dist/InlineMessage/InlineMessage-80d97643.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/InlineMessage/InlineMessage.module.css.js"],"names":[],"mappings":"AAAA,uCAUE,iBAAkB,CAHlB,mCAAoC,CACpC,gBAAkB,CAPlB,YAAa,CAEb,wCAAyC,CAMzC,8BAA+B,CAJ/B,4CAgCF,CAzBE,wDACE,6DAAsD,CACtD,oEACF,CAEA,yDACE,+DAAuD,CACvD,qEACF,CAEA,6DACE,yDACF,CAEA,8DACE,sDACF,CAEA,6DACE,uDACF,CAEA,iEACE,qDACF,CAGF,2CACE,gFACF","file":"InlineMessage-80d97643.css","sourcesContent":[".InlineMessage {\n  display: grid;\n  /* stylelint-disable-next-line primer/typography */\n  font-size: var(--inline-message-fontSize);\n  /* stylelint-disable-next-line primer/typography */\n  line-height: var(--inline-message-lineHeight);\n  /* stylelint-disable-next-line primer/colors */\n  color: var(--inline-message-fgColor);\n  column-gap: 0.5rem;\n  grid-template-columns: auto 1fr;\n  align-items: start;\n\n  &[data-size='small'] {\n    --inline-message-fontSize: var(--text-body-size-small);\n    --inline-message-lineHeight: var(--text-body-lineHeight-small, 1.6666);\n  }\n\n  &[data-size='medium'] {\n    --inline-message-fontSize: var(--text-body-size-medium);\n    --inline-message-lineHeight: var(--text-body-lineHeight-medium, 1.4285);\n  }\n\n  &[data-variant='warning'] {\n    --inline-message-fgColor: var(--fgColor-attention);\n  }\n\n  &[data-variant='critical'] {\n    --inline-message-fgColor: var(--fgColor-danger);\n  }\n\n  &[data-variant='success'] {\n    --inline-message-fgColor: var(--fgColor-success);\n  }\n\n  &[data-variant='unavailable'] {\n    --inline-message-fgColor: var(--fgColor-muted);\n  }\n}\n\n.InlineMessageIcon {\n  min-height: calc(var(--inline-message-lineHeight) * var(--inline-message-fontSize));\n}\n"]}

package/dist/Timeline/Timeline-0c88f21b.css

@@ -1,2 +0,0 @@
-.prc-Timeline-Timeline-awSoC{display:flex;flex-direction:column}:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=start]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:first-child{padding-top:0}:is(:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=start]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:first-child) .prc-Timeline-TimelineItemAvatar-4zO8f{top:var(--base-size-16,1rem)}:is(:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=start]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:first-child):where([data-condensed]):before{top:var(--base-size-12,.75rem)}:is(:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=start]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:first-child):where([data-condensed]) .prc-Timeline-TimelineItemAvatar-4zO8f{top:calc(var(--base-size-8,.5rem) + var(--base-size-8,.5rem))}:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=end]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:last-child{padding-bottom:0}:is(:is(.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=end]),.prc-Timeline-Timeline-awSoC:where([data-clip-sidebar=both])) .prc-Timeline-TimelineItem-QwDVH:last-child):where([data-condensed]):before{height:var(--base-size-12,.75rem)}.prc-Timeline-TimelineItem-QwDVH{display:flex;margin-left:var(--base-size-16,1rem);padding:var(--base-size-16,1rem) 0;position:relative}.prc-Timeline-TimelineItem-QwDVH:before{background-color:var(--borderColor-muted,#d1d9e0b3);bottom:0;content:"";display:block;left:0;position:absolute;top:0;width:2px}.prc-Timeline-TimelineItem-QwDVH:where([data-condensed]){padding-bottom:0;padding-top:var(--base-size-4,.25rem)}.prc-Timeline-TimelineItem-QwDVH:where([data-condensed]):last-child{padding-bottom:var(--base-size-16,1rem)}.prc-Timeline-TimelineItem-QwDVH:where([data-condensed]) .prc-Timeline-TimelineBadge-u0qSm{background-color:var(--bgColor-default,#fff);border:0;color:var(--fgColor-muted,#59636e);height:16px;margin-bottom:var(--base-size-8,.5rem);margin-top:var(--base-size-8,.5rem)}.prc-Timeline-TimelineItem-QwDVH:where([data-condensed]) .prc-Timeline-TimelineItemAvatar-4zO8f{top:calc(var(--base-size-4,.25rem) + var(--base-size-8,.5rem) + var(--base-size-8,.5rem))}.prc-Timeline-TimelineItemAvatar-4zO8f{left:calc((var(--base-size-40,2.5rem) + var(--base-size-32,2rem))*-1);position:absolute;top:calc(var(--base-size-16,1rem) + var(--base-size-16,1rem));transform:translateY(-50%);z-index:1}.prc-Timeline-TimelineBadgeWrapper-SZw4k{position:relative;z-index:1}.prc-Timeline-TimelineBadge-u0qSm{align-items:center;background-color:var(--timelineBadge-bgColor,#f6f8fa);border-color:var(--bgColor-default,#fff);border-radius:50%;border-style:solid;border-width:var(--borderWidth-thick,.125rem);color:var(--fgColor-muted,#59636e);display:flex;flex-shrink:0;height:32px;justify-content:center;margin-left:-15px;margin-right:var(--base-size-8,.5rem);overflow:hidden;width:32px}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant]){color:var(--fgColor-onEmphasis,#fff)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=accent]){background-color:var(--bgColor-accent-emphasis,#0969da)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=success]){background-color:var(--bgColor-success-emphasis,#1f883d)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=attention]){background-color:var(--bgColor-attention-emphasis,#9a6700)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=severe]){background-color:var(--bgColor-severe-emphasis,#bc4c00)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=danger]){background-color:var(--bgColor-danger-emphasis,#cf222e)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=done]){background-color:var(--bgColor-done-emphasis,#8250df)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=open]){background-color:var(--bgColor-open-emphasis,#1f883d)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=closed]){background-color:var(--bgColor-closed-emphasis,#cf222e)}.prc-Timeline-TimelineBadge-u0qSm:where([data-variant=sponsors]){background-color:var(--bgColor-sponsors-emphasis,#bf3989)}.prc-Timeline-TimelineBody-tjOtb{color:var(--fgColor-muted,#59636e);flex:auto;font-size:var(--text-body-size-medium,.875rem);margin-top:calc(var(--base-size-4,.25rem) + 1px);max-width:100%;min-width:0}.prc-Timeline-TimelineBreak-X8eti{background-color:var(--bgColor-default,#fff);border:0;border-top:var(--borderWidth-thicker,.25rem) solid var(--borderColor-default,#d1d9e0);height:var(--base-size-24,1.5rem);margin:0;margin-bottom:calc(var(--base-size-16,1rem)*-1);margin-left:0;position:relative;z-index:1}.prc-Timeline-TimelineBreak-X8eti:has(+[data-condensed]){margin-bottom:calc(var(--base-size-12,.75rem)*-1)}.prc-Timeline-TimelineItemActions-56Y7h{align-items:center;align-self:flex-start;display:flex;flex-shrink:0;gap:var(--base-size-8,.5rem);margin-left:auto;min-height:var(--base-size-32,2rem)}
-/*# sourceMappingURL=Timeline-0c88f21b.css.map */

package/dist/Timeline/Timeline-0c88f21b.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/Timeline/Timeline.module.css.js"],"names":[],"mappings":"AAAA,6BACE,YAAa,CACb,qBAiCF,CA7BI,6KACE,aAeF,CAbE,yNAEE,4BACF,CAEA,iNACE,8BACF,CAEA,iPAEE,6DACF,CAMF,0KACE,gBAKF,CAHE,8MACE,iCACF,CAKN,iCAEE,YAAa,CAEb,oCAAgC,CADhC,kCAA8B,CAF9B,iBAuCF,CAlCE,wCASE,mDAA0C,CAN1C,QAAS,CAIT,UAAW,CAFX,aAAc,CADd,MAAO,CAHP,iBAAkB,CAClB,KAAM,CAIN,SAIF,CAEA,yDAEE,gBAAiB,CADjB,qCAoBF,CAjBE,oEACE,uCACF,CAEA,2FAKE,4CAAwC,CACxC,QAAS,CAFT,kCAA2B,CAH3B,WAAY,CAEZ,sCAAiC,CADjC,mCAKF,CAEA,gGAEE,yFACF,CAIJ,uCAGE,qEAA4D,CAF5D,iBAAkB,CAIlB,6DAAoD,CAEpD,0BAA2B,CAD3B,SAEF,CAEA,yCACE,iBAAkB,CAClB,SACF,CAEA,kCAkBE,kBAAmB,CANnB,qDAA8C,CAE9C,wCAAoC,CAGpC,iBAAkB,CAFlB,kBAAmB,CACnB,6CAAsC,CAPtC,kCAA2B,CAR3B,YAAa,CAMb,aAAc,CAJd,WAAY,CAgBZ,sBAAuB,CAbvB,iBAAkB,CAFlB,qCAAgC,CAIhC,eAAgB,CANhB,UA0DF,CAvCE,wDACE,oCACF,CAEA,+DACE,uDACF,CAEA,gEACE,wDACF,CAEA,kEACE,0DACF,CAEA,+DACE,uDACF,CAEA,+DACE,uDACF,CAEA,6DACE,qDACF,CAEA,6DACE,qDACF,CAEA,+DACE,uDACF,CAEA,iEACE,yDACF,CAGF,iCAME,kCAA2B,CAC3B,SAAU,CAFV,8CAAuC,CADvC,gDAA0C,CAF1C,cAAe,CADf,WAOF,CAEA,kCAOE,4CAAwC,CACxC,QAAS,CACT,qFAAuE,CANvE,iCAA2B,CAC3B,QAAS,CACT,+CAA6C,CAC7C,aAAc,CALd,iBAAkB,CAClB,SAaF,CAHE,yDACE,iDACF,CAGF,wCAEE,kBAAmB,CACnB,qBAAsB,CAFtB,YAAa,CAOb,aAAc,CADd,4BAAuB,CADvB,gBAAiB,CADjB,mCAIF","file":"Timeline-0c88f21b.css","sourcesContent":[".Timeline {\n  display: flex;\n  flex-direction: column;\n\n  &:where([data-clip-sidebar='start']),\n  &:where([data-clip-sidebar='both']) {\n    .TimelineItem:first-child {\n      padding-top: 0;\n\n      .TimelineItemAvatar {\n        /* No padding-top on first item: badge center is at 0 + 16px (half-badge) */\n        top: var(--base-size-16);\n      }\n\n      &:where([data-condensed])::before {\n        top: var(--base-size-12);\n      }\n\n      &:where([data-condensed]) .TimelineItemAvatar {\n        /* No padding-top + condensed: badge center is at 0 + 8px margin + 8px half-badge */\n        top: calc(var(--base-size-8) + var(--base-size-8));\n      }\n    }\n  }\n\n  &:where([data-clip-sidebar='end']),\n  &:where([data-clip-sidebar='both']) {\n    .TimelineItem:last-child {\n      padding-bottom: 0;\n\n      &:where([data-condensed])::before {\n        height: var(--base-size-12);\n      }\n    }\n  }\n}\n\n.TimelineItem {\n  position: relative;\n  display: flex;\n  padding: var(--base-size-16) 0;\n  margin-left: var(--base-size-16);\n\n  &::before {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    display: block;\n    width: 2px;\n    content: '';\n    /* stylelint-disable-next-line primer/colors */\n    background-color: var(--borderColor-muted);\n  }\n\n  &:where([data-condensed]) {\n    padding-top: var(--base-size-4);\n    padding-bottom: 0;\n\n    &:last-child {\n      padding-bottom: var(--base-size-16);\n    }\n\n    .TimelineBadge {\n      height: 16px;\n      margin-top: var(--base-size-8);\n      margin-bottom: var(--base-size-8);\n      color: var(--fgColor-muted);\n      background-color: var(--bgColor-default);\n      border: 0;\n    }\n\n    .TimelineItemAvatar {\n      /* Vertically center against the condensed badge (4px padding-top + 8px badge top margin + 8px half-badge) */\n      top: calc(var(--base-size-4) + var(--base-size-8) + var(--base-size-8));\n    }\n  }\n}\n\n.TimelineItemAvatar {\n  position: absolute;\n  /* Place avatar in the left gutter, aligned with surrounding actor avatars (~72px from item content) */\n  left: calc(-1 * (var(--base-size-40) + var(--base-size-32)));\n  /* Vertically center against the default badge (16px padding-top + 16px half-badge) */\n  top: calc(var(--base-size-16) + var(--base-size-16));\n  z-index: 1;\n  transform: translateY(-50%);\n}\n\n.TimelineBadgeWrapper {\n  position: relative;\n  z-index: 1;\n}\n\n.TimelineBadge {\n  display: flex;\n  width: 32px;\n  height: 32px;\n  margin-right: var(--base-size-8);\n  /* stylelint-disable-next-line primer/spacing */\n  margin-left: -15px;\n  flex-shrink: 0;\n  overflow: hidden;\n  color: var(--fgColor-muted);\n\n  /* TODOl not quite sure if this is the correct migration for this line */\n  background-color: var(--timelineBadge-bgColor);\n  /* stylelint-disable-next-line primer/colors */\n  border-color: var(--bgColor-default);\n  border-style: solid;\n  border-width: var(--borderWidth-thick);\n  border-radius: 50%;\n  align-items: center;\n  justify-content: center;\n\n  &:where([data-variant]) {\n    color: var(--fgColor-onEmphasis);\n  }\n\n  &:where([data-variant='accent']) {\n    background-color: var(--bgColor-accent-emphasis);\n  }\n\n  &:where([data-variant='success']) {\n    background-color: var(--bgColor-success-emphasis);\n  }\n\n  &:where([data-variant='attention']) {\n    background-color: var(--bgColor-attention-emphasis);\n  }\n\n  &:where([data-variant='severe']) {\n    background-color: var(--bgColor-severe-emphasis);\n  }\n\n  &:where([data-variant='danger']) {\n    background-color: var(--bgColor-danger-emphasis);\n  }\n\n  &:where([data-variant='done']) {\n    background-color: var(--bgColor-done-emphasis);\n  }\n\n  &:where([data-variant='open']) {\n    background-color: var(--bgColor-open-emphasis);\n  }\n\n  &:where([data-variant='closed']) {\n    background-color: var(--bgColor-closed-emphasis);\n  }\n\n  &:where([data-variant='sponsors']) {\n    background-color: var(--bgColor-sponsors-emphasis);\n  }\n}\n\n.TimelineBody {\n  min-width: 0;\n  max-width: 100%;\n  /* stylelint-disable-next-line primer/spacing */\n  margin-top: calc(var(--base-size-4) + 1px);\n  font-size: var(--text-body-size-medium);\n  color: var(--fgColor-muted);\n  flex: auto;\n}\n\n.TimelineBreak {\n  position: relative;\n  z-index: 1;\n  height: var(--base-size-24);\n  margin: 0;\n  margin-bottom: calc(-1 * var(--base-size-16));\n  margin-left: 0;\n  background-color: var(--bgColor-default);\n  border: 0;\n  border-top: var(--borderWidth-thicker) solid var(--borderColor-default);\n\n  /* stylelint-disable-next-line selector-pseudo-class-disallowed-list -- scoped to CSS Module, audited (github/github-ui#17224) */\n  &:has(+ [data-condensed]) {\n    margin-bottom: calc(-1 * var(--base-size-12));\n  }\n}\n\n.TimelineItemActions {\n  display: flex;\n  align-items: center;\n  align-self: flex-start;\n  /* Match the badge wrapper height (32px in both default and condensed) so contents vertically center against the badge */\n  min-height: var(--base-size-32);\n  margin-left: auto;\n  gap: var(--base-size-8);\n  flex-shrink: 0;\n}\n"]}