import { RawHTML } from '@wordpress/element';

const { controls: registeredControls } = window.VPGutenbergVariables;

export default Object.keys( registeredControls.layout.options ).map(
	( name ) => {
		const data = registeredControls.layout.options[ name ];

		return {
			// If we don't set the isDefault, our main block will be visible in inserter.
			// Sometimes users requested this as they are confused it first start.
			// isDefault: registeredControls.layout.default === data.value,
			name: data.value,
			attributes: { layout: data.value },
			title: data.title,
			icon: data.icon
				? {
						foreground: '#2540CC',
						src: <RawHTML>{ data.icon }</RawHTML>,
				  }
				: null,
		};
	}
) || [];
