import { createElement, Fragment, useEffect, useState, } from '@wordpress/element' import { __ } from 'ct-i18n' import { Switch } from 'blocksy-options' import ConditionsManager from './ConditionsManager' import { Overlay } from 'blocksy-options' const DisplayCondition = ({ option: { // inline | modal display = 'inline', filter = 'all', modalTitle = __( 'Transparent Header Display Conditions', 'blocksy-companion' ), modalDescription = __( 'Add one or more conditions to display the transparent header.', 'blocksy-companion' ), addConditionButtonLabel = __( 'Add Display Condition', 'blocksy-companion' ), }, value, onChange, }) => { const [isEditing, setIsEditing] = useState(false) const [localValue, setLocalValue] = useState(null) if (display === 'inline') { return (
) } return (
{ e.preventDefault() setIsEditing(true) setLocalValue(null) }}> {Object.keys(value).length > 0 ? __('Edit Conditions', 'blocksy-companion') : __('Add Conditions', 'blocksy-companion')}
{ setIsEditing(false) setLocalValue(null) }} render={() => (
{modalTitle}
{modalDescription}
{ setLocalValue(value) }} addConditionButtonLabel={ addConditionButtonLabel } />
{ onChange(localValue) setIsEditing(false) }}> {__('Save Conditions', 'blocksy-companion')}
)} />
) } export default DisplayCondition