rn-custom-style-sheet/lib/module/Scaling/Utils/Scale/Scale.js

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

import { getBreakpointValueByIndex, hasValidBreakpointPropertyFormat } from '../../../BreakPoint';
import { toPx, UnitEnum } from '../../../Core';
import { heightPercentageToDP, horizontalScale, moderateHorizontalScale, moderateVerticalScale, sdp, ssp, verticalScale, viewportHeight, viewportMax, viewportMin, viewportWidth, widthPercentageToDP, scale, moderateScale } from '../Metrics';

// Groups   Size Unit   Func    Factor threshold SkipAspectRatio Round
// Index     1    2   3/4/6/10   5/7     9/12         13          14

const validScaleSheetRegex = new RegExp(
// eslint-disable-next-line no-useless-escape
/^(\-?\d+(?:\.\d{1,3})?)(em|rem|px|cm|mm|in|pt|pc)?@(hs|vs|wp|hp|vh|vw|vmin|vmax|sdp|ssp|(mvs|mhs)(\d+(?:\.\d{1,2})?)?|(ms)(\d+(?:\.\d{1,2})?)?(t(\d+(?:\.\d{1,2})?))?|(s)(t(\d+(?:\.\d{1,2})?))?)(sar)?(r)?$/i);
export function scaleFunc(screenResolution, guideLineLayout, guideLineBreakpoint, generalScreenResolution, currentBreakpointIndex) {
  return function scalingFn(value) {
    let derivedValue = value;
    if (hasValidBreakpointPropertyFormat(derivedValue, guideLineBreakpoint)) {
      derivedValue = getBreakpointValueByIndex(derivedValue, currentBreakpointIndex, guideLineBreakpoint);
    }
    try {
      if (!validScaleSheetRegex.test(derivedValue)) {
        return derivedValue;
      }
      const regexExecResult = validScaleSheetRegex.exec(derivedValue);
      // get the size of the component
      const size = parseFloat(regexExecResult?.[1] ?? '0');

      // get the unit of the value
      const unit = regexExecResult?.[2]?.toLowerCase() ?? UnitEnum.Px;

      // get the scale factor for font or it's string or undefined values
      const scaleFactor1 = regexExecResult?.[5];
      const scaleFactor2 = regexExecResult?.[7];
      const finalScaleFactor = scaleFactor1 ?? scaleFactor2;

      // get the scale threshold or it's string or undefined values
      const threshold1 = regexExecResult?.[9];
      const threshold2 = regexExecResult?.[12];
      const finalThreshold = threshold1 ?? threshold2;

      // get the scale function
      const scaleFuncNameIndex = scaleFactor1 ? 4 : scaleFactor2 ? 6 : threshold2 ? 10 : 3;
      const scaleFuncName = regexExecResult?.[scaleFuncNameIndex]?.toLowerCase() ?? '';

      // skip the aspect ratio or not
      const skipAspectRatio = regexExecResult?.[13]?.toLowerCase() === 'sar';

      // should result is round or not
      const shouldRound = regexExecResult?.[14]?.toLowerCase() === 'r';
      const convertSize = toPx(size, unit);
      const threshold = finalThreshold ? parseFloat(finalThreshold) : undefined;
      const scaleFactor = parseFloat(finalScaleFactor ?? '0.5');
      let result;
      switch (scaleFuncName) {
        case 's':
          result = scale(guideLineLayout, generalScreenResolution)(convertSize, skipAspectRatio, threshold);
          break;
        case 'ms':
          result = moderateScale(guideLineLayout, generalScreenResolution)(convertSize, skipAspectRatio, threshold, scaleFactor);
          break;
        case 'hs':
          result = horizontalScale(screenResolution, guideLineLayout)(convertSize, skipAspectRatio);
          break;
        case 'vs':
          result = verticalScale(screenResolution, guideLineLayout)(convertSize, skipAspectRatio);
          break;
        case 'mhs':
          result = moderateHorizontalScale(screenResolution, guideLineLayout)(convertSize, skipAspectRatio, scaleFactor);
          break;
        case 'mvs':
          result = moderateVerticalScale(screenResolution, guideLineLayout)(convertSize, skipAspectRatio, scaleFactor);
          break;
        case 'hp':
          result = heightPercentageToDP(screenResolution, guideLineLayout)(convertSize, skipAspectRatio);
          break;
        case 'wp':
          result = widthPercentageToDP(screenResolution, guideLineLayout)(convertSize, skipAspectRatio);
          break;
        case 'vmin':
          result = viewportMin(screenResolution, guideLineLayout)(convertSize, skipAspectRatio);
          break;
        case 'vmax':
          result = viewportMax(screenResolution, guideLineLayout)(convertSize, skipAspectRatio);
          break;
        case 'vh':
          result = viewportHeight(screenResolution, guideLineLayout)(convertSize, skipAspectRatio);
          break;
        case 'vw':
          result = viewportWidth(screenResolution, guideLineLayout)(convertSize, skipAspectRatio);
          break;
        case 'sdp':
          result = sdp(screenResolution, guideLineLayout)(convertSize, skipAspectRatio);
          break;
        case 'ssp':
          result = ssp(screenResolution, guideLineLayout)(convertSize, skipAspectRatio);
          break;
        default:
      }
      return shouldRound ? Math.round(result ?? 0) : result;
    } catch (e) {
      return derivedValue;
    }
  };
}
//# sourceMappingURL=Scale.js.map