Computed CSS class list in Svelte

button.html

<button class="{css}">
	Next page
</button>

<script>
import getClassListFromObject from './utils.js';

export default {
	computed: {
		css: ({ wide }) => {
			return getClassListFromObject({
				'ui-button': true,
				'ui-button--wide': !!wide
			});
		}
	}
}
</script>

utils.js

const getClassListFromObject = (config) => {
	if (typeof config !== 'object') {
		throw new Error('getClassListFromObject: expects an object');
	}

	return Object.keys(config).filter(className => config[className]).join(' ');
};

export default getClassListFromObject;