Toggle.fusion

prototype(Carbon.Plausible:Component.Toggle) < prototype(Neos.Fusion:Component) {
    domain = ${Carbon.Plausible.getDomain(request.httpRequest)}
    statusClass = ${null}
    buttonClass = ${null}

    renderer = afx`
        <p style='display:none' class={Carbon.String.merge(props.statusClass, '-plausible-status')}>
            <span class='-plausible-disabled'>
                {Translation.translate('trackingIsDisabled', 'Tracking for {0} from this browser is disabled.', [props.domain], 'Main', 'Carbon.Plausible')}
            </span>
            <span class='-plausible-enabled'>
                {Translation.translate('trackingIsEnabled', 'Tracking for {0} from this browser is enabled.', [props.domain], 'Main', 'Carbon.Plausible')}
            </span>
        </p>
        <button style='display:none' class={Carbon.String.merge(props.buttonClass, '-plausible-button')} type='button'>
            <span class='-plausible-disabled'>
                {Translation.translate('enableTracking', 'Enable tracking', [], 'Main', 'Carbon.Plausible')}
            </span>
            <span class='-plausible-enabled'>
                {Translation.translate('disableTracking', 'Disable tracking', [], 'Main', 'Carbon.Plausible')}
            </span>
        </button>
        <script>
            {StaticResource.content('Carbon.Plausible', 'Public/Toggle.js')}
        </script>
    `
}