Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Interactiviy API Docs: Merge Interactivity docs to keep consistency with other packages. #59270

Merged
merged 6 commits into from
Feb 22, 2024

Conversation

cbravobernal
Copy link
Contributor

What?

This PR moves the Interactivity API docs folder to a main README file. It also updates the docs with the last changes, removing all the experimental references and adding the 6.5 Core announcement.

Copy link

github-actions bot commented Feb 22, 2024

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: c4rl0sbr4v0 <[email protected]>
Co-authored-by: fabiankaegy <[email protected]>
Co-authored-by: DAreRodz <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

Copy link

github-actions bot commented Feb 22, 2024

Flaky tests detected in d5d92fb.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/8005211442
📝 Reported issues:

Comment on lines 17 to 21
Install the module:

At this point, some of the questions you have about the Interactivity API may be:
```bash
npm install @wordpress/interactivity --save
```
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I know this was there in the previous docs but I would add a note here that this step is only required if you are building outside of WordPress...

Within WordPress you don't need to install the package via NPM because it is bundled with WordPress core and all you need to do to ensure it is loaded is adding wp-interactivity to the dependency array of the module script.

Which happens automatically when you use the dependency ectraction webpack plugin that is used in tools like wp-scripts.


### Where can I share my feedback about the API?
When the plugin folder is generated, the build process needs to be launched to get the final version of the interactive block that can be used from WordPress.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
When the plugin folder is generated, the build process needs to be launched to get the final version of the interactive block that can be used from WordPress.
When the plugin folder is generated, the build process needs to be launched to get a working version of the interactive block that can be used in WordPress.

@@ -659,7 +659,7 @@ It would generate the following output:
</ul>
```

The prop that holds the item in the context can be changed by passing a suffix to the directive name. In the following example, we change the default prop `item` to `greeting`.
The prop that holds the item in the context can be changed by passing a suffix to the directive name. In the following example, the default prop changes from `item` to `greeting`.

```html
<ul data-wp-context='{ "list": [ "hello", "hola", "olá" ] }'>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm still a little confised when you would use wp_interactivity_state over a raw data-wp-context

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The main difference between state and context is that the first one is globally accessible, i.e., any directive at any part of the page can access it (as long as it's not locked), whereas the second one is "inherited" (only directives inside of it can access the context), and can be locally extended or "shadowed" by adding other elements inside it with their own data-wp-context directive.

Copy link
Member

@fabiankaegy fabiankaegy left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks good to me :)

@cbravobernal cbravobernal merged commit 34c9431 into trunk Feb 22, 2024
57 checks passed
@cbravobernal cbravobernal deleted the update/interactivity-docs-merge branch February 22, 2024 15:21
@github-actions github-actions bot added this to the Gutenberg 17.9 milestone Feb 22, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Packages] Interactivity /packages/interactivity [Type] Developer Documentation Documentation for developers
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants