import '../../../assert/js/assert.js';
import '../../../globals.js';
// Copyright 2021-2024, University of Colorado Boulder
/**
 * A ToggleSwitch decorated with a visual label and description with layout for each. To be used in the
 * PreferencesDialog.
 *
 * @author Jesse Greenberg (PhET Interactive Simulations)
 * @author Marla Schulz (PhET Interactive Simulations)
 */
import optionize from '../../../phet-core/js/optionize.js';
import { GridBox, SceneryConstants } from '../../../scenery/js/imports.js';
import joist from '../joist.js';
// Layout using GridBox and layoutOptions will accomplish the following when all components are available.
// [[labelNode]]         [[ToggleSwitch]]
// [[descriptionNode                   ]]
class PreferencesControl extends GridBox {
    constructor(providedOptions) {
        const options = optionize()({
            headingControl: false,
            labelSpacing: 10,
            allowDescriptionStretch: true,
            valueLabelXSpacing: 8,
            ySpacing: 5,
            nestedContent: [],
            grow: 1,
            layoutOptions: {
                stretch: !providedOptions?.headingControl
            }
        }, providedOptions);
        super(options);
        if (options.controlNode) {
            assert && assert(options.controlNode.layoutOptions === null, 'PreferencesControl will control layout');
            this.enabledProperty.link(enabled => {
                options.controlNode.enabled = enabled;
            });
            options.controlNode.layoutOptions = {
                row: 0,
                column: 1,
                xAlign: 'right'
            };
            this.addChild(options.controlNode);
        }
        if (options.labelNode) {
            assert && assert(options.labelNode.layoutOptions === null, 'PreferencesControl will control layout');
            options.labelNode.layoutOptions = {
                row: 0,
                column: 0,
                xAlign: 'left',
                rightMargin: options.labelSpacing
            };
            this.addChild(options.labelNode);
        }
        // descriptionNode will be in the second row if a labelNode is provided.
        if (options.descriptionNode && options.labelNode) {
            assert && assert(options.descriptionNode.layoutOptions === null, 'PreferencesControl will control layout');
            const layoutOptions = {
                row: 1,
                column: 0,
                horizontalSpan: 2,
                xAlign: 'left'
            };
            // Allows the description to stretch and takes up a minimum width, so that the control aligns with other contents.
            if (options.allowDescriptionStretch) {
                layoutOptions.minContentWidth = 480;
                layoutOptions.stretch = true;
            }
            options.descriptionNode.layoutOptions = layoutOptions;
            this.addChild(options.descriptionNode);
        }
        // descriptionNode will be in the first row if labelNode is not provided.
        else if (options.descriptionNode) {
            assert && assert(options.descriptionNode.layoutOptions === null, 'PreferencesControl will control layout');
            options.descriptionNode.layoutOptions = {
                row: 0,
                column: 0,
                xAlign: 'left'
            };
            this.addChild(options.descriptionNode);
        }
        // This component manages disabledOpacity, we don't want it to compound over subcomponents.
        this.disabledOpacity = SceneryConstants.DISABLED_OPACITY;
    }
}
joist.register('PreferencesControl', PreferencesControl);
export default PreferencesControl;
//# sourceMappingURL=PreferencesControl.js.map