Function useControllableValue

docs/app/js/sanddance-app.js:34607–34634

(controlledValue, defaultUncontrolledValue, onChange)

var _react = require("react");
var _useConst = require("./useConst");
function useControllableValue(controlledValue, defaultUncontrolledValue, onChange) {
    var _a = _react.useState(defaultUncontrolledValue), value = _a[0], setValue = _a[1];
    var isControlled = (0, _useConst.useConst)(controlledValue !== undefined);
    var currentValue = isControlled ? controlledValue : value;
    // Duplicate the current value and onChange in refs so they're accessible from
    // setValueOrCallOnChange without creating a new callback every time
    var valueRef = _react.useRef(currentValue);
    var onChangeRef = _react.useRef(onChange);
    _react.useEffect(function() {
        valueRef.current = currentValue;
        onChangeRef.current = onChange;
    });
    // To match the behavior of the setter returned by React.useState, this callback's identity
    // should never change. This means it MUST NOT directly reference variables that can change.
    var setValueOrCallOnChange = (0, _useConst.useConst)(function() {
        return function(update, ev) {
            // Assuming here that TValue is not a function, because a controllable value will typically
            // be something a user can enter as input
            var newValue = typeof update === "function" ? update(valueRef.current) : update;
            if (onChangeRef.current) onChangeRef.current(ev, newValue);
            if (!isControlled) setValue(newValue);
        };
    });
    return [
        currentValue,
        setValueOrCallOnChange
    ];
}

},{"react":"8ePka","./useConst":"jDC9C","@parcel/transformer-js/src/esmodule-helpers.js":"jA2du"}],"exwLQ":[function(require,module,exports) {
var parcelHelpers = require("@parcel/transformer-js/src/esmodule-helpers.js");