primer
Repos
93

The CSS design system that powers GitHub

11388
988

An implementation of GitHub's Primer Design System using React

1983
308

ViewComponents for the Primer Design System

251
60

A scalable set of icons handcrafted with <3 by GitHub

7453
742

Primer Design Guidelines

243
113

Primer Presentations is the presentation design system for GitHub. It's intended to be used only by GitHub staff for presentations that represent GitHub.

63
25

Events

added fontWeight Transformer

Created at 6 minutes ago

remove unnecessary optional chain

Created at 13 minutes ago

feat(package): update exports to import/require (#2366)

  • fix(package): update exports to import/require

  • feat: include esm-only modules in CommonJS bundle

  • fix: update ordering of import and require

  • docs: add nextjs example

  • chore: update eslint config

  • chore: remove nextjs example from workspaces

  • chore: add changeset

  • chore: update package.json exports order

  • ci: add examples check to ci.yml

  • chore: add nextjs example to setup

chore(deps-dev): bump babel-loader from 8.2.2 to 8.2.5 (#2129)

Bumps babel-loader from 8.2.2 to 8.2.5.


updated-dependencies:

  • dependency-name: babel-loader dependency-type: direct:development update-type: version-update:semver-patch ...

Signed-off-by: dependabot[bot] support@github.com

Signed-off-by: dependabot[bot] support@github.com Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Pavithra Kodmad pksjce@github.com Co-authored-by: Josh Black joshblack@github.com

chore(deps-dev): bump eslint-plugin-prettier from 3.4.0 to 4.2.1 (#2322)

Bumps eslint-plugin-prettier from 3.4.0 to 4.2.1.


updated-dependencies:

  • dependency-name: eslint-plugin-prettier dependency-type: direct:development update-type: version-update:semver-major ...

Signed-off-by: dependabot[bot] support@github.com

Signed-off-by: dependabot[bot] support@github.com Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Josh Black joshblack@github.com

TreeView: Allow expanded state to be controlled (#2373)

  • Move getNextFocusableElement into its own file

  • Create useTypeahead hook

  • Create useActiveDescendant hook

  • Add typeahead tests

  • Create loud-toys-explode.md

  • Refactor useTypeahead to work better with useEffect hook

Co-authored-by: Josh Black joshblack@github.com

  • Use useSafeTimeout hook

  • Allow expanded state to be controlled

Co-authored-by: Josh Black joshblack@users.noreply.github.com

  • Add tests for useControllableState hook

Co-authored-by: Josh Black joshblack@github.com

  • Fix logic bug when expanding current path

  • Test controlled state

  • Remove unused eslint disables

  • Create serious-adults-protect.md

  • Add current prop to LinkItem prop table

  • Create stable setState function

  • Refactor effects

  • Create jump to menu in story

  • Add conrolled example to docs

Co-authored-by: Josh Black joshblack@github.com Co-authored-by: Josh Black joshblack@users.noreply.github.com

[UnderlineNav] : Introduce loading counters (#2378)

  • loading state for counters - only for UnderlineNav

  • CR feedback & changeset & docs and tests

  • Update docs/content/drafts/UnderlineNav2.mdx

Co-authored-by: Cole Bemis colebemis@github.com

  • prop rename to loadingCounters

Co-authored-by: Cole Bemis colebemis@github.com

[Proposal] Organize Storybook folder structure (#2358)

  • organize storybook folders

  • try to upgrade npm

initial implementation for keeping selected item visible

improve swapping functionality

refactor & comments & selectedLink style

keep selected item in the list when resizing

refactor(useResizeObserver): split callback reference from effect deps

keep selected item after swapping

Created at 19 minutes ago

keep selected item after swapping

Created at 28 minutes ago

add figma filter

Created at 29 minutes ago
started
Created at 56 minutes ago
issue comment
[Colors] Integrating colors into SD and update SD workflow

Re: prefix- the prefix behavior we've implemented is part of what ties primer/primitives together with primer/brand. The default is primer which is used for all product tokens, and in brand we use brand. @rezrah can go into detail about how the build process works, but this allows brand to replace tokens with their own prefix. If a token value is redefined in brand, it will simply replace the primer/primitive instead of sitting alongside it with a different prefix.

I think you misunderstood this part. But we probably want to keep the output as close the the current output as we can, right? So I will not be adding a prefix to the token names were we don't have one in the current system.

As for @rezrah work, I already talked to him and this will be solvable through different means that are more typical for Style Dictionary.

re: base scale- the only base scale we don't want to keep references for are base scale colors. Everything else is fair game.

Okay, that should be easy enough.

Created at 2 hours ago

move stories to features

Created at 5 hours ago
push

Create quick-seas-tickle.md

Created at 6 hours ago
issue comment
Set FormControl color

⚠️ No Changeset found

Latest commit: 8598bcbacfdbbef23cac94d426f76b60b9c728ec

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

Created at 6 hours ago
pull request opened
Set FormControl color

What are you trying to accomplish?

This came up in https://github.com/github/primer/discussions/1313#discussioncomment-3748057. It seems that form controls don't inherit the color and use the browser default which is #000000. This PR overrides the browser default with --color-fg-default

What approach did you choose and why?

@mixin Field {
  color: var(--color-fg-default);

What should reviewers focus on?

Instead of adding the color to the Field mixin, we could also just add it to https://github.com/primer/css/blob/b087282e5040a53a48b707bd94151a3b896659db/src/forms/FormControl.scss#L120

Can these changes ship as is?

  • [x] Yes, this PR does not depend on additional changes. 🚢
Created at 6 hours ago
create branch
simurai create branch form-control-color
Created at 6 hours ago

TreeView: Allow expanded state to be controlled (#2373)

  • Move getNextFocusableElement into its own file

  • Create useTypeahead hook

  • Create useActiveDescendant hook

  • Add typeahead tests

  • Create loud-toys-explode.md

  • Refactor useTypeahead to work better with useEffect hook

Co-authored-by: Josh Black joshblack@github.com

  • Use useSafeTimeout hook

  • Allow expanded state to be controlled

Co-authored-by: Josh Black joshblack@users.noreply.github.com

  • Add tests for useControllableState hook

Co-authored-by: Josh Black joshblack@github.com

  • Fix logic bug when expanding current path

  • Test controlled state

  • Remove unused eslint disables

  • Create serious-adults-protect.md

  • Add current prop to LinkItem prop table

  • Create stable setState function

  • Refactor effects

  • Create jump to menu in story

  • Add conrolled example to docs

Co-authored-by: Josh Black joshblack@github.com Co-authored-by: Josh Black joshblack@users.noreply.github.com

[UnderlineNav] : Introduce loading counters (#2378)

  • loading state for counters - only for UnderlineNav

  • CR feedback & changeset & docs and tests

  • Update docs/content/drafts/UnderlineNav2.mdx

Co-authored-by: Cole Bemis colebemis@github.com

  • prop rename to loadingCounters

Co-authored-by: Cole Bemis colebemis@github.com

[Proposal] Organize Storybook folder structure (#2358)

  • organize storybook folders

  • try to upgrade npm

chore(deps-dev): bump react-dnd-html5-backend from 14.0.2 to 16.0.1

Bumps react-dnd-html5-backend from 14.0.2 to 16.0.1.


updated-dependencies:

  • dependency-name: react-dnd-html5-backend dependency-type: direct:development update-type: version-update:semver-major ...

Signed-off-by: dependabot[bot] support@github.com

Created at 6 hours ago

[Proposal] Organize Storybook folder structure (#2358)

  • organize storybook folders

  • try to upgrade npm

Version Packages

Created at 6 hours ago
delete branch
langermank delete branch storybook-organize
Created at 6 hours ago

[Proposal] Organize Storybook folder structure (#2358)

  • organize storybook folders

  • try to upgrade npm

Created at 6 hours ago
pull request closed
[Proposal] Organize Storybook folder structure

This PR accompanies this Discussion (hubbers only) about Storybook/Lookbook structure. This is just a start, but with our prospects of single page component docs Storybook becomes even more critical for documentation. If Storybook is organized closer to our more "official" documentation, it may be easier to navigate and parse.

Screenshots

See the preview deploy 😄

Merge checklist

  • [ ] Added/updated tests
  • [ ] Added/updated documentation
  • [ ] Tested in Chrome
  • [ ] Tested in Firefox
  • [ ] Tested in Safari
  • [ ] Tested in Edge
Created at 6 hours ago

chore(deps-dev): bump @wojtekmaj/enzyme-adapter-react-17 (#2022)

Bumps @wojtekmaj/enzyme-adapter-react-17 from 0.6.3 to 0.6.7.


updated-dependencies:

  • dependency-name: "@wojtekmaj/enzyme-adapter-react-17" dependency-type: direct:development update-type: version-update:semver-patch ...

Signed-off-by: dependabot[bot] support@github.com

Signed-off-by: dependabot[bot] support@github.com Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Josh Black joshblack@github.com

chore(deps): bump actions/stale from 4 to 6 (#2371)

Bumps actions/stale from 4 to 6.


updated-dependencies:

  • dependency-name: actions/stale dependency-type: direct:production update-type: version-update:semver-major ...

Signed-off-by: dependabot[bot] support@github.com

Signed-off-by: dependabot[bot] support@github.com Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Josh Black joshblack@github.com

TreeView: Increase touch target size for coarse pointers (#2376)

  • Add type support for css customer properties in the sx prop

  • Increase touch targets for coarse pointers

  • Create orange-beds-rhyme.md

UnderlineNav overflow behaviour implementation (#2297)

  • initial impl for overflow behaviour

  • scroll behaviour initial commit - wip

  • overflow and scroll behaviour and styles

  • introduce scroll arrow buttons

  • scroll behaviour in dept

  • revert back stories to original state

  • Fix types and align/variant issues

  • Use separate component for arrow buttons

  • fade out affects on scroll ends

  • type issues and some refactor

  • style refactor & theming & scrollIntoView from primer behaviour

  • Update documentation

  • Update documentation

  • add changeset

  • remove scroll story until finding a way to simulate coarse pointer

  • add single variant selection to ActionList

  • take more button into account when calculating & code review feedback

  • remove scroll behaviour - due to accessibility concerns

  • hover state remove on mobile and improvments on more btn functionality

  • remove prop controls and align story

  • update tests and docs

  • update docs

  • overflow effect improvments

  • Revert "remove scroll behaviour - due to accessibility concerns"

This reverts commit eade73d521565c137395cb0a790d4721ca2274cc.

  • scroll behaviour feedback

  • update tests

  • keyboard navigation tab through

  • Update .changeset/sweet-eggs-complain.md

Co-authored-by: Cole Bemis colebemis@github.com

  • Update docs/content/drafts/UnderlineNav2.mdx

Co-authored-by: Pavithra Kodmad pksjce@github.com Co-authored-by: Cole Bemis colebemis@github.com

feat(package): update exports to import/require (#2366)

  • fix(package): update exports to import/require

  • feat: include esm-only modules in CommonJS bundle

  • fix: update ordering of import and require

  • docs: add nextjs example

  • chore: update eslint config

  • chore: remove nextjs example from workspaces

  • chore: add changeset

  • chore: update package.json exports order

  • ci: add examples check to ci.yml

  • chore: add nextjs example to setup

chore(deps-dev): bump babel-loader from 8.2.2 to 8.2.5 (#2129)

Bumps babel-loader from 8.2.2 to 8.2.5.


updated-dependencies:

  • dependency-name: babel-loader dependency-type: direct:development update-type: version-update:semver-patch ...

Signed-off-by: dependabot[bot] support@github.com

Signed-off-by: dependabot[bot] support@github.com Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Pavithra Kodmad pksjce@github.com Co-authored-by: Josh Black joshblack@github.com

chore(deps-dev): bump eslint-plugin-prettier from 3.4.0 to 4.2.1 (#2322)

Bumps eslint-plugin-prettier from 3.4.0 to 4.2.1.


updated-dependencies:

  • dependency-name: eslint-plugin-prettier dependency-type: direct:development update-type: version-update:semver-major ...

Signed-off-by: dependabot[bot] support@github.com

Signed-off-by: dependabot[bot] support@github.com Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Josh Black joshblack@github.com

TreeView: Allow expanded state to be controlled (#2373)

  • Move getNextFocusableElement into its own file

  • Create useTypeahead hook

  • Create useActiveDescendant hook

  • Add typeahead tests

  • Create loud-toys-explode.md

  • Refactor useTypeahead to work better with useEffect hook

Co-authored-by: Josh Black joshblack@github.com

  • Use useSafeTimeout hook

  • Allow expanded state to be controlled

Co-authored-by: Josh Black joshblack@users.noreply.github.com

  • Add tests for useControllableState hook

Co-authored-by: Josh Black joshblack@github.com

  • Fix logic bug when expanding current path

  • Test controlled state

  • Remove unused eslint disables

  • Create serious-adults-protect.md

  • Add current prop to LinkItem prop table

  • Create stable setState function

  • Refactor effects

  • Create jump to menu in story

  • Add conrolled example to docs

Co-authored-by: Josh Black joshblack@github.com Co-authored-by: Josh Black joshblack@users.noreply.github.com

[UnderlineNav] : Introduce loading counters (#2378)

  • loading state for counters - only for UnderlineNav

  • CR feedback & changeset & docs and tests

  • Update docs/content/drafts/UnderlineNav2.mdx

Co-authored-by: Cole Bemis colebemis@github.com

  • prop rename to loadingCounters

Co-authored-by: Cole Bemis colebemis@github.com

Merge branch 'main' of https://github.com/primer/react into storybook-organize

Created at 7 hours ago

alignment CSS and props

more cleanup

Created at 7 hours ago
issue comment
[Colors] Integrating colors into SD and update SD workflow

Re: prefix- the prefix behavior we've implemented is part of what ties primer/primitives together with primer/brand. The default is primer which is used for all product tokens, and in brand we use brand. @rezrah can go into detail about how the build process works, but this allows brand to replace tokens with their own prefix. If a token value is redefined in brand, it will simply replace the primer/primitive instead of sitting alongside it with a different prefix.

re: base scale- the only base scale we don't want to keep references for are base scale colors. Everything else is fair game.

Created at 7 hours ago

Create thirty-experts-return.md

Created at 7 hours ago
issue comment
Fix Beta:Button visual regressions

⚠️ No Changeset found

Latest commit: 95245186f35c592ea548e3ce402513ce993ce394

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

Created at 7 hours ago
pull request opened
Fix Beta:Button visual regressions
Created at 7 hours ago

add docs for upgrade

Created at 7 hours ago

setup preview for testing

Created at 8 hours ago