@wordpress/compose/build/higher-order/with-preferred-color-scheme/index.native.js

WordPress higher-order components (HOCs).

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _createHigherOrderComponent = require("../../utils/create-higher-order-component");
var _usePreferredColorScheme = _interopRequireDefault(require("../../hooks/use-preferred-color-scheme"));
var _element = require("@wordpress/element");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * Internal dependencies
 */

/**
 * WordPress dependencies
 */

const withPreferredColorScheme = (0, _createHigherOrderComponent.createHigherOrderComponent)(WrappedComponent => props => {
  const colorScheme = (0, _usePreferredColorScheme.default)();
  const isDarkMode = colorScheme === 'dark';
  const getStyles = (0, _element.useCallback)((lightStyles, darkStyles) => {
    const finalDarkStyles = {
      ...lightStyles,
      ...darkStyles
    };
    return isDarkMode ? finalDarkStyles : lightStyles;
  }, [isDarkMode]);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(WrappedComponent, {
    preferredColorScheme: colorScheme,
    getStylesFromColorScheme: getStyles,
    ...props
  });
}, 'withPreferredColorScheme');
var _default = exports.default = withPreferredColorScheme;
//# sourceMappingURL=index.native.js.map