Skip to content

Commit

Permalink
Merge branch 'next-major' into actionlist-br-hover
Browse files Browse the repository at this point in the history
  • Loading branch information
langermank authored Aug 3, 2023
2 parents f49612c + d3146ce commit 7e8fad1
Show file tree
Hide file tree
Showing 27 changed files with 1,011 additions and 855 deletions.
7 changes: 7 additions & 0 deletions .changeset/strange-geese-drive.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
---
'@primer/react': major
---

Moves the new Dialog and ConfirmationDialog component to the drafts directory

<!-- Changed components: Dialog -->
2 changes: 1 addition & 1 deletion docs/content/Dialog.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ status: Alpha
source: https://github.com/primer/react/blob/main/src/Dialog
---

import data from '../../src/Dialog.docs.json'
import data from '../../src/Dialog/Dialog.docs.json'

The dialog component is used for all modals. It renders on top of the rest of the app with an overlay.

Expand Down
2 changes: 1 addition & 1 deletion docs/content/drafts/Dialog.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ componentId: dialog
status: Draft
---

import data from '../../../src/Dialog/Dialog.docs.json'
import data from '../../../src/drafts/Dialog2/Dialog.docs.json'

```js
import {Dialog} from '@primer/react/drafts'
Expand Down
2 changes: 0 additions & 2 deletions docs/src/@primer/gatsby-theme-doctocat/nav.yml
Original file line number Diff line number Diff line change
Expand Up @@ -70,8 +70,6 @@
url: /CounterLabel
- title: Details
url: /Details
- title: Dialog
url: /Dialog
- title: Flash
url: /Flash
- title: FormControl
Expand Down
2 changes: 1 addition & 1 deletion src/DataTable/ErrorDialog.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React from 'react'
import {ConfirmationDialog} from '../Dialog/ConfirmationDialog'
import {ConfirmationDialog} from '../drafts/Dialog2/ConfirmationDialog'

export type TableErrorDialogProps = React.PropsWithChildren<{
/**
Expand Down
54 changes: 0 additions & 54 deletions src/Dialog.docs.json

This file was deleted.

146 changes: 0 additions & 146 deletions src/Dialog.tsx

This file was deleted.

70 changes: 33 additions & 37 deletions src/Dialog/Dialog.docs.json
Original file line number Diff line number Diff line change
@@ -1,58 +1,54 @@
{
"id": "drafts_dialog",
"id": "dialog",
"name": "Dialog",
"status": "draft",
"status": "alpha",
"a11yReviewed": false,
"stories": [],
"props": [
{
"name": "title",
"type": "React.ReactNode",
"description": "Title of the Dialog. Also serves as the aria-label for this Dialog."
"name": "isOpen",
"type": "boolean",
"description": "Whether or not the dialog is open"
},
{
"name": "subtitle",
"type": "React.ReactNode",
"description": "The Dialog's subtitle. Optional. Rendered below the title in smaller type with less contrast. Also serves as the aria-describedby for this Dialog."
"name": "onDismiss",
"type": "() => void",
"description": "Function that will be called when the dialog is closed"
},
{
"name": "renderHeader",
"type": "React.FunctionComponent<React.PropsWithChildren<DialogHeaderProps>>",
"description": "Provide a custom renderer for the dialog header. This content is rendered directly into the dialog body area, full bleed from edge to edge, top to the start of the body element. Warning: using a custom renderer may violate Primer UX principles."
"name": "returnFocusRef",
"type": " React.RefObject<HTMLElement>",
"description": "The element to restore focus back to after the `Dialog` is closed"
},
{
"name": "renderBody",
"type": "React.FunctionComponent<React.PropsWithChildren<DialogProps>>",
"description": "Provide a custom render function for the dialog body. This content is rendered directly into the dialog body area, full bleed from edge to edge, header to footer. Warning: using a custom renderer may violate Primer UX principles."
"name": "initialFocusRef",
"type": " React.RefObject<HTMLElement>",
"description": "Element inside of the `Dialog` you'd like to be focused when the Dialog is opened. If nothing is passed to `initialFocusRef` the close button is focused."
},
{
"name": "renderFooter",
"type": "React.FunctionComponent<React.PropsWithChildren<DialogProps>>",
"description": "Provide a custom render function for the dialog footer. This content is rendered directly into the dialog footer area, full bleed from edge to edge, end of the body element to bottom. Warning: using a custom renderer may violate Primer UX principles."
"name": "aria-labelledby",
"type": "string",
"description": "Pass an id to use for the aria-label. Use either a `aria-label` or an `aria-labelledby` but not both."
},
{
"name": "footerButtons",
"type": "DialogButtonProps[]",
"description": "Specifies the buttons to be rendered in the Dialog footer."
"name": "aria-label",
"type": "string",
"description": "Pass a label to be used to describe the Dialog. Use either a `aria-label` or an `aria-labelledby` but not both."
},
{
"name": "onClose",
"type": "(gesture: 'close-button' | 'escape') => void",
"description": "This method is invoked when a gesture to close the dialog is used (either an Escape key press or clicking the 'X' in the top-right corner). The gesture argument indicates the gesture that was used to close the dialog (either 'close-button' or 'escape')."
},
{
"name": "role",
"type": "'dialog' | 'alertdialog'",
"description": "The ARIA role to assign to this dialog."
},
{
"name": "width",
"type": "'small' | 'medium' | 'large' | 'xlarge'"
},
{
"name": "height",
"type": "'small' | 'large' | 'auto'"
"name": "sx",
"type": "SystemStyleObject"
}
],
"subcomponents": []
"subcomponents": [
{
"name": "Dialog.Header",
"props": [
{
"name": "sx",
"type": "SystemStyleObject"
}
]
}
]
}
4 changes: 2 additions & 2 deletions src/__tests__/Dialog.test.tsx → src/Dialog/Dialog.test.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React, {useState, useRef} from 'react'
import {Dialog, Box, Text} from '..'
import {Box, Dialog, Text} from '..'
import {Button} from '../deprecated'
import {render as HTMLRender, fireEvent} from '@testing-library/react'
import {axe, toHaveNoViolations} from 'jest-axe'
Expand Down Expand Up @@ -78,7 +78,7 @@ describe('Dialog', () => {
options: {skipAs: true, skipSx: true},
})

checkExports('Dialog', {
checkExports('Dialog/Dialog', {
default: Dialog,
})

Expand Down
Loading

0 comments on commit 7e8fad1

Please sign in to comment.