Remove unnecessary Tailwind class compilation calls

[bkrmendy]

Editions store

Problem

The Tailwind class generation code was running twice at the end of an interaction. Instead, we only want to re-run the tailwind compilation code when

• a new element is added to the DOM or the class attribute of an element is updated
• the Tailwind config file is updated (so tweaks to the tailwind config show up right away on the canvas)

Fix

• remove the RequireFn param from useTailwindCompilation. This param is problematic because a new requireFn is passed to useTailwindCompilation whenever projectContents changes, which triggers a re-compilation. Instead, the require fn is constructed in a useRefEditorState and used through that ref
• The Tailwind config file is selected with a hook using createSelector for memoization
• The mutation observer that runs the Tailwind class generation is only run if there were new nodes added (with potentially new Tailwind classes added to the DOM) or a class attribute was updated (with a potentially new Tailwind class)

Out of scope

This PR doesn't deal with the problem of generating new Tailwind classes only for the elements that have changed. This is due to how the library we use for tailwind class compilation works, finding a more fine-grained way to do this would be a more involved task

Details

• The PR also adds a test that tests tailwind style generation with Remix navigation

[github-actions]

Try me

[relativeci]

#14863 Bundle Size — 57.98MiB (~+0.01%).

243afaf(current) vs 916e8b9 master#14861(baseline)

Warning

Bundle contains 70 duplicate packages – View duplicate packages

Bundle metrics   2 changes 1 regression

	Current #14863	Baseline #14861
Initial JS	40.97MiB(~+0.01%)	40.97MiB
Initial CSS	0B	0B
Cache Invalidation	18%	17.88%
Chunks	20	20
Assets	22	22
Modules	4153	4153
Duplicate Modules	213	213
Duplicate Code	27.33%	27.33%
Packages	477	477
Duplicate Packages	70	70

Bundle size by type   2 changes 1 regression 1 improvement

	Current #14863	Baseline #14861
JS	57.98MiB (~+0.01%)	57.97MiB
HTML	7.37KiB (-0.25%)	7.39KiB

Bundle analysis report Branch fix/tailwind-fine-grained-dom-ob... Project dashboard

---

^{Generated by RelativeCI Documentation Report issue}