import { __assign, __extends } from "tslib";
import * as React from 'react';
import { Customizations } from './Customizations';
import { hoistStatics } from '../hoistStatics';
import { CustomizerContext } from './CustomizerContext';
import { concatStyleSets, makeShadowConfig } from '@fluentui/merge-styles';
import { MergeStylesShadowRootConsumer } from '../shadowDom/contexts/MergeStylesShadowRootConsumer';
import { getWindow } from '../dom/getWindow';
import { WindowContext } from '@fluentui/react-window-provider';
import { memoizeFunction } from '../memoize';
var memoizedMakeShadowConfig = memoizeFunction(makeShadowConfig);
var mergeComponentStyles = memoizeFunction(
// eslint-disable-next-line @typescript-eslint/no-explicit-any
function (defaultStyles, componentStyles, shadowConfig) {
    var _a;
    var styles = (_a = componentStyles !== null && componentStyles !== void 0 ? componentStyles : defaultStyles) !== null && _a !== void 0 ? _a : {};
    styles.__shadowConfig__ = shadowConfig;
    return styles;
});
export function customizable(scope, fields, concatStyles) {
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    return function customizableFactory(ComposedComponent) {
        var _a;
        var resultClass = (_a = /** @class */ (function (_super) {
                __extends(ComponentWithInjectedProps, _super);
                function ComponentWithInjectedProps(props) {
                    var _this = _super.call(this, props) || this;
                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
                    _this._styleCache = {};
                    _this._onSettingChanged = _this._onSettingChanged.bind(_this);
                    return _this;
                }
                ComponentWithInjectedProps.prototype.componentDidMount = function () {
                    Customizations.observe(this._onSettingChanged);
                };
                ComponentWithInjectedProps.prototype.componentWillUnmount = function () {
                    Customizations.unobserve(this._onSettingChanged);
                };
                ComponentWithInjectedProps.prototype.render = function () {
                    var _this = this;
                    return (React.createElement(MergeStylesShadowRootConsumer, { stylesheetKey: scope }, function (inShadow) {
                        return (React.createElement(CustomizerContext.Consumer, null, function (context) {
                            var _a;
                            var defaultProps = Customizations.getSettings(fields, scope, context.customizations);
                            var win = (_a = _this.context.window) !== null && _a !== void 0 ? _a : getWindow();
                            var shadowConfig = memoizedMakeShadowConfig(scope, inShadow, win);
                            // eslint-disable-next-line @typescript-eslint/no-explicit-any
                            var componentProps = _this.props;
                            // If defaultProps.styles is a function, evaluate it before calling concatStyleSets
                            if (defaultProps.styles && typeof defaultProps.styles === 'function') {
                                defaultProps.styles = defaultProps.styles(__assign(__assign({}, defaultProps), componentProps));
                            }
                            // If concatStyles is true and custom styles have been defined compute those styles
                            if (concatStyles && defaultProps.styles) {
                                if (_this._styleCache.default !== defaultProps.styles ||
                                    _this._styleCache.component !== componentProps.styles) {
                                    var mergedStyles = concatStyleSets(defaultProps.styles, componentProps.styles);
                                    mergedStyles.__shadowConfig__ = shadowConfig;
                                    _this._styleCache.default = defaultProps.styles;
                                    _this._styleCache.component = componentProps.styles;
                                    _this._styleCache.merged = mergedStyles;
                                }
                                return (React.createElement(ComposedComponent, __assign({}, defaultProps, componentProps, { styles: _this._styleCache.merged })));
                            }
                            var styles = mergeComponentStyles(defaultProps.styles, componentProps.styles, shadowConfig);
                            return React.createElement(ComposedComponent, __assign({}, defaultProps, componentProps, { styles: styles }));
                        }));
                    }));
                };
                ComponentWithInjectedProps.prototype._onSettingChanged = function () {
                    this.forceUpdate();
                };
                return ComponentWithInjectedProps;
            }(React.Component)),
            _a.displayName = 'Customized' + scope,
            _a.contextType = WindowContext,
            _a);
        return hoistStatics(ComposedComponent, resultClass);
    };
}
//# sourceMappingURL=customizable.js.map