-
Notifications
You must be signed in to change notification settings - Fork 247
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
Use createAll
to initialise components in the Design System site
#4053
Conversation
✅ You can preview this change here:
To edit notification comments on pull requests, go to your Netlify site configuration. |
- Adds entry in .browserslistrc for our JavaScript supported browsers - Update Babel's configuration to use that list when compiling JavaScript - Configure Rollup to run Babel when bundling JavaScript
1f2fdbe
to
370c1f0
Compare
Aligns the naming with the `data-module` attribute, which is more precise than just 'example'
370c1f0
to
5ee912a
Compare
this.$module.prepend(this.$status) | ||
this.$module.prepend(this.$button) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
note $module
is no longer the <pre>
element containing the code, but the <div>
wrapping it, which simplifies the insertion of the button and hidden status for assistive technology.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
this all looks good to me! nice work!
As using
createAll
requires component to hold a staticmoduleName
property, this PR updates the build process to add transpilation of the JavaScript with Babel (rather than relying on code being authored to match JavaScript features, linted by es-x).It then uses createAll to instantiate components that were previously looked up using
document.querySelector[All]
inapplication.js
.Components not updated
OptionsTable
works based on the hash, rather than specific elements on the page. It could actually be refactored as a function rather than a class.Navigation
doesn't really have a 'root' element as it looks things up in the document. It could be broken down into two components with root elements, one for the menu itself and the other for the subnav collapsing, but that's a different refactoring.Fixes #3812