diff --git a/.changeset/erken-gelen-oturur.md b/.changeset/erken-gelen-oturur.md new file mode 100644 index 00000000000..285debac473 --- /dev/null +++ b/.changeset/erken-gelen-oturur.md @@ -0,0 +1,5 @@ +--- +'@primer/react': patch +--- + +UnderlineNav: Display loading counters only for items with the "counter" prop. diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-colorblind-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-colorblind-linux.png index a960918babc..92c1a0e9ffd 100644 Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-colorblind-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-colorblind-linux.png differ diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-dimmed-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-dimmed-linux.png index c5c4f595ea4..eb6a6146938 100644 Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-dimmed-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-dimmed-linux.png differ diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-high-contrast-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-high-contrast-linux.png index 9f940e52411..25597772826 100644 Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-high-contrast-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-high-contrast-linux.png differ diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-linux.png index 737ba2107fe..92c1a0e9ffd 100644 Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-linux.png differ diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-tritanopia-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-tritanopia-linux.png index a960918babc..f120b27b6e4 100644 Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-tritanopia-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-dark-tritanopia-linux.png differ diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-colorblind-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-colorblind-linux.png index 088f540a5af..ac087d9077b 100644 Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-colorblind-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-colorblind-linux.png differ diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-high-contrast-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-high-contrast-linux.png index defb1d07a4c..3a0308a93c8 100644 Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-high-contrast-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-high-contrast-linux.png differ diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-linux.png index 088f540a5af..ffa09fbe236 100644 Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-linux.png differ diff --git a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-tritanopia-linux.png b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-tritanopia-linux.png index 088f540a5af..ed3ec0d8ebf 100644 Binary files a/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-tritanopia-linux.png and b/.playwright/snapshots/components/UnderlineNav.test.ts-snapshots/UnderlineNav-Counters-Loading-State-light-tritanopia-linux.png differ diff --git a/packages/react/src/internal/components/UnderlineTabbedInterface.tsx b/packages/react/src/internal/components/UnderlineTabbedInterface.tsx index b76b6e5c4c5..57198833a0e 100644 --- a/packages/react/src/internal/components/UnderlineTabbedInterface.tsx +++ b/packages/react/src/internal/components/UnderlineTabbedInterface.tsx @@ -220,17 +220,17 @@ export const UnderlineItem = forwardRef( {children} )} - {loadingCounters ? ( - - - - ) : ( - counter !== undefined && ( + {counter !== undefined ? ( + loadingCounters ? ( + + + + ) : ( {counter} ) - )} + ) : null} ) },