@react-native-ohos/native-base 3.4.29-rc.1

package/lib/module/hooks/useThemeProps/useProps.js

@@ -0,0 +1,33 @@
+import get from 'lodash.get';
+import omit from 'lodash.omit';
+import { useWindowDimensions, Platform } from 'react-native';
+import { useNativeBase } from './../useNativeBase';
+import { omitUndefined, extractInObject } from './../../theme/tools/';
+import { filterShadowProps } from './../../utils/filterShadowProps';
+import { calculateProps } from './utils';
+
+const filterAndCalculateProps = (theme, colorModeProps, componentTheme, propsReceived, windowWidth) => {
+  // Extracting out children and style, as they do not contribute in props calculation
+  // This is done as these props are passed as it is later in the development
+  // Required as some of these will trigger cyclic computation which may lead to error
+  let [ignoredProps, props] = extractInObject(propsReceived, ['children', 'style', 'onPress', 'icon', 'onOpen', 'onClose']);
+  let newProps = calculateProps(theme, colorModeProps, componentTheme, props, windowWidth);
+  let mergedProps = filterShadowProps(newProps, ignoredProps, Platform.OS);
+  return omitUndefined(mergedProps);
+};
+
+export function useThemeProps(component, propsReceived) {
+  var _useWindowDimensions;
+
+  const {
+    theme,
+    ...colorModeProps
+  } = useNativeBase(); // console.log('THEME = ', theme);
+
+  const componentTheme = get(theme, "components.".concat(component)); // console.log('COMPONENT THEME = ', componentTheme);
+
+  const windowWidth = (_useWindowDimensions = useWindowDimensions()) === null || _useWindowDimensions === void 0 ? void 0 : _useWindowDimensions.width; // To pass the component theme props and component props seperately
+
+  return filterAndCalculateProps(omit(theme, ['components']), colorModeProps, componentTheme, propsReceived, windowWidth);
+}
+//# sourceMappingURL=useProps.js.map

package/lib/module/hooks/useThemeProps/useProps.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useProps.tsx"],"names":["get","omit","useWindowDimensions","Platform","useNativeBase","omitUndefined","extractInObject","filterShadowProps","calculateProps","filterAndCalculateProps","theme","colorModeProps","componentTheme","propsReceived","windowWidth","ignoredProps","props","newProps","mergedProps","OS","useThemeProps","component","width"],"mappings":"AAAA,OAAOA,GAAP,MAAgB,YAAhB;AACA,OAAOC,IAAP,MAAiB,aAAjB;AACA,SAASC,mBAAT,EAA8BC,QAA9B,QAA8C,cAA9C;AACA,SAASC,aAAT,QAA8B,oBAA9B;AACA,SAASC,aAAT,EAAwBC,eAAxB,QAA+C,sBAA/C;AACA,SAASC,iBAAT,QAAkC,iCAAlC;AACA,SAASC,cAAT,QAA+B,SAA/B;;AAEA,MAAMC,uBAAuB,GAAG,CAC9BC,KAD8B,EAE9BC,cAF8B,EAG9BC,cAH8B,EAI9BC,aAJ8B,EAK9BC,WAL8B,KAM3B;AACH;AACA;AACA;AACA,MAAI,CAACC,YAAD,EAAeC,KAAf,IAAwBV,eAAe,CAACO,aAAD,EAAgB,CACzD,UADyD,EAEzD,OAFyD,EAGzD,SAHyD,EAIzD,MAJyD,EAKzD,QALyD,EAMzD,SANyD,CAAhB,CAA3C;AAQA,MAAII,QAAQ,GAAGT,cAAc,CAC3BE,KAD2B,EAE3BC,cAF2B,EAG3BC,cAH2B,EAI3BI,KAJ2B,EAK3BF,WAL2B,CAA7B;AAOA,MAAII,WAAW,GAAGX,iBAAiB,CAACU,QAAD,EAAWF,YAAX,EAAyBZ,QAAQ,CAACgB,EAAlC,CAAnC;AACA,SAAOd,aAAa,CAACa,WAAD,CAApB;AACD,CA3BD;;AA6BA,OAAO,SAASE,aAAT,CAAuBC,SAAvB,EAA0CR,aAA1C,EAA8D;AAAA;;AACnE,QAAM;AAAEH,IAAAA,KAAF;AAAS,OAAGC;AAAZ,MAA+BP,aAAa,EAAlD,CADmE,CAEnE;;AAEA,QAAMQ,cAAc,GAAGZ,GAAG,CAACU,KAAD,uBAAsBW,SAAtB,EAA1B,CAJmE,CAKnE;;AACA,QAAMP,WAAW,2BAAGZ,mBAAmB,EAAtB,yDAAG,qBAAuBoB,KAA3C,CANmE,CAQnE;;AACA,SAAOb,uBAAuB,CAC5BR,IAAI,CAACS,KAAD,EAAQ,CAAC,YAAD,CAAR,CADwB,EAE5BC,cAF4B,EAG5BC,cAH4B,EAI5BC,aAJ4B,EAK5BC,WAL4B,CAA9B;AAOD","sourcesContent":["import get from 'lodash.get';\r\nimport omit from 'lodash.omit';\r\nimport { useWindowDimensions, Platform } from 'react-native';\r\nimport { useNativeBase } from './../useNativeBase';\r\nimport { omitUndefined, extractInObject } from './../../theme/tools/';\r\nimport { filterShadowProps } from './../../utils/filterShadowProps';\r\nimport { calculateProps } from './utils';\r\n\r\nconst filterAndCalculateProps = (\r\n  theme: any,\r\n  colorModeProps: any,\r\n  componentTheme: any,\r\n  propsReceived: any,\r\n  windowWidth: any\r\n) => {\r\n  // Extracting out children and style, as they do not contribute in props calculation\r\n  // This is done as these props are passed as it is later in the development\r\n  // Required as some of these will trigger cyclic computation which may lead to error\r\n  let [ignoredProps, props] = extractInObject(propsReceived, [\r\n    'children',\r\n    'style',\r\n    'onPress',\r\n    'icon',\r\n    'onOpen',\r\n    'onClose',\r\n  ]);\r\n  let newProps = calculateProps(\r\n    theme,\r\n    colorModeProps,\r\n    componentTheme,\r\n    props,\r\n    windowWidth\r\n  );\r\n  let mergedProps = filterShadowProps(newProps, ignoredProps, Platform.OS);\r\n  return omitUndefined(mergedProps);\r\n};\r\n\r\nexport function useThemeProps(component: string, propsReceived: any) {\r\n  const { theme, ...colorModeProps } = useNativeBase();\r\n  // console.log('THEME = ', theme);\r\n\r\n  const componentTheme = get(theme, `components.${component}`);\r\n  // console.log('COMPONENT THEME = ', componentTheme);\r\n  const windowWidth = useWindowDimensions()?.width;\r\n\r\n  // To pass the component theme props and component props seperately\r\n  return filterAndCalculateProps(\r\n    omit(theme, ['components']),\r\n    colorModeProps,\r\n    componentTheme,\r\n    propsReceived,\r\n    windowWidth\r\n  );\r\n}\r\n"]}

package/lib/module/hooks/useThemeProps/usePropsResolution.js

@@ -0,0 +1,313 @@
+import get from 'lodash.get';
+import merge from 'lodash.merge';
+import isEmpty from 'lodash.isempty';
+import { Platform } from 'react-native';
+import { useNativeBase } from '../useNativeBase';
+import { useColorMode } from '../../core/color-mode';
+import { omitUndefined, extractInObject } from '../../theme/tools';
+import { useBreakpointResolvedProps } from '../useBreakpointResolvedProps';
+import { propsFlattener, compareSpecificity } from './propsFlattener';
+import { useResponsiveSSRProps } from '../useResponsiveSSRProps';
+import React from 'react';
+import { ResponsiveQueryContext } from '../../utils/useResponsiveQuery/ResponsiveQueryProvider';
+const SPREAD_PROP_SPECIFICITY_ORDER = ['p', 'padding', 'px', 'py', 'pt', 'pb', 'pl', 'pr', 'paddingTop', 'paddingBottom', 'paddingLeft', 'paddingRight', 'm', 'margin', 'mx', 'my', 'mt', 'mb', 'ml', 'mr', 'marginTop', 'marginBottom', 'marginLeft', 'marginRight'];
+const FINAL_SPREAD_PROPS = ['paddingTop', 'paddingBottom', 'paddingLeft', 'paddingRight', 'marginTop', 'marginBottom', 'marginLeft', 'marginRight'];
+const MARGIN_MAP = {
+  mx: ['marginRight', 'marginLeft'],
+  my: ['marginTop', 'marginBottom'],
+  mt: ['marginTop'],
+  mb: ['marginBottom'],
+  mr: ['marginRight'],
+  ml: ['marginLeft']
+};
+MARGIN_MAP.margin = [...MARGIN_MAP.mx, ...MARGIN_MAP.my];
+MARGIN_MAP.m = MARGIN_MAP.margin;
+MARGIN_MAP.marginTop = MARGIN_MAP.mt;
+MARGIN_MAP.marginBottom = MARGIN_MAP.mb;
+MARGIN_MAP.marginLeft = MARGIN_MAP.ml;
+MARGIN_MAP.marginRight = MARGIN_MAP.mr;
+const PADDING_MAP = {
+  px: ['paddingRight', 'paddingLeft'],
+  py: ['paddingTop', 'paddingBottom'],
+  pt: ['paddingTop'],
+  pb: ['paddingBottom'],
+  pr: ['paddingRight'],
+  pl: ['paddingLeft']
+};
+PADDING_MAP.padding = [...PADDING_MAP.px, ...PADDING_MAP.py];
+PADDING_MAP.p = PADDING_MAP.padding;
+PADDING_MAP.paddingTop = PADDING_MAP.pt;
+PADDING_MAP.paddingBottom = PADDING_MAP.pb;
+PADDING_MAP.paddingLeft = PADDING_MAP.pl;
+PADDING_MAP.paddingRight = PADDING_MAP.pr;
+const SPREAD_PROP_SPECIFICITY_MAP = { ...PADDING_MAP,
+  ...MARGIN_MAP
+};
+
+function propsSpreader(incomingProps, incomingSpecifity) {
+  const flattenedDefaultProps = { ...incomingProps
+  };
+  const specificity = {};
+  SPREAD_PROP_SPECIFICITY_ORDER.forEach(prop => {
+    if (prop in flattenedDefaultProps) {
+      const val = incomingProps[prop] || flattenedDefaultProps[prop];
+
+      if (!FINAL_SPREAD_PROPS.includes(prop)) {
+        delete flattenedDefaultProps[prop];
+        specificity[prop] = incomingSpecifity[prop];
+      }
+
+      SPREAD_PROP_SPECIFICITY_MAP[prop].forEach(newProp => {
+        if (compareSpecificity(specificity[newProp], specificity[prop])) {
+          specificity[newProp] = incomingSpecifity[prop];
+          flattenedDefaultProps[newProp] = val;
+        }
+      });
+    }
+  });
+  return merge({}, flattenedDefaultProps);
+}
+/**
+ * @summary Combines provided porps with component's theme props and resloves them.
+ * @arg {string} component - Name of the component.
+ * @arg {object} incomingProps - Props passed by the user.
+ * @arg {object} state - dependent states.
+ * @arg {object} config - configuration for resolution. Accepts key like ignoreProps, resolveResponsively.
+ * @returns {object} Resolved and flattened props.
+ */
+
+
+export function usePropsResolution(component, incomingProps, state, config) {
+  var _config$componentThem;
+
+  const {
+    theme
+  } = useNativeBase();
+  const componentTheme = (_config$componentThem = config === null || config === void 0 ? void 0 : config.componentTheme) !== null && _config$componentThem !== void 0 ? _config$componentThem : get(theme, "components.".concat(component), {});
+
+  if (process.env.NODE_ENV === 'development' && incomingProps.debug) {
+    /* eslint-disable-next-line */
+    console.log("%c".concat(component), 'background: #d97706; color: #111; font-weight: 700; padding: 2px 8px;');
+    /* eslint-disable-next-line */
+
+    console.log("%cusePropsResolution", 'background: #4b5563; color: #d97706; font-weight: 700; padding: 2px 8px;');
+    /* eslint-disable-next-line */
+
+    console.log('%c incomingProps: ', 'color: #4ade80; font-weight: 700;', incomingProps);
+    /* eslint-disable-next-line */
+
+    console.log('%c state: ', 'color: #4ade80; font-weight: 700;', state);
+    /* eslint-disable-next-line */
+
+    console.log('%c componentTheme: ', 'color: #4ade80; font-weight: 700;', componentTheme);
+  }
+
+  const resolvedProps = usePropsResolutionWithComponentTheme(componentTheme, incomingProps, state, config); // Not Resolve theme props and pseudo props
+
+  if (incomingProps !== null && incomingProps !== void 0 && incomingProps.INTERNAL_notResolveThemeAndPseudoProps) {
+    delete incomingProps.INTERNAL_notResolveThemeAndPseudoProps;
+    return incomingProps;
+  }
+
+  if (process.env.NODE_ENV === 'development' && incomingProps.debug) {
+    /* eslint-disable-next-line */
+    console.log('%c resolvedProps: ', 'color: #22d3ee; font-weight: 700;', resolvedProps);
+  }
+
+  return resolvedProps;
+}
+export const usePropsResolutionWithComponentTheme = (componentTheme, incomingProps, state, config) => {
+  const modifiedPropsForSSR = useResponsiveSSRProps(incomingProps);
+  const [ignoredProps, cleanIncomingProps] = extractInObject(modifiedPropsForSSR, ['children', 'onPress', 'icon', 'onOpen', 'onClose'].concat((config === null || config === void 0 ? void 0 : config.ignoreProps) || []));
+  const responsiveQueryContext = React.useContext(ResponsiveQueryContext);
+  const disableCSSMediaQueries = responsiveQueryContext.disableCSSMediaQueries;
+  const resolveResponsively = ['colorScheme', 'size', 'variant', ...((config === null || config === void 0 ? void 0 : config.resolveResponsively) || [])];
+  const {
+    theme
+  } = useNativeBase();
+  const colorModeProps = useColorMode();
+  const extendedTheme = [];
+
+  if (config !== null && config !== void 0 && config.extendTheme) {
+    config === null || config === void 0 ? void 0 : config.extendTheme.map(componentName => {
+      extendedTheme.push(get(theme, "components.".concat(componentName), {}));
+    });
+  }
+
+  if (!isEmpty(componentTheme)) extendedTheme.push(componentTheme);
+
+  const resolveComponentTheme = (themeType, providedTheme) => {
+    try {
+      if (themeType[1]) {
+        return typeof providedTheme[themeType[0]][themeType[1]] !== 'function' ? providedTheme[themeType[0]][themeType[1]] : providedTheme[themeType[0]][themeType[1]]({
+          theme,
+          ...incomingWithDefaultProps,
+          ...colorModeProps
+        });
+      } else {
+        return typeof providedTheme[themeType[0]] !== 'function' ? providedTheme[themeType[0]] : providedTheme[themeType[0]]({
+          theme,
+          ...incomingWithDefaultProps,
+          ...colorModeProps
+        });
+      }
+    } catch {
+      return {};
+    }
+  };
+
+  const callPropsFlattener = (targetProps = {}, latestSpecifictyMap = {}, specificity = 1) => {
+    return propsFlattener({
+      props: process.env.NODE_ENV === 'development' && cleanIncomingProps.debug ? { ...targetProps,
+        debug: true
+      } : targetProps,
+      platform: Platform.OS,
+      colormode: colorModeProps.colorMode,
+      state: state || {},
+      currentSpecificityMap: latestSpecifictyMap,
+      previouslyFlattenProps: flattenProps || {},
+      cascadePseudoProps: config === null || config === void 0 ? void 0 : config.cascadePseudoProps
+    }, specificity);
+  }; // STEP 1: combine default props and incoming props
+
+
+  const incomingWithDefaultProps = merge({}, componentTheme.defaultProps || {}, cleanIncomingProps); // STEP 1.5: resolving component theme
+
+  let combinedBaseStyle = {};
+  let combinedVariantStyle = {};
+  let combinedSizeStyle = {};
+  extendedTheme.map(extededComponentTheme => {
+    if (extededComponentTheme.baseStyle) {
+      combinedBaseStyle = { ...combinedBaseStyle,
+        ...resolveComponentTheme(['baseStyle'], extededComponentTheme)
+      };
+    }
+
+    if (incomingWithDefaultProps.variant) {
+      if (extededComponentTheme.variants) {
+        combinedVariantStyle = { ...combinedVariantStyle,
+          ...resolveComponentTheme(['variants', incomingWithDefaultProps.variant], extededComponentTheme)
+        };
+      }
+    }
+
+    if (incomingWithDefaultProps.size && extededComponentTheme !== null && extededComponentTheme !== void 0 && extededComponentTheme.sizes && extededComponentTheme !== null && extededComponentTheme !== void 0 && extededComponentTheme.sizes[incomingWithDefaultProps.size]) {
+      if (typeof extededComponentTheme.sizes[incomingWithDefaultProps.size] === 'string' || typeof extededComponentTheme.sizes[incomingWithDefaultProps.size] === 'number') {
+        incomingWithDefaultProps.size = extededComponentTheme.sizes[incomingWithDefaultProps.size];
+      } else {
+        combinedSizeStyle = { ...combinedSizeStyle,
+          ...resolveComponentTheme(['sizes', incomingWithDefaultProps.size], extededComponentTheme)
+        };
+        incomingWithDefaultProps.size = undefined;
+      }
+    }
+  }); // STEP 2: flatten them
+
+  if (process.env.NODE_ENV === 'development' && cleanIncomingProps.debug) {
+    /* eslint-disable-next-line */
+    console.log("%cFlattening incoming and Default", 'background: #4b5563; color: #FFF; font-weight: 700; padding: 2px 8px;');
+  } //TODO: hack
+
+
+  let flattenProps, specificityMap;
+  [flattenProps, specificityMap] = callPropsFlattener(incomingWithDefaultProps, {}, 2);
+  const responsiveProps = {};
+
+  if (disableCSSMediaQueries) {
+    // STEP 2.5: resolving responsive props
+    resolveResponsively.map(propsName => {
+      if (flattenProps[propsName]) {
+        // @ts-ignore
+        responsiveProps[propsName] = flattenProps[propsName];
+      }
+    });
+  }
+
+  if (resolveResponsively.includes('direction')) {
+    const propName = 'direction';
+
+    if (flattenProps[propName]) {
+      // @ts-ignore
+      responsiveProps[propName] = flattenProps[propName];
+    }
+  }
+
+  const responsivelyResolvedProps = useBreakpointResolvedProps(responsiveProps);
+  flattenProps = { ...flattenProps,
+    ...responsivelyResolvedProps
+  }; // STEP 3: Pass it to baseStyle, then variant and then size and resolve them.
+  // NOTE: Resoloving baseStyle
+
+  let flattenBaseStyle, baseSpecificityMap;
+
+  if (combinedBaseStyle) {
+    if (process.env.NODE_ENV === 'development' && cleanIncomingProps.debug) {
+      /* eslint-disable-next-line */
+      console.log("%cFlattening baseStyle", 'background: #4b5563; color: #eee; font-weight: 700; padding: 2px 8px;');
+    }
+
+    [flattenBaseStyle, baseSpecificityMap] = callPropsFlattener(combinedBaseStyle, specificityMap);
+  } // NOTE: Resolving variants
+
+
+  let flattenVariantStyle, variantSpecificityMap; // Extracting props from variant
+
+  if (combinedVariantStyle) {
+    if (process.env.NODE_ENV === 'development' && cleanIncomingProps.debug) {
+      /* eslint-disable-next-line */
+      console.log("%cFlattening variantStyle", 'background: #4b5563; color: #FFF; font-weight: 700; padding: 2px 8px;');
+    }
+
+    [flattenVariantStyle, variantSpecificityMap] = callPropsFlattener(combinedVariantStyle, baseSpecificityMap || specificityMap); // We remove variant from original props if we found it in the componentTheme
+    //@ts-ignore
+
+    flattenProps.variant = undefined;
+  } // NOTE: Resolving size
+
+
+  let flattenSizeStyle, sizeSpecificityMap; // Extracting props from size
+
+  if (combinedSizeStyle) {
+    if (process.env.NODE_ENV === 'development' && cleanIncomingProps.debug) {
+      /* eslint-disable-next-line */
+      console.log("%cFlattening sizeStyle", 'background: #4b5563; color: #FFF; font-weight: 700; padding: 2px 8px;');
+    }
+
+    [flattenSizeStyle, sizeSpecificityMap] = callPropsFlattener(combinedSizeStyle, variantSpecificityMap || baseSpecificityMap || specificityMap);
+  } // STEP 4: merge
+
+
+  const defaultStyles = merge({}, flattenBaseStyle, flattenVariantStyle, flattenSizeStyle);
+  /*Resolve all the internal used Pseudo Props*/
+
+  const resolvePseudoProps = (flatPseudoProp, baseStylePseudoProp) =>
+  /** Props coming from Pseudo inside defaultStyles(baseStyle) */
+  {
+    for (const prop in flatPseudoProp) {
+      baseStylePseudoProp[prop] = flatPseudoProp[prop];
+      /* Replace all the similar prop from from internal props */
+    }
+
+    return baseStylePseudoProp;
+  };
+
+  for (const prop in defaultStyles) {
+    if (prop.startsWith('_') && flattenProps.hasOwnProperty(prop)) {
+      /*Resolve all the internal used Pseudo Props*/
+      defaultStyles[prop] = resolvePseudoProps(flattenProps[prop], defaultStyles[prop]);
+    }
+
+    delete flattenProps[prop];
+  }
+
+  const defaultSpecificity = merge({}, specificityMap, baseSpecificityMap, variantSpecificityMap, sizeSpecificityMap);
+  flattenProps = propsSpreader({ ...defaultStyles,
+    ...flattenProps
+  }, defaultSpecificity);
+  const resolvedProps = omitUndefined({ ...flattenProps,
+    ...ignoredProps
+  }); // STEP 5: Return
+
+  return resolvedProps;
+};
+//# sourceMappingURL=usePropsResolution.js.map

package/lib/module/hooks/useThemeProps/usePropsResolution.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["usePropsResolution.tsx"],"names":["get","merge","isEmpty","Platform","useNativeBase","useColorMode","omitUndefined","extractInObject","useBreakpointResolvedProps","propsFlattener","compareSpecificity","useResponsiveSSRProps","React","ResponsiveQueryContext","SPREAD_PROP_SPECIFICITY_ORDER","FINAL_SPREAD_PROPS","MARGIN_MAP","mx","my","mt","mb","mr","ml","margin","m","marginTop","marginBottom","marginLeft","marginRight","PADDING_MAP","px","py","pt","pb","pr","pl","padding","p","paddingTop","paddingBottom","paddingLeft","paddingRight","SPREAD_PROP_SPECIFICITY_MAP","propsSpreader","incomingProps","incomingSpecifity","flattenedDefaultProps","specificity","forEach","prop","val","includes","newProp","usePropsResolution","component","state","config","theme","componentTheme","process","env","NODE_ENV","debug","console","log","resolvedProps","usePropsResolutionWithComponentTheme","INTERNAL_notResolveThemeAndPseudoProps","modifiedPropsForSSR","ignoredProps","cleanIncomingProps","concat","ignoreProps","responsiveQueryContext","useContext","disableCSSMediaQueries","resolveResponsively","colorModeProps","extendedTheme","extendTheme","map","componentName","push","resolveComponentTheme","themeType","providedTheme","incomingWithDefaultProps","callPropsFlattener","targetProps","latestSpecifictyMap","props","platform","OS","colormode","colorMode","currentSpecificityMap","previouslyFlattenProps","flattenProps","cascadePseudoProps","defaultProps","combinedBaseStyle","combinedVariantStyle","combinedSizeStyle","extededComponentTheme","baseStyle","variant","variants","size","sizes","undefined","specificityMap","responsiveProps","propsName","propName","responsivelyResolvedProps","flattenBaseStyle","baseSpecificityMap","flattenVariantStyle","variantSpecificityMap","flattenSizeStyle","sizeSpecificityMap","defaultStyles","resolvePseudoProps","flatPseudoProp","baseStylePseudoProp","startsWith","hasOwnProperty","defaultSpecificity"],"mappings":"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","sourcesContent":["import get from 'lodash.get';\r\nimport merge from 'lodash.merge';\r\nimport isEmpty from 'lodash.isempty';\r\nimport { Platform } from 'react-native';\r\nimport { useNativeBase } from '../useNativeBase';\r\nimport { useColorMode } from '../../core/color-mode';\r\nimport { omitUndefined, extractInObject } from '../../theme/tools';\r\nimport { useBreakpointResolvedProps } from '../useBreakpointResolvedProps';\r\nimport {\r\n  propsFlattener,\r\n  compareSpecificity,\r\n  IStateProps,\r\n} from './propsFlattener';\r\nimport { useResponsiveSSRProps } from '../useResponsiveSSRProps';\r\nimport React from 'react';\r\nimport { ResponsiveQueryContext } from '../../utils/useResponsiveQuery/ResponsiveQueryProvider';\r\nimport type { ComponentTheme } from '../../theme';\r\n\r\nconst SPREAD_PROP_SPECIFICITY_ORDER = [\r\n  'p',\r\n  'padding',\r\n  'px',\r\n  'py',\r\n  'pt',\r\n  'pb',\r\n  'pl',\r\n  'pr',\r\n  'paddingTop',\r\n  'paddingBottom',\r\n  'paddingLeft',\r\n  'paddingRight',\r\n  'm',\r\n  'margin',\r\n  'mx',\r\n  'my',\r\n  'mt',\r\n  'mb',\r\n  'ml',\r\n  'mr',\r\n  'marginTop',\r\n  'marginBottom',\r\n  'marginLeft',\r\n  'marginRight',\r\n];\r\n\r\nconst FINAL_SPREAD_PROPS = [\r\n  'paddingTop',\r\n  'paddingBottom',\r\n  'paddingLeft',\r\n  'paddingRight',\r\n  'marginTop',\r\n  'marginBottom',\r\n  'marginLeft',\r\n  'marginRight',\r\n];\r\n\r\nconst MARGIN_MAP: any = {\r\n  mx: ['marginRight', 'marginLeft'],\r\n  my: ['marginTop', 'marginBottom'],\r\n  mt: ['marginTop'],\r\n  mb: ['marginBottom'],\r\n  mr: ['marginRight'],\r\n  ml: ['marginLeft'],\r\n};\r\n\r\nMARGIN_MAP.margin = [...MARGIN_MAP.mx, ...MARGIN_MAP.my];\r\nMARGIN_MAP.m = MARGIN_MAP.margin;\r\nMARGIN_MAP.marginTop = MARGIN_MAP.mt;\r\nMARGIN_MAP.marginBottom = MARGIN_MAP.mb;\r\nMARGIN_MAP.marginLeft = MARGIN_MAP.ml;\r\nMARGIN_MAP.marginRight = MARGIN_MAP.mr;\r\n\r\nconst PADDING_MAP: any = {\r\n  px: ['paddingRight', 'paddingLeft'],\r\n  py: ['paddingTop', 'paddingBottom'],\r\n  pt: ['paddingTop'],\r\n  pb: ['paddingBottom'],\r\n  pr: ['paddingRight'],\r\n  pl: ['paddingLeft'],\r\n};\r\n\r\nPADDING_MAP.padding = [...PADDING_MAP.px, ...PADDING_MAP.py];\r\nPADDING_MAP.p = PADDING_MAP.padding;\r\nPADDING_MAP.paddingTop = PADDING_MAP.pt;\r\nPADDING_MAP.paddingBottom = PADDING_MAP.pb;\r\nPADDING_MAP.paddingLeft = PADDING_MAP.pl;\r\nPADDING_MAP.paddingRight = PADDING_MAP.pr;\r\n\r\nconst SPREAD_PROP_SPECIFICITY_MAP: any = {\r\n  ...PADDING_MAP,\r\n  ...MARGIN_MAP,\r\n};\r\n\r\nfunction propsSpreader(incomingProps: any, incomingSpecifity: any) {\r\n  const flattenedDefaultProps: any = { ...incomingProps };\r\n  const specificity: any = {};\r\n\r\n  SPREAD_PROP_SPECIFICITY_ORDER.forEach((prop) => {\r\n    if (prop in flattenedDefaultProps) {\r\n      const val = incomingProps[prop] || flattenedDefaultProps[prop];\r\n      if (!FINAL_SPREAD_PROPS.includes(prop)) {\r\n        delete flattenedDefaultProps[prop];\r\n        specificity[prop] = incomingSpecifity[prop];\r\n      }\r\n\r\n      SPREAD_PROP_SPECIFICITY_MAP[prop].forEach((newProp: string) => {\r\n        if (compareSpecificity(specificity[newProp], specificity[prop])) {\r\n          specificity[newProp] = incomingSpecifity[prop];\r\n          flattenedDefaultProps[newProp] = val;\r\n        }\r\n      });\r\n    }\r\n  });\r\n\r\n  return merge({}, flattenedDefaultProps);\r\n}\r\n\r\n/**\r\n * @summary Combines provided porps with component's theme props and resloves them.\r\n * @arg {string} component - Name of the component.\r\n * @arg {object} incomingProps - Props passed by the user.\r\n * @arg {object} state - dependent states.\r\n * @arg {object} config - configuration for resolution. Accepts key like ignoreProps, resolveResponsively.\r\n * @returns {object} Resolved and flattened props.\r\n */\r\nexport function usePropsResolution(\r\n  component: string,\r\n  incomingProps: any,\r\n  state?: IStateProps,\r\n  config?: {\r\n    componentTheme?: any;\r\n    resolveResponsively?: string[];\r\n    ignoreProps?: string[];\r\n    cascadePseudoProps?: boolean;\r\n    extendTheme?: string[];\r\n  }\r\n) {\r\n  const { theme } = useNativeBase();\r\n  const componentTheme =\r\n    config?.componentTheme ?? get(theme, `components.${component}`, {});\r\n\r\n  if (process.env.NODE_ENV === 'development' && incomingProps.debug) {\r\n    /* eslint-disable-next-line */\r\n    console.log(\r\n      `%c${component}`,\r\n      'background: #d97706; color: #111; font-weight: 700; padding: 2px 8px;'\r\n    );\r\n    /* eslint-disable-next-line */\r\n    console.log(\r\n      `%cusePropsResolution`,\r\n      'background: #4b5563; color: #d97706; font-weight: 700; padding: 2px 8px;'\r\n    );\r\n    /* eslint-disable-next-line */\r\n    console.log(\r\n      '%c incomingProps: ',\r\n      'color: #4ade80; font-weight: 700;',\r\n      incomingProps\r\n    );\r\n    /* eslint-disable-next-line */\r\n    console.log('%c state: ', 'color: #4ade80; font-weight: 700;', state);\r\n    /* eslint-disable-next-line */\r\n    console.log(\r\n      '%c componentTheme: ',\r\n      'color: #4ade80; font-weight: 700;',\r\n      componentTheme\r\n    );\r\n  }\r\n\r\n  const resolvedProps = usePropsResolutionWithComponentTheme(\r\n    componentTheme,\r\n    incomingProps,\r\n    state,\r\n    config\r\n  );\r\n\r\n  // Not Resolve theme props and pseudo props\r\n  if (incomingProps?.INTERNAL_notResolveThemeAndPseudoProps) {\r\n    delete incomingProps.INTERNAL_notResolveThemeAndPseudoProps;\r\n    return incomingProps;\r\n  }\r\n\r\n  if (process.env.NODE_ENV === 'development' && incomingProps.debug) {\r\n    /* eslint-disable-next-line */\r\n    console.log(\r\n      '%c resolvedProps: ',\r\n      'color: #22d3ee; font-weight: 700;',\r\n      resolvedProps\r\n    );\r\n  }\r\n  return resolvedProps;\r\n}\r\n\r\nexport const usePropsResolutionWithComponentTheme = (\r\n  componentTheme: ComponentTheme,\r\n  incomingProps: any,\r\n  state?: IStateProps,\r\n  config?: {\r\n    componentTheme?: any;\r\n    resolveResponsively?: string[];\r\n    ignoreProps?: string[];\r\n    cascadePseudoProps?: boolean;\r\n    extendTheme?: string[];\r\n  }\r\n) => {\r\n  const modifiedPropsForSSR = useResponsiveSSRProps(incomingProps);\r\n\r\n  const [ignoredProps, cleanIncomingProps] = extractInObject(\r\n    modifiedPropsForSSR,\r\n    ['children', 'onPress', 'icon', 'onOpen', 'onClose'].concat(\r\n      config?.ignoreProps || []\r\n    )\r\n  );\r\n  const responsiveQueryContext = React.useContext(ResponsiveQueryContext);\r\n  const disableCSSMediaQueries = responsiveQueryContext.disableCSSMediaQueries;\r\n  const resolveResponsively = [\r\n    'colorScheme',\r\n    'size',\r\n    'variant',\r\n    ...(config?.resolveResponsively || []),\r\n  ];\r\n\r\n  const { theme } = useNativeBase();\r\n  const colorModeProps = useColorMode();\r\n\r\n  const extendedTheme: Array<any> = [];\r\n  if (config?.extendTheme) {\r\n    config?.extendTheme.map((componentName: string) => {\r\n      extendedTheme.push(get(theme, `components.${componentName}`, {}));\r\n    });\r\n  }\r\n  if (!isEmpty(componentTheme)) extendedTheme.push(componentTheme);\r\n\r\n  const resolveComponentTheme = (\r\n    themeType: Array<string>,\r\n    providedTheme: any\r\n  ): any => {\r\n    try {\r\n      if (themeType[1]) {\r\n        return typeof providedTheme[themeType[0]][themeType[1]] !== 'function'\r\n          ? providedTheme[themeType[0]][themeType[1]]\r\n          : providedTheme[themeType[0]][themeType[1]]({\r\n              theme,\r\n              ...incomingWithDefaultProps,\r\n              ...colorModeProps,\r\n            });\r\n      } else {\r\n        return typeof providedTheme[themeType[0]] !== 'function'\r\n          ? providedTheme[themeType[0]]\r\n          : providedTheme[themeType[0]]({\r\n              theme,\r\n              ...incomingWithDefaultProps,\r\n              ...colorModeProps,\r\n            });\r\n      }\r\n    } catch {\r\n      return {};\r\n    }\r\n  };\r\n  const callPropsFlattener = (\r\n    targetProps = {},\r\n    latestSpecifictyMap = {},\r\n    specificity = 1\r\n  ): any => {\r\n    return propsFlattener(\r\n      {\r\n        props:\r\n          process.env.NODE_ENV === 'development' && cleanIncomingProps.debug\r\n            ? { ...targetProps, debug: true }\r\n            : targetProps,\r\n        platform: Platform.OS,\r\n        colormode: colorModeProps.colorMode,\r\n        state: state || {},\r\n        currentSpecificityMap: latestSpecifictyMap,\r\n        previouslyFlattenProps: flattenProps || {},\r\n        cascadePseudoProps: config?.cascadePseudoProps,\r\n      },\r\n      specificity\r\n    );\r\n  };\r\n\r\n  // STEP 1: combine default props and incoming props\r\n\r\n  const incomingWithDefaultProps = merge(\r\n    {},\r\n    componentTheme.defaultProps || {},\r\n    cleanIncomingProps\r\n  );\r\n\r\n  // STEP 1.5: resolving component theme\r\n  let combinedBaseStyle = {};\r\n  let combinedVariantStyle = {};\r\n  let combinedSizeStyle = {};\r\n  extendedTheme.map((extededComponentTheme: any) => {\r\n    if (extededComponentTheme.baseStyle) {\r\n      combinedBaseStyle = {\r\n        ...combinedBaseStyle,\r\n        ...resolveComponentTheme(['baseStyle'], extededComponentTheme),\r\n      };\r\n    }\r\n    if (incomingWithDefaultProps.variant) {\r\n      if (extededComponentTheme.variants) {\r\n        combinedVariantStyle = {\r\n          ...combinedVariantStyle,\r\n          ...resolveComponentTheme(\r\n            ['variants', incomingWithDefaultProps.variant],\r\n            extededComponentTheme\r\n          ),\r\n        };\r\n      }\r\n    }\r\n    if (\r\n      incomingWithDefaultProps.size &&\r\n      extededComponentTheme?.sizes &&\r\n      extededComponentTheme?.sizes[incomingWithDefaultProps.size]\r\n    ) {\r\n      if (\r\n        typeof extededComponentTheme.sizes[incomingWithDefaultProps.size] ===\r\n          'string' ||\r\n        typeof extededComponentTheme.sizes[incomingWithDefaultProps.size] ===\r\n          'number'\r\n      ) {\r\n        incomingWithDefaultProps.size =\r\n          extededComponentTheme.sizes[incomingWithDefaultProps.size];\r\n      } else {\r\n        combinedSizeStyle = {\r\n          ...combinedSizeStyle,\r\n          ...resolveComponentTheme(\r\n            ['sizes', incomingWithDefaultProps.size],\r\n            extededComponentTheme\r\n          ),\r\n        };\r\n        incomingWithDefaultProps.size = undefined;\r\n      }\r\n    }\r\n  });\r\n\r\n  // STEP 2: flatten them\r\n  if (process.env.NODE_ENV === 'development' && cleanIncomingProps.debug) {\r\n    /* eslint-disable-next-line */\r\n    console.log(\r\n      `%cFlattening incoming and Default`,\r\n      'background: #4b5563; color: #FFF; font-weight: 700; padding: 2px 8px;'\r\n    );\r\n  }\r\n  //TODO: hack\r\n  let flattenProps: any, specificityMap;\r\n  [flattenProps, specificityMap] = callPropsFlattener(\r\n    incomingWithDefaultProps,\r\n    {},\r\n    2\r\n  );\r\n  const responsiveProps = {};\r\n  if (disableCSSMediaQueries) {\r\n    // STEP 2.5: resolving responsive props\r\n    resolveResponsively.map((propsName) => {\r\n      if (flattenProps[propsName]) {\r\n        // @ts-ignore\r\n        responsiveProps[propsName] = flattenProps[propsName];\r\n      }\r\n    });\r\n  }\r\n  if (resolveResponsively.includes('direction')) {\r\n    const propName = 'direction';\r\n    if (flattenProps[propName]) {\r\n      // @ts-ignore\r\n      responsiveProps[propName] = flattenProps[propName];\r\n    }\r\n  }\r\n  const responsivelyResolvedProps = useBreakpointResolvedProps(responsiveProps);\r\n\r\n  flattenProps = {\r\n    ...flattenProps,\r\n    ...responsivelyResolvedProps,\r\n  };\r\n  // STEP 3: Pass it to baseStyle, then variant and then size and resolve them.\r\n\r\n  // NOTE: Resoloving baseStyle\r\n  let flattenBaseStyle, baseSpecificityMap;\r\n  if (combinedBaseStyle) {\r\n    if (process.env.NODE_ENV === 'development' && cleanIncomingProps.debug) {\r\n      /* eslint-disable-next-line */\r\n      console.log(\r\n        `%cFlattening baseStyle`,\r\n        'background: #4b5563; color: #eee; font-weight: 700; padding: 2px 8px;'\r\n      );\r\n    }\r\n    [flattenBaseStyle, baseSpecificityMap] = callPropsFlattener(\r\n      combinedBaseStyle,\r\n      specificityMap\r\n    );\r\n  }\r\n\r\n  // NOTE: Resolving variants\r\n  let flattenVariantStyle, variantSpecificityMap;\r\n  // Extracting props from variant\r\n  if (combinedVariantStyle) {\r\n    if (process.env.NODE_ENV === 'development' && cleanIncomingProps.debug) {\r\n      /* eslint-disable-next-line */\r\n      console.log(\r\n        `%cFlattening variantStyle`,\r\n        'background: #4b5563; color: #FFF; font-weight: 700; padding: 2px 8px;'\r\n      );\r\n    }\r\n    [flattenVariantStyle, variantSpecificityMap] = callPropsFlattener(\r\n      combinedVariantStyle,\r\n      baseSpecificityMap || specificityMap\r\n    );\r\n\r\n    // We remove variant from original props if we found it in the componentTheme\r\n    //@ts-ignore\r\n    flattenProps.variant = undefined;\r\n  }\r\n\r\n  // NOTE: Resolving size\r\n\r\n  let flattenSizeStyle, sizeSpecificityMap;\r\n  // Extracting props from size\r\n  if (combinedSizeStyle) {\r\n    if (process.env.NODE_ENV === 'development' && cleanIncomingProps.debug) {\r\n      /* eslint-disable-next-line */\r\n      console.log(\r\n        `%cFlattening sizeStyle`,\r\n        'background: #4b5563; color: #FFF; font-weight: 700; padding: 2px 8px;'\r\n      );\r\n    }\r\n    [flattenSizeStyle, sizeSpecificityMap] = callPropsFlattener(\r\n      combinedSizeStyle,\r\n      variantSpecificityMap || baseSpecificityMap || specificityMap\r\n    );\r\n  }\r\n\r\n  // STEP 4: merge\r\n  const defaultStyles = merge(\r\n    {},\r\n    flattenBaseStyle,\r\n    flattenVariantStyle,\r\n    flattenSizeStyle\r\n  );\r\n\r\n  /*Resolve all the internal used Pseudo Props*/\r\n  const resolvePseudoProps = (\r\n    flatPseudoProp: any /** Props coming from Pseudo inside flattenProps */,\r\n    baseStylePseudoProp: any /** Props coming from Pseudo inside defaultStyles(baseStyle) */\r\n  ) => {\r\n    for (const prop in flatPseudoProp) {\r\n      baseStylePseudoProp[prop] =\r\n        flatPseudoProp[\r\n          prop\r\n        ]; /* Replace all the similar prop from from internal props */\r\n    }\r\n    return baseStylePseudoProp;\r\n  };\r\n\r\n  for (const prop in defaultStyles) {\r\n    if (prop.startsWith('_') && flattenProps.hasOwnProperty(prop)) {\r\n      /*Resolve all the internal used Pseudo Props*/\r\n      defaultStyles[prop] = resolvePseudoProps(\r\n        flattenProps[prop],\r\n        defaultStyles[prop]\r\n      );\r\n    }\r\n    delete flattenProps[prop];\r\n  }\r\n\r\n  const defaultSpecificity = merge(\r\n    {},\r\n    specificityMap,\r\n    baseSpecificityMap,\r\n    variantSpecificityMap,\r\n    sizeSpecificityMap\r\n  );\r\n\r\n  flattenProps = propsSpreader(\r\n    { ...defaultStyles, ...flattenProps },\r\n    defaultSpecificity\r\n  );\r\n\r\n  const resolvedProps = omitUndefined({\r\n    ...flattenProps,\r\n    ...ignoredProps,\r\n  });\r\n\r\n  // STEP 5: Return\r\n  return resolvedProps;\r\n};\r\n"]}