Write with ES2015 (ES6)
📝 Note: Bolt ships with our own customized Babel config present and plugins to ensure our coding standards and conventions are transpired based on our current browser support.
These docs will continue to be updated accordingly however it's clear that JSX and Template literal rendering options are a vital part of the direction we're heading in (more of just a question on whether that's via one or a small handful of options). 😉
Framework-less Custom Elements
@bolt/core For Shared Dependencies
import(/* webpackMode: 'eager', webpackChunkName: 'bolt-button' */ '@bolt/components-button');
Polyfill Features, Not Browsers
- Older browsers get the compatibility they need and newer browsers aren’t bogged down by downloading and running unnecessary code.
Dynamic Data = More Maintainable, Consistent Components
- Whenever possible, components should pull in and reference dynamic data created directly from the codebase when configuring what options or parameters a particular component should allow.
For example, our Icon component’s allowed icon sizes are directly tied in with the [JSON data](https://github.com/bolt-design-system/bolt/blob/release/0.x/packages/bolt-core/data/spacing-sizes.js) exported from our spacing scale. Update the scale in one place, the related components are updated automatically.
- This improves component maintainability and simplifies the consumption and integration by other developers. Other component-specific assets (Sass, Twig templates, Markdown docs, and so on) follow this convention as well.