0
0
mirror of https://github.com/wagtail/wagtail.git synced 2024-11-24 10:58:52 +01:00
wagtail/client/storybook/preview.js
LB Johnston f0b6509f29 Rework sidebar .ready class addition
- Remove the sidebar duplicate JS that would also add a ready class but NOT after a settimeout, only after the component renders
- This means we now have one location in the code that does this, driven by Stimulus
- Update the Storybook preview JS so that we can rely on similar behaviour in Storybook for transitions
2023-10-25 08:55:09 +11:00

55 lines
1.5 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

import { domReady } from '../src/utils/domReady';
import '../tests/stubs';
import '../../wagtail/admin/static_src/wagtailadmin/scss/core.scss';
import './preview.scss';
export const parameters = {
controls: {
hideNoControlsWarning: true,
matchers: {
color: /(background|color)$/i,
date: /Date$/,
},
},
};
const cachedIcons = sessionStorage.getItem('WAGTAIL_ICONS');
window.WAGTAIL_ICONS = cachedIcons ? JSON.parse(cachedIcons) : [];
/**
* Loads Wagtails icon sprite into the DOM, similarly to the admin.
*/
const loadIconSprite = () => {
const PATTERN_LIBRARY_SPRITE_URL = '/pattern-library/api/v1/sprite';
window
.fetch(PATTERN_LIBRARY_SPRITE_URL)
.then((res) => res.text())
.then((html) => {
const sprite = document.createElement('div');
sprite.innerHTML = html;
const symbols = Array.from(sprite.querySelectorAll('symbol'));
const icons = symbols.map((elt) => elt.id.replace('icon-', '')).sort();
window.WAGTAIL_ICONS = icons;
sessionStorage.setItem('WAGTAIL_ICONS', JSON.stringify(icons));
if (document.body) {
document.body.appendChild(sprite);
} else {
window.addEventListener('DOMContentLoaded', () => {
document.body.appendChild(sprite);
});
}
});
};
domReady().then(() => {
// Add ready class to body to enable CSS transitions
// Emulates what happens in Wagtail admin when initial content is loaded
document.body.classList.add('ready');
});
loadIconSprite();