diff --git a/.changeset/stale-hounds-notice.md b/.changeset/stale-hounds-notice.md new file mode 100644 index 00000000000..7727ac53be6 --- /dev/null +++ b/.changeset/stale-hounds-notice.md @@ -0,0 +1,9 @@ +--- +"@primer/react": minor +--- + +[NavList](https://primer.style/NavList) is ready to use. You can now import it from the main bundle: + +```js +import {NavList} from '@primer/react' +``` diff --git a/docs/content/NavList.mdx b/docs/content/NavList.mdx index 9293821a83f..61f2cd0bf8f 100644 --- a/docs/content/NavList.mdx +++ b/docs/content/NavList.mdx @@ -1,12 +1,14 @@ --- title: NavList -status: Draft -description: Use nav list to render a vertical list of navigation links. +status: Alpha +componentId: nav_list +description: Use a nav list to render a vertical list of navigation links. source: https://github.com/primer/react/tree/main/src/NavList +storybook: '/react/storybook/?path=/story/composite-components-navlist--simple' --- ```js -import {NavList} from '@primer/react/drafts' +import {NavList} from '@primer/react' ``` ## Examples @@ -333,9 +335,9 @@ function App() { adaptsToThemes: true, adaptsToScreenSizes: true, fullTestCoverage: true, - usedInProduction: false, + usedInProduction: true, usageExamplesDocumented: true, - hasStorybookStories: false, + hasStorybookStories: true, designReviewed: false, a11yReviewed: false, stableApi: false, diff --git a/docs/src/@primer/gatsby-theme-doctocat/nav.yml b/docs/src/@primer/gatsby-theme-doctocat/nav.yml index 5464c178421..b353429d7c5 100644 --- a/docs/src/@primer/gatsby-theme-doctocat/nav.yml +++ b/docs/src/@primer/gatsby-theme-doctocat/nav.yml @@ -90,6 +90,8 @@ url: /LabelGroup - title: Link url: /Link + - title: NavList + url: /NavList - title: Overlay url: /Overlay - title: Pagehead diff --git a/src/ActionList/Divider.tsx b/src/ActionList/Divider.tsx index e286448eb42..2d03ef24b8a 100644 --- a/src/ActionList/Divider.tsx +++ b/src/ActionList/Divider.tsx @@ -4,11 +4,12 @@ import {get} from '../constants' import {Theme} from '../ThemeProvider' import {SxProp, merge} from '../sx' +export type ActionListDividerProps = SxProp + /** * Visually separates `Item`s or `Group`s in an `ActionList`. */ - -export const Divider: React.FC = ({sx = {}}) => { +export const Divider: React.FC = ({sx = {}}) => { return (