// External dependencies.
import React, { ReactElement } from 'react';

// Divi dependencies.
import {
	StyleContainer,
	StylesProps,
} from '@divi/module';

// Local dependencies.
import { HiddenAttrs } from './types';

/**
 * Hidden module style components.
 *
 * @since ??
 */
const ModuleStyles = ({
	settings,
	mode,
	state,
	noStyleTag,
	elements,
}: StylesProps<HiddenAttrs>): ReactElement => (
	<StyleContainer mode={mode} state={state} noStyleTag={noStyleTag}>
		{elements.style({
			attrName: 'module',
			styleProps: {
				disabledOn: {
					disabledModuleVisibility: settings?.disabledModuleVisibility,
				},
			},
		})}
	</StyleContainer>
);

export {
	ModuleStyles,
};
