Whitelist

Mojo's whitelist enables you to specify a set of utilities to be compiled even if they're not used directly in the markup.

The structure of a whitelist object is as follows:


mojo({
    whitelist: {
        // whitelisted utilities
    },
    // ... other configurations
});

Specifying the utilities is similar to how Patterns work. Here a example:


mojo({
    whitelist: {
        idle: 'translate-x-12 opacity-0',
        hover: 'opacity-100'
    },
    // ... other configurations
});

whitelist can be used with the Ignore Observe attribute to pre-compile specific utilities and prevent them from being re-compiled whenever the DOM changes.