import '../../chipper/js/browser/initialize-globals.js';
import '../../assert/js/assert.js';
import '../../globals.js';
import { Shape } from '../../kite/js/imports.js';
import InstanceRegistry from '../../phet-core/js/documentation/InstanceRegistry.js';
import optionize from '../../phet-core/js/optionize.js';
import { Path } from '../../scenery/js/imports.js';
import Tandem from '../../tandem/js/Tandem.js';
import BooleanRectangularToggleButton from './buttons/BooleanRectangularToggleButton.js';
import ButtonNode from './buttons/ButtonNode.js';
import sun from './sun.js';
// constants
const SYMBOL_RELATIVE_WIDTH = 0.6; // width of +/- symbols relative to button sideLength (see options)
const RELATIVE_X_MARGIN = (1 - SYMBOL_RELATIVE_WIDTH) / 2; // margin to produce a button of specified sideLength
export default class ExpandCollapseButton extends BooleanRectangularToggleButton {
    constructor(expandedProperty, providedOptions) {
        const options = optionize()({
            // SelfOptions
            sideLength: 25,
            // BooleanRectangularToggleButtonOptions
            stroke: 'black',
            touchAreaXDilation: 5,
            touchAreaYDilation: 5,
            // phet-io
            tandem: Tandem.REQUIRED,
            tandemNameSuffix: 'Button'
        }, providedOptions);
        // BooleanRectangularToggleButtonOptions that are controlled by ExpandCollapseButton
        options.cornerRadius = 0.1 * options.sideLength;
        options.xMargin = RELATIVE_X_MARGIN * options.sideLength;
        options.yMargin = options.xMargin;
        options.buttonAppearanceStrategy = ButtonNode.FlatAppearanceStrategy;
        // configure the +/- symbol on the button
        const symbolLength = SYMBOL_RELATIVE_WIDTH * options.sideLength;
        const symbolLineWidth = 0.15 * options.sideLength;
        const symbolOptions = {
            lineWidth: symbolLineWidth,
            stroke: 'white',
            centerX: options.sideLength / 2,
            centerY: options.sideLength / 2,
            pickable: false
        };
        // Expand '+' content
        const plusSymbolShape = new Shape()
            .moveTo(symbolLength / 2, 0)
            .lineTo(symbolLength / 2, symbolLength)
            .moveTo(0, symbolLength / 2)
            .lineTo(symbolLength, symbolLength / 2);
        const expandNode = new Path(plusSymbolShape, symbolOptions);
        // Collapse '-' content
        const minusSymbolShape = new Shape()
            .moveTo(-symbolLength / 2, 0)
            .lineTo(symbolLength / 2, 0);
        const collapseNode = new Path(minusSymbolShape, symbolOptions);
        super(expandedProperty, collapseNode, expandNode, options);
        // listeners must be removed in dispose
        const expandedPropertyObserver = (expanded) => {
            //TODO use PhetColorScheme.RED_COLORBLIND, see https://github.com/phetsims/sun/issues/485
            this.baseColor = expanded ? 'rgb( 255, 85, 0 )' : 'rgb( 0, 179, 0 )';
            this.setPDOMAttribute('aria-expanded', expanded);
        };
        expandedProperty.link(expandedPropertyObserver);
        // support for binder documentation, stripped out in builds and only runs when ?binder is specified
        assert && window.phet?.chipper?.queryParameters?.binder && InstanceRegistry.registerDataURL('sun', 'ExpandCollapseButton', this);
        this.disposeExpandCollapseButton = () => {
            expandedProperty.unlink(expandedPropertyObserver);
        };
    }
    dispose() {
        this.disposeExpandCollapseButton();
        super.dispose();
    }
}
sun.register('ExpandCollapseButton', ExpandCollapseButton);
//# sourceMappingURL=ExpandCollapseButton.js.map