rn-custom-style-sheet/lib/commonjs/Core/Provider/ThemeProvider.js

React Native component to select a specific value from a range of values.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.ThemeProvider = ThemeProvider;
var _react = _interopRequireWildcard(require("react"));
var _BreakPoint = require("../../BreakPoint");
var _MediaQuery = require("../../MediaQuery");
var _Scaling = require("../../Scaling");
var _Context = require("../Context");
var _Hooks = require("../Hooks");
var _Reducer = require("../Reducer");
var _Theming = require("../../Theming");
var _reactNative = require("react-native");
var _Utils = require("../Utils");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function ThemeProvider({
  children,
  isSupportedOrientation,
  isUsedBuiltInAspectRatioFunction,
  withPortraitBehaviorInLandscapeMode,
  deviceForMediaQuery,
  guideLineLayout,
  guideLineBreakpoint,
  storage,
  appThemeName,
  baseSizeLayout
}) {
  const [state, dispatch] = (0, _react.useReducer)(_Reducer.themeReducer, _Context.initialThemeState);
  (0, _Hooks.useSystemAppearance)(dispatch, storage);
  const localGuideLineLayout = (0, _react.useMemo)(() => ({
    width: guideLineLayout?.width ?? 375,
    height: guideLineLayout?.height ?? 812
  }), [guideLineLayout]);
  (0, _Hooks.useDeviceOrientation)(dispatch, isSupportedOrientation, guideLineBreakpoint?.values ?? _BreakPoint.breakpointValue, withPortraitBehaviorInLandscapeMode, localGuideLineLayout, baseSizeLayout);
  (0, _react.useEffect)(() => {
    const localAppThemeName = storage.getStorage(_Theming.StorageKeys.AppThemeNameKey, '');
    const localAppThemeMode = storage.getStorage(_Theming.StorageKeys.AppThemeModeKey, _Reducer.AppThemeModeEnum.System);
    const localSystemThemeMode = storage.getStorage(_Theming.StorageKeys.SystemThemeModeKey, _Reducer.AppThemeModeEnum.System);
    const screenInitConfig = (0, _Hooks.getScreenResolution)(_reactNative.Dimensions.get('window'), withPortraitBehaviorInLandscapeMode);
    const generalScreenInitConfig = (0, _Hooks.getGeneralScreenResolution)(screenInitConfig.screenResolution, localGuideLineLayout, baseSizeLayout);

    // Trigger first time only
    if (localAppThemeName !== appThemeName && localAppThemeName.length <= 0) {
      storage.setStorage(_Theming.StorageKeys.AppThemeNameKey, appThemeName);
    }
    dispatch({
      type: _Reducer.ReducerEventEnum.Initial,
      payload: {
        isSupportedOrientation,
        isUsedBuiltInAspectRatioFunction,
        withPortraitBehaviorInLandscapeMode,
        deviceForMediaQuery: (0, _MediaQuery.getDevice)(undefined, deviceForMediaQuery),
        guideLineLayout: localGuideLineLayout,
        guideLineBreakpoint: {
          values: guideLineBreakpoint?.values ?? _BreakPoint.breakpointValue,
          unit: guideLineBreakpoint?.unit ?? _Utils.UnitEnum.Px,
          step: guideLineBreakpoint?.step ?? 0,
          keys: Object.keys((0, _BreakPoint.sortBreakpointValues)(guideLineBreakpoint?.values ?? _BreakPoint.breakpointValue))
        },
        appThemeName: localAppThemeName || appThemeName,
        appThemeMode: localAppThemeMode,
        systemThemeMode: localSystemThemeMode,
        currentBreakpointIndex: (0, _BreakPoint.getCurrentBreakpointIndex)(guideLineBreakpoint?.values ?? _BreakPoint.breakpointValue, screenInitConfig.screenResolution.windowWidth),
        orientation: isSupportedOrientation ? screenInitConfig.orientation : _Reducer.OrientationEnum.Portrait,
        screenResolution: screenInitConfig.screenResolution,
        generalScreenResolution: generalScreenInitConfig
      }
    });
  }, [deviceForMediaQuery, guideLineBreakpoint, localGuideLineLayout, isSupportedOrientation, isUsedBuiltInAspectRatioFunction, withPortraitBehaviorInLandscapeMode, storage, appThemeName, baseSizeLayout]);
  const value = (0, _react.useMemo)(() => {
    return {
      state: {
        ...state,
        guideLineLayout: {
          ...state.guideLineLayout,
          aspectRatioFunction: guideLineLayout?.aspectRatioFunction ?? (state.isUsedBuiltInAspectRatioFunction ? (0, _Scaling.getNewSize)(state.screenResolution) : size => size)
        }
      },
      dispatch,
      storage
    };
  }, [state, storage, guideLineLayout?.aspectRatioFunction]);
  if ((appThemeName?.length ?? 0) > 0 && (state.appThemeName?.length ?? 0) <= 0) {
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
  }
  return /*#__PURE__*/_react.default.createElement(_Context.ThemeContext.Provider, {
    value: value
  }, children);
}
ThemeProvider.defaultProps = {
  appThemeName: '',
  isSupportedOrientation: false,
  isUsedBuiltInAspectRatioFunction: false,
  withPortraitBehaviorInLandscapeMode: false
};
//# sourceMappingURL=ThemeProvider.js.map