Skip to content

Commit

Permalink
Disabled: update docs to clarify the absence of inert polyfill (#45272)
Browse files Browse the repository at this point in the history
* Storybook: update docs to clarify the absence of polyfills

* Revert "Storybook: update docs to clarify the absence of polyfills"

This reverts commit 41faf41.

* Add note about the inert attribute in the Disabled storybook example

* CHANGELOG

* Revert "Add note about the inert attribute in the Disabled storybook example"

This reverts commit 0319599.

* Add note to README and main export JSDocs

* Update CHANGELOG
  • Loading branch information
ciampo authored Oct 26, 2022
1 parent c934ca0 commit 69a3cac
Show file tree
Hide file tree
Showing 3 changed files with 11 additions and 1 deletion.
1 change: 1 addition & 0 deletions packages/components/CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@

### Internal

- `Disabled`: add a note in the docs about the lack of polyfill for the `inert` attribute ([#45272](https://github.com/WordPress/gutenberg/pull/45272))
- `Snackbar`: updated to satisfy `react/exhaustive-deps` eslint rule ([#44934](https://github.com/WordPress/gutenberg/pull/44934))
- `AnglePickerControl`: Set Storybook Label control type to 'text' ([#45122](https://github.com/WordPress/gutenberg/pull/45122)).
- `SlotFill`: updated to satisfy `react/exhaustive-deps` eslint rule ([#44403](https://github.com/WordPress/gutenberg/pull/44403))
Expand Down
2 changes: 2 additions & 0 deletions packages/components/src/disabled/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -47,6 +47,8 @@ function CustomButton( props ) {
}
```

_Note: this component may not behave as expected in browsers that don't support [the `inert` HTML attribute](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert). We recommend adding [the official WICG polyfill](https://github.com/WICG/inert) when using this component in your project._

### Props

The component accepts the following props:
Expand Down
9 changes: 8 additions & 1 deletion packages/components/src/disabled/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,14 @@ const Context = createContext< boolean >( false );
const { Consumer, Provider } = Context;

/**
* `Disabled` is a component which disables descendant tabbable elements and prevents pointer interaction.
* `Disabled` is a component which disables descendant tabbable elements and
* prevents pointer interaction.
*
* _Note: this component may not behave as expected in browsers that don't
* support the `inert` HTML attribute. We recommend adding the official WICG
* polyfill when using this component in your project._
*
* @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert
*
* ```jsx
* import { Button, Disabled, TextControl } from '@wordpress/components';
Expand Down

0 comments on commit 69a3cac

Please sign in to comment.