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

package/lib/module/utils/resolveStackStyleInput.js

@@ -0,0 +1,18 @@
+export const resolveStackStyleInput = (variant, color) => {
+  if (variant === 'underlined') {
+    return {
+      outlineWidth: '0',
+      boxShadow: "0 1px 0 0 ".concat(color)
+    };
+  } else if (variant === 'unstyled') {
+    return {
+      outlineWidth: 0
+    };
+  } else {
+    return {
+      outlineWidth: '0',
+      boxShadow: "0 0 0 1px ".concat(color)
+    };
+  }
+};
+//# sourceMappingURL=resolveStackStyleInput.js.map

package/lib/module/utils/resolveStackStyleInput.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["resolveStackStyleInput.ts"],"names":["resolveStackStyleInput","variant","color","outlineWidth","boxShadow"],"mappings":"AAAA,OAAO,MAAMA,sBAAsB,GAAG,CAACC,OAAD,EAAeC,KAAf,KAA8B;AAClE,MAAID,OAAO,KAAK,YAAhB,EAA8B;AAC5B,WAAO;AACLE,MAAAA,YAAY,EAAE,GADT;AAELC,MAAAA,SAAS,sBAAeF,KAAf;AAFJ,KAAP;AAID,GALD,MAKO,IAAID,OAAO,KAAK,UAAhB,EAA4B;AACjC,WAAO;AACLE,MAAAA,YAAY,EAAE;AADT,KAAP;AAGD,GAJM,MAIA;AACL,WAAO;AACLA,MAAAA,YAAY,EAAE,GADT;AAELC,MAAAA,SAAS,sBAAeF,KAAf;AAFJ,KAAP;AAID;AACF,CAhBM","sourcesContent":["export const resolveStackStyleInput = (variant: any, color: any) => {\r\n  if (variant === 'underlined') {\r\n    return {\r\n      outlineWidth: '0',\r\n      boxShadow: `0 1px 0 0 ${color}`,\r\n    };\r\n  } else if (variant === 'unstyled') {\r\n    return {\r\n      outlineWidth: 0,\r\n    };\r\n  } else {\r\n    return {\r\n      outlineWidth: '0',\r\n      boxShadow: `0 0 0 1px ${color}`,\r\n    };\r\n  }\r\n};\r\n"]}

package/lib/module/utils/styled.js

@@ -0,0 +1,32 @@
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+import React from 'react';
+import { useStyledSystemPropsResolver } from '../hooks/';
+export const makeStyledComponent = Comp => {
+  return /*#__PURE__*/React.forwardRef(({
+    debug,
+    ...props
+  }, ref) => {
+    const [style, restProps] = useStyledSystemPropsResolver(props);
+
+    if (process.env.NODE_ENV === 'development' && debug) {
+      /* eslint-disable-next-line */
+      console.log("%cstyleSystem", 'background: #4b5563; color: #d97706; font-weight: 700; padding: 2px 8px;');
+      /* eslint-disable-next-line */
+
+      console.log('%c props: ', 'color: #4ade80; font-weight: 700;', props);
+      /* eslint-disable-next-line */
+
+      console.log('%c style: ', 'color: #22d3ee; font-weight: 700;', style);
+      /* eslint-disable-next-line */
+
+      console.log('%c restProps: ', 'color: #22d3ee; font-weight: 700;', restProps);
+    }
+
+    return /*#__PURE__*/React.createElement(Comp, _extends({}, restProps, {
+      style: style,
+      ref: ref
+    }), props.children);
+  });
+};
+//# sourceMappingURL=styled.js.map

package/lib/module/utils/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["styled.tsx"],"names":["React","useStyledSystemPropsResolver","makeStyledComponent","Comp","forwardRef","debug","props","ref","style","restProps","process","env","NODE_ENV","console","log","children"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,4BAAT,QAA6C,WAA7C;AAEA,OAAO,MAAMC,mBAAmB,GAAIC,IAAD,IAAe;AAChD,sBAAOH,KAAK,CAACI,UAAN,CAAiB,CAAC;AAAEC,IAAAA,KAAF;AAAS,OAAGC;AAAZ,GAAD,EAA2BC,GAA3B,KAAwC;AAC9D,UAAM,CAACC,KAAD,EAAQC,SAAR,IAAqBR,4BAA4B,CAACK,KAAD,CAAvD;;AACA,QAAII,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAAzB,IAA0CP,KAA9C,EAAqD;AACnD;AACAQ,MAAAA,OAAO,CAACC,GAAR,kBAEE,0EAFF;AAIA;;AACAD,MAAAA,OAAO,CAACC,GAAR,CAAY,YAAZ,EAA0B,mCAA1B,EAA+DR,KAA/D;AACA;;AACAO,MAAAA,OAAO,CAACC,GAAR,CAAY,YAAZ,EAA0B,mCAA1B,EAA+DN,KAA/D;AACA;;AACAK,MAAAA,OAAO,CAACC,GAAR,CACE,gBADF,EAEE,mCAFF,EAGEL,SAHF;AAKD;;AACD,wBACE,oBAAC,IAAD,eAAUA,SAAV;AAAqB,MAAA,KAAK,EAAED,KAA5B;AAAmC,MAAA,GAAG,EAAED;AAAxC,QACGD,KAAK,CAACS,QADT,CADF;AAKD,GAxBM,CAAP;AAyBD,CA1BM","sourcesContent":["import React from 'react';\r\nimport { useStyledSystemPropsResolver } from '../hooks/';\r\n\r\nexport const makeStyledComponent = (Comp: any) => {\r\n  return React.forwardRef(({ debug, ...props }: any, ref: any) => {\r\n    const [style, restProps] = useStyledSystemPropsResolver(props);\r\n    if (process.env.NODE_ENV === 'development' && debug) {\r\n      /* eslint-disable-next-line */\r\n      console.log(\r\n        `%cstyleSystem`,\r\n        'background: #4b5563; color: #d97706; font-weight: 700; padding: 2px 8px;'\r\n      );\r\n      /* eslint-disable-next-line */\r\n      console.log('%c props: ', 'color: #4ade80; font-weight: 700;', props);\r\n      /* eslint-disable-next-line */\r\n      console.log('%c style: ', 'color: #22d3ee; font-weight: 700;', style);\r\n      /* eslint-disable-next-line */\r\n      console.log(\r\n        '%c restProps: ',\r\n        'color: #22d3ee; font-weight: 700;',\r\n        restProps\r\n      );\r\n    }\r\n    return (\r\n      <Comp {...restProps} style={style} ref={ref}>\r\n        {props.children}\r\n      </Comp>\r\n    );\r\n  });\r\n};\r\n"]}

package/lib/module/utils/test-utils.js

@@ -0,0 +1,23 @@
+import { NativeBaseProvider } from '../core/NativeBaseProvider';
+import * as React from 'react';
+export const Wrapper = ({
+  children
+}) => {
+  return /*#__PURE__*/React.createElement(NativeBaseProvider, {
+    initialWindowMetrics: {
+      frame: {
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+      },
+      insets: {
+        top: 0,
+        left: 0,
+        right: 0,
+        bottom: 0
+      }
+    }
+  }, children);
+};
+//# sourceMappingURL=test-utils.js.map

package/lib/module/utils/test-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["test-utils.tsx"],"names":["NativeBaseProvider","React","Wrapper","children","frame","x","y","width","height","insets","top","left","right","bottom"],"mappings":"AAAA,SAASA,kBAAT,QAAmC,4BAAnC;AACA,OAAO,KAAKC,KAAZ,MAAuB,OAAvB;AAEA,OAAO,MAAMC,OAAO,GAAG,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAuB;AAC5C,sBACE,oBAAC,kBAAD;AACE,IAAA,oBAAoB,EAAE;AACpBC,MAAAA,KAAK,EAAE;AAAEC,QAAAA,CAAC,EAAE,CAAL;AAAQC,QAAAA,CAAC,EAAE,CAAX;AAAcC,QAAAA,KAAK,EAAE,CAArB;AAAwBC,QAAAA,MAAM,EAAE;AAAhC,OADa;AAEpBC,MAAAA,MAAM,EAAE;AAAEC,QAAAA,GAAG,EAAE,CAAP;AAAUC,QAAAA,IAAI,EAAE,CAAhB;AAAmBC,QAAAA,KAAK,EAAE,CAA1B;AAA6BC,QAAAA,MAAM,EAAE;AAArC;AAFY;AADxB,KAMGV,QANH,CADF;AAUD,CAXM","sourcesContent":["import { NativeBaseProvider } from '../core/NativeBaseProvider';\r\nimport * as React from 'react';\r\n\r\nexport const Wrapper = ({ children }: any) => {\r\n  return (\r\n    <NativeBaseProvider\r\n      initialWindowMetrics={{\r\n        frame: { x: 0, y: 0, width: 0, height: 0 },\r\n        insets: { top: 0, left: 0, right: 0, bottom: 0 },\r\n      }}\r\n    >\r\n      {children}\r\n    </NativeBaseProvider>\r\n  );\r\n};\r\n"]}

package/lib/module/utils/tests/filterShadow.test.js

@@ -0,0 +1,32 @@
+import { filterShadowProps } from './../../utils/filterShadowProps';
+describe('filterShadowProps', () => {
+  test('empty', () => {
+    expect(filterShadowProps({}, {}, 'web')).toEqual({
+      style: {}
+    });
+  });
+  test('basic', () => {
+    expect(filterShadowProps({
+      top: 10,
+      shadowColor: '#FFF',
+      shadowOffset: {
+        width: 0,
+        height: 1
+      },
+      shadowOpacity: 0.18,
+      shadowRadius: 1.0
+    }, {}, 'web')).toEqual({
+      top: 10,
+      style: {
+        shadowColor: '#FFF',
+        shadowOffset: {
+          width: 0,
+          height: 1
+        },
+        shadowOpacity: 0.18,
+        shadowRadius: 1.0
+      }
+    });
+  });
+});
+//# sourceMappingURL=filterShadow.test.js.map

package/lib/module/utils/tests/filterShadow.test.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["filterShadow.test.tsx"],"names":["filterShadowProps","describe","test","expect","toEqual","style","top","shadowColor","shadowOffset","width","height","shadowOpacity","shadowRadius"],"mappings":"AAAA,SAASA,iBAAT,QAAkC,iCAAlC;AACAC,QAAQ,CAAC,mBAAD,EAAsB,MAAM;AAClCC,EAAAA,IAAI,CAAC,OAAD,EAAU,MAAM;AAClBC,IAAAA,MAAM,CAACH,iBAAiB,CAAC,EAAD,EAAK,EAAL,EAAS,KAAT,CAAlB,CAAN,CAAyCI,OAAzC,CAAiD;AAAEC,MAAAA,KAAK,EAAE;AAAT,KAAjD;AACD,GAFG,CAAJ;AAGAH,EAAAA,IAAI,CAAC,OAAD,EAAU,MAAM;AAClBC,IAAAA,MAAM,CACJH,iBAAiB,CACf;AACEM,MAAAA,GAAG,EAAE,EADP;AAEEC,MAAAA,WAAW,EAAE,MAFf;AAGEC,MAAAA,YAAY,EAAE;AACZC,QAAAA,KAAK,EAAE,CADK;AAEZC,QAAAA,MAAM,EAAE;AAFI,OAHhB;AAOEC,MAAAA,aAAa,EAAE,IAPjB;AAQEC,MAAAA,YAAY,EAAE;AARhB,KADe,EAWf,EAXe,EAYf,KAZe,CADb,CAAN,CAeER,OAfF,CAeU;AACRE,MAAAA,GAAG,EAAE,EADG;AAERD,MAAAA,KAAK,EAAE;AACLE,QAAAA,WAAW,EAAE,MADR;AAELC,QAAAA,YAAY,EAAE;AACZC,UAAAA,KAAK,EAAE,CADK;AAEZC,UAAAA,MAAM,EAAE;AAFI,SAFT;AAMLC,QAAAA,aAAa,EAAE,IANV;AAOLC,QAAAA,YAAY,EAAE;AAPT;AAFC,KAfV;AA2BD,GA5BG,CAAJ;AA6BD,CAjCO,CAAR","sourcesContent":["import { filterShadowProps } from './../../utils/filterShadowProps';\r\ndescribe('filterShadowProps', () => {\r\n  test('empty', () => {\r\n    expect(filterShadowProps({}, {}, 'web')).toEqual({ style: {} });\r\n  });\r\n  test('basic', () => {\r\n    expect(\r\n      filterShadowProps(\r\n        {\r\n          top: 10,\r\n          shadowColor: '#FFF',\r\n          shadowOffset: {\r\n            width: 0,\r\n            height: 1,\r\n          },\r\n          shadowOpacity: 0.18,\r\n          shadowRadius: 1.0,\r\n        },\r\n        {},\r\n        'web'\r\n      )\r\n    ).toEqual({\r\n      top: 10,\r\n      style: {\r\n        shadowColor: '#FFF',\r\n        shadowOffset: {\r\n          width: 0,\r\n          height: 1,\r\n        },\r\n        shadowOpacity: 0.18,\r\n        shadowRadius: 1.0,\r\n      },\r\n    });\r\n  });\r\n});\r\n"]}

package/lib/module/utils/useKeyboardBottomInset.js

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import { Keyboard, Platform } from 'react-native';
+export const useKeyboardBottomInset = () => {
+  const [bottom, setBottom] = React.useState(0);
+  const subscriptions = React.useRef([]);
+  React.useEffect(() => {
+    function onKeyboardChange(e) {
+      if (e.startCoordinates && e.endCoordinates.screenY <= e.startCoordinates.screenY) setBottom(e.endCoordinates.height / 2);else setBottom(0);
+    }
+
+    if (Platform.OS === 'ios') {
+      subscriptions.current = [Keyboard.addListener('keyboardWillChangeFrame', onKeyboardChange)];
+    } else {
+      subscriptions.current = [Keyboard.addListener('keyboardDidHide', onKeyboardChange), Keyboard.addListener('keyboardDidShow', onKeyboardChange)];
+    }
+
+    return () => {
+      subscriptions.current.forEach(subscription => {
+        subscription.remove();
+      });
+    };
+  }, [setBottom, subscriptions]);
+  return bottom;
+};
+//# sourceMappingURL=useKeyboardBottomInset.js.map

package/lib/module/utils/useKeyboardBottomInset.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useKeyboardBottomInset.ts"],"names":["React","Keyboard","Platform","useKeyboardBottomInset","bottom","setBottom","useState","subscriptions","useRef","useEffect","onKeyboardChange","e","startCoordinates","endCoordinates","screenY","height","OS","current","addListener","forEach","subscription","remove"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAASC,QAAT,EAAmBC,QAAnB,QAAkD,cAAlD;AAEA,OAAO,MAAMC,sBAAsB,GAAG,MAAM;AAC1C,QAAM,CAACC,MAAD,EAASC,SAAT,IAAsBL,KAAK,CAACM,QAAN,CAAe,CAAf,CAA5B;AACA,QAAMC,aAAa,GAAGP,KAAK,CAACQ,MAAN,CAAoB,EAApB,CAAtB;AAEAR,EAAAA,KAAK,CAACS,SAAN,CAAgB,MAAM;AACpB,aAASC,gBAAT,CAA0BC,CAA1B,EAA4C;AAC1C,UACEA,CAAC,CAACC,gBAAF,IACAD,CAAC,CAACE,cAAF,CAAiBC,OAAjB,IAA4BH,CAAC,CAACC,gBAAF,CAAmBE,OAFjD,EAIET,SAAS,CAACM,CAAC,CAACE,cAAF,CAAiBE,MAAjB,GAA0B,CAA3B,CAAT,CAJF,KAKKV,SAAS,CAAC,CAAD,CAAT;AACN;;AAED,QAAIH,QAAQ,CAACc,EAAT,KAAgB,KAApB,EAA2B;AACzBT,MAAAA,aAAa,CAACU,OAAd,GAAwB,CACtBhB,QAAQ,CAACiB,WAAT,CAAqB,yBAArB,EAAgDR,gBAAhD,CADsB,CAAxB;AAGD,KAJD,MAIO;AACLH,MAAAA,aAAa,CAACU,OAAd,GAAwB,CACtBhB,QAAQ,CAACiB,WAAT,CAAqB,iBAArB,EAAwCR,gBAAxC,CADsB,EAEtBT,QAAQ,CAACiB,WAAT,CAAqB,iBAArB,EAAwCR,gBAAxC,CAFsB,CAAxB;AAID;;AACD,WAAO,MAAM;AACXH,MAAAA,aAAa,CAACU,OAAd,CAAsBE,OAAtB,CAA+BC,YAAD,IAAkB;AAC9CA,QAAAA,YAAY,CAACC,MAAb;AACD,OAFD;AAGD,KAJD;AAKD,GAzBD,EAyBG,CAAChB,SAAD,EAAYE,aAAZ,CAzBH;AA2BA,SAAOH,MAAP;AACD,CAhCM","sourcesContent":["import * as React from 'react';\r\nimport { Keyboard, Platform, KeyboardEvent } from 'react-native';\r\n\r\nexport const useKeyboardBottomInset = () => {\r\n  const [bottom, setBottom] = React.useState(0);\r\n  const subscriptions = React.useRef<any[]>([]);\r\n\r\n  React.useEffect(() => {\r\n    function onKeyboardChange(e: KeyboardEvent) {\r\n      if (\r\n        e.startCoordinates &&\r\n        e.endCoordinates.screenY <= e.startCoordinates.screenY\r\n      )\r\n        setBottom(e.endCoordinates.height / 2);\r\n      else setBottom(0);\r\n    }\r\n\r\n    if (Platform.OS === 'ios') {\r\n      subscriptions.current = [\r\n        Keyboard.addListener('keyboardWillChangeFrame', onKeyboardChange),\r\n      ];\r\n    } else {\r\n      subscriptions.current = [\r\n        Keyboard.addListener('keyboardDidHide', onKeyboardChange),\r\n        Keyboard.addListener('keyboardDidShow', onKeyboardChange),\r\n      ];\r\n    }\r\n    return () => {\r\n      subscriptions.current.forEach((subscription) => {\r\n        subscription.remove();\r\n      });\r\n    };\r\n  }, [setBottom, subscriptions]);\r\n\r\n  return bottom;\r\n};\r\n"]}

package/lib/module/utils/useResponsiveQuery/ResponsiveQueryProvider.js

@@ -0,0 +1,13 @@
+import React from 'react';
+export const ResponsiveQueryContext = /*#__PURE__*/React.createContext({
+  disableCSSMediaQueries: false
+});
+export const ResponsiveQueryProvider = props => {
+  const value = React.useMemo(() => ({
+    disableCSSMediaQueries: props.disableCSSMediaQueries
+  }), [props.disableCSSMediaQueries]);
+  return /*#__PURE__*/React.createElement(ResponsiveQueryContext.Provider, {
+    value: value
+  }, props.children);
+};
+//# sourceMappingURL=ResponsiveQueryProvider.js.map

package/lib/module/utils/useResponsiveQuery/ResponsiveQueryProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ResponsiveQueryProvider.tsx"],"names":["React","ResponsiveQueryContext","createContext","disableCSSMediaQueries","ResponsiveQueryProvider","props","value","useMemo","children"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAMA,OAAO,MAAMC,sBAAsB,gBAAGD,KAAK,CAACE,aAAN,CACpC;AACEC,EAAAA,sBAAsB,EAAE;AAD1B,CADoC,CAA/B;AAMP,OAAO,MAAMC,uBAAuB,GAClCC,KADqC,IAElC;AACH,QAAMC,KAAK,GAAGN,KAAK,CAACO,OAAN,CACZ,OAAO;AACLJ,IAAAA,sBAAsB,EAAEE,KAAK,CAACF;AADzB,GAAP,CADY,EAIZ,CAACE,KAAK,CAACF,sBAAP,CAJY,CAAd;AAOA,sBACE,oBAAC,sBAAD,CAAwB,QAAxB;AAAiC,IAAA,KAAK,EAAEG;AAAxC,KACGD,KAAK,CAACG,QADT,CADF;AAKD,CAfM","sourcesContent":["import React from 'react';\r\n\r\ntype ResponsiveQueryContextType = {\r\n  disableCSSMediaQueries?: boolean;\r\n};\r\n\r\nexport const ResponsiveQueryContext = React.createContext<ResponsiveQueryContextType>(\r\n  {\r\n    disableCSSMediaQueries: false,\r\n  }\r\n);\r\n\r\nexport const ResponsiveQueryProvider = (\r\n  props: ResponsiveQueryContextType & { children: React.ReactNode }\r\n) => {\r\n  const value = React.useMemo(\r\n    () => ({\r\n      disableCSSMediaQueries: props.disableCSSMediaQueries,\r\n    }),\r\n    [props.disableCSSMediaQueries]\r\n  );\r\n\r\n  return (\r\n    <ResponsiveQueryContext.Provider value={value}>\r\n      {props.children}\r\n    </ResponsiveQueryContext.Provider>\r\n  );\r\n};\r\n"]}

package/lib/module/utils/useResponsiveQuery/common.js

@@ -0,0 +1,74 @@
+import { Dimensions, StyleSheet } from 'react-native';
+import React from 'react';
+export const getResponsiveStylesImpl = width => queries => {
+  if (typeof width === 'number') {
+    let styles = queries.initial ? [StyleSheet.create({
+      initial: StyleSheet.flatten(queries.initial)
+    }).initial] : [];
+
+    if (queries.query) {
+      queries.query.forEach(queryRule => {
+        if (queryRule.style) {
+          const flattenQueryStyle = StyleSheet.flatten(queryRule.style);
+
+          if (typeof queryRule.maxWidth === 'number' && typeof queryRule.minWidth === 'number') {
+            if (width >= queryRule.minWidth && width <= queryRule.maxWidth) {
+              styles.push(StyleSheet.create({
+                rangeStyle: flattenQueryStyle
+              }).rangeStyle);
+            }
+          } else if (typeof queryRule.minWidth === 'number') {
+            if (width >= queryRule.minWidth) {
+              styles.push(StyleSheet.create({
+                minWidthStyle: flattenQueryStyle
+              }).minWidthStyle);
+            }
+          } else if (typeof queryRule.maxWidth === 'number') {
+            if (width <= queryRule.maxWidth) {
+              styles.push(StyleSheet.create({
+                maxWidthStyle: flattenQueryStyle
+              }).maxWidthStyle);
+            }
+          }
+        }
+      });
+      return {
+        styles
+      };
+    }
+  }
+
+  return {};
+}; // The below implementation is taken from React Native's source and added a flag to conditionally attach/remove listeners
+
+export const useDimensionsWithEnable = ({
+  enable
+}) => {
+  const [dimensions, setDimensions] = React.useState(() => Dimensions.get('window'));
+  React.useEffect(() => {
+    if (enable) {
+      function handleChange({
+        window
+      }) {
+        if (dimensions.width !== window.width || dimensions.height !== window.height || dimensions.scale !== window.scale || dimensions.fontScale !== window.fontScale) {
+          setDimensions(window);
+        }
+      }
+
+      Dimensions.addEventListener('change', handleChange); // We might have missed an update between calling `get` in render and
+      // `addEventListener` in this handler, so we set it here. If there was
+      // no change, React will filter out this update as a no-op.
+
+      handleChange({
+        window: Dimensions.get('window')
+      });
+      return () => {
+        Dimensions.removeEventListener('change', handleChange);
+      };
+    }
+
+    return () => {};
+  }, [dimensions, enable]);
+  return dimensions;
+};
+//# sourceMappingURL=common.js.map

package/lib/module/utils/useResponsiveQuery/common.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["common.ts"],"names":["Dimensions","StyleSheet","React","getResponsiveStylesImpl","width","queries","styles","initial","create","flatten","query","forEach","queryRule","style","flattenQueryStyle","maxWidth","minWidth","push","rangeStyle","minWidthStyle","maxWidthStyle","useDimensionsWithEnable","enable","dimensions","setDimensions","useState","get","useEffect","handleChange","window","height","scale","fontScale","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["import type {\r\n  GetResponsiveStylesParams,\r\n  GetResponsiveStylesReturnType,\r\n} from './types';\r\nimport { Dimensions, ScaledSize, StyleSheet } from 'react-native';\r\nimport React from 'react';\r\n\r\nexport const getResponsiveStylesImpl = (width: number) => (\r\n  queries: GetResponsiveStylesParams\r\n): GetResponsiveStylesReturnType => {\r\n  if (typeof width === 'number') {\r\n    let styles = queries.initial\r\n      ? [\r\n          StyleSheet.create({ initial: StyleSheet.flatten(queries.initial) })\r\n            .initial,\r\n        ]\r\n      : [];\r\n\r\n    if (queries.query) {\r\n      queries.query.forEach((queryRule) => {\r\n        if (queryRule.style) {\r\n          const flattenQueryStyle = StyleSheet.flatten(queryRule.style);\r\n\r\n          if (\r\n            typeof queryRule.maxWidth === 'number' &&\r\n            typeof queryRule.minWidth === 'number'\r\n          ) {\r\n            if (width >= queryRule.minWidth && width <= queryRule.maxWidth) {\r\n              styles.push(\r\n                StyleSheet.create({ rangeStyle: flattenQueryStyle }).rangeStyle\r\n              );\r\n            }\r\n          } else if (typeof queryRule.minWidth === 'number') {\r\n            if (width >= queryRule.minWidth) {\r\n              styles.push(\r\n                StyleSheet.create({ minWidthStyle: flattenQueryStyle })\r\n                  .minWidthStyle\r\n              );\r\n            }\r\n          } else if (typeof queryRule.maxWidth === 'number') {\r\n            if (width <= queryRule.maxWidth) {\r\n              styles.push(\r\n                StyleSheet.create({ maxWidthStyle: flattenQueryStyle })\r\n                  .maxWidthStyle\r\n              );\r\n            }\r\n          }\r\n        }\r\n      });\r\n      return { styles };\r\n    }\r\n  }\r\n\r\n  return {};\r\n};\r\n\r\n// The below implementation is taken from React Native's source and added a flag to conditionally attach/remove listeners\r\nexport const useDimensionsWithEnable = ({ enable }: { enable?: boolean }) => {\r\n  const [dimensions, setDimensions] = React.useState(() =>\r\n    Dimensions.get('window')\r\n  );\r\n\r\n  React.useEffect(() => {\r\n    if (enable) {\r\n      function handleChange({ window }: { window: ScaledSize }) {\r\n        if (\r\n          dimensions.width !== window.width ||\r\n          dimensions.height !== window.height ||\r\n          dimensions.scale !== window.scale ||\r\n          dimensions.fontScale !== window.fontScale\r\n        ) {\r\n          setDimensions(window);\r\n        }\r\n      }\r\n      Dimensions.addEventListener('change', handleChange);\r\n      // We might have missed an update between calling `get` in render and\r\n      // `addEventListener` in this handler, so we set it here. If there was\r\n      // no change, React will filter out this update as a no-op.\r\n      handleChange({ window: Dimensions.get('window') });\r\n\r\n      return () => {\r\n        Dimensions.removeEventListener('change', handleChange);\r\n      };\r\n    }\r\n    return () => {};\r\n  }, [dimensions, enable]);\r\n  return dimensions;\r\n};\r\n"]}

package/lib/module/utils/useResponsiveQuery/hash.js

@@ -0,0 +1,56 @@
+/* eslint-disable */
+//@ts-nocheck
+// This hash function is taken from react native web
+
+/**
+ * JS Implementation of MurmurHash2
+ *
+ * @author <a href="mailto:gary.court@gmail.com">Gary Court</a>
+ * @see http://github.com/garycourt/murmurhash-js
+ * @author <a href="mailto:aappleby@gmail.com">Austin Appleby</a>
+ * @see http://sites.google.com/site/murmurhash/
+ *
+ * @param {string} str ASCII only
+ * @param {number} seed Positive integer only
+ * @return {number} 32-bit positive integer hash
+ */
+function murmurhash2_32_gc(str, seed) {
+  var l = str.length,
+      h = seed ^ l,
+      i = 0,
+      k;
+
+  while (l >= 4) {
+    k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;
+    k = (k & 0xffff) * 0x5bd1e995 + (((k >>> 16) * 0x5bd1e995 & 0xffff) << 16);
+    k ^= k >>> 24;
+    k = (k & 0xffff) * 0x5bd1e995 + (((k >>> 16) * 0x5bd1e995 & 0xffff) << 16);
+    h = (h & 0xffff) * 0x5bd1e995 + (((h >>> 16) * 0x5bd1e995 & 0xffff) << 16) ^ k;
+    l -= 4;
+    ++i;
+  }
+
+  switch (l) {
+    case 3:
+      h ^= (str.charCodeAt(i + 2) & 0xff) << 16;
+
+    case 2:
+      h ^= (str.charCodeAt(i + 1) & 0xff) << 8;
+
+    case 1:
+      h ^= str.charCodeAt(i) & 0xff;
+      h = (h & 0xffff) * 0x5bd1e995 + (((h >>> 16) * 0x5bd1e995 & 0xffff) << 16);
+  }
+
+  h ^= h >>> 13;
+  h = (h & 0xffff) * 0x5bd1e995 + (((h >>> 16) * 0x5bd1e995 & 0xffff) << 16);
+  h ^= h >>> 15;
+  return h >>> 0;
+}
+
+const hash = function hash(str) {
+  return murmurhash2_32_gc(str, 1).toString(36);
+};
+
+export default hash;
+//# sourceMappingURL=hash.js.map

package/lib/module/utils/useResponsiveQuery/hash.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["hash.ts"],"names":["murmurhash2_32_gc","str","seed","l","length","h","i","k","charCodeAt","hash","toString"],"mappings":"AAAA;AACA;AACA;;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,iBAAT,CAA2BC,GAA3B,EAAwCC,IAAxC,EAAsD;AACpD,MAAIC,CAAC,GAAGF,GAAG,CAACG,MAAZ;AAAA,MACEC,CAAC,GAAGH,IAAI,GAAGC,CADb;AAAA,MAEEG,CAAC,GAAG,CAFN;AAAA,MAGEC,CAHF;;AAKA,SAAOJ,CAAC,IAAI,CAAZ,EAAe;AACbI,IAAAA,CAAC,GACEN,GAAG,CAACO,UAAJ,CAAeF,CAAf,IAAoB,IAArB,GACC,CAACL,GAAG,CAACO,UAAJ,CAAe,EAAEF,CAAjB,IAAsB,IAAvB,KAAgC,CADjC,GAEC,CAACL,GAAG,CAACO,UAAJ,CAAe,EAAEF,CAAjB,IAAsB,IAAvB,KAAgC,EAFjC,GAGC,CAACL,GAAG,CAACO,UAAJ,CAAe,EAAEF,CAAjB,IAAsB,IAAvB,KAAgC,EAJnC;AAKAC,IAAAA,CAAC,GACC,CAACA,CAAC,GAAG,MAAL,IAAe,UAAf,IAA6B,CAAE,CAACA,CAAC,KAAK,EAAP,IAAa,UAAd,GAA4B,MAA7B,KAAwC,EAArE,CADF;AAEAA,IAAAA,CAAC,IAAIA,CAAC,KAAK,EAAX;AACAA,IAAAA,CAAC,GACC,CAACA,CAAC,GAAG,MAAL,IAAe,UAAf,IAA6B,CAAE,CAACA,CAAC,KAAK,EAAP,IAAa,UAAd,GAA4B,MAA7B,KAAwC,EAArE,CADF;AAEAF,IAAAA,CAAC,GACE,CAACA,CAAC,GAAG,MAAL,IAAe,UAAf,IACE,CAAE,CAACA,CAAC,KAAK,EAAP,IAAa,UAAd,GAA4B,MAA7B,KAAwC,EAD1C,CAAD,GAEAE,CAHF;AAIAJ,IAAAA,CAAC,IAAI,CAAL;AACA,MAAEG,CAAF;AACD;;AAED,UAAQH,CAAR;AACE,SAAK,CAAL;AACEE,MAAAA,CAAC,IAAI,CAACJ,GAAG,CAACO,UAAJ,CAAeF,CAAC,GAAG,CAAnB,IAAwB,IAAzB,KAAkC,EAAvC;;AAEF,SAAK,CAAL;AACED,MAAAA,CAAC,IAAI,CAACJ,GAAG,CAACO,UAAJ,CAAeF,CAAC,GAAG,CAAnB,IAAwB,IAAzB,KAAkC,CAAvC;;AAEF,SAAK,CAAL;AACED,MAAAA,CAAC,IAAIJ,GAAG,CAACO,UAAJ,CAAeF,CAAf,IAAoB,IAAzB;AACAD,MAAAA,CAAC,GACC,CAACA,CAAC,GAAG,MAAL,IAAe,UAAf,IACC,CAAE,CAACA,CAAC,KAAK,EAAP,IAAa,UAAd,GAA4B,MAA7B,KAAwC,EADzC,CADF;AATJ;;AAcAA,EAAAA,CAAC,IAAIA,CAAC,KAAK,EAAX;AACAA,EAAAA,CAAC,GAAG,CAACA,CAAC,GAAG,MAAL,IAAe,UAAf,IAA6B,CAAE,CAACA,CAAC,KAAK,EAAP,IAAa,UAAd,GAA4B,MAA7B,KAAwC,EAArE,CAAJ;AACAA,EAAAA,CAAC,IAAIA,CAAC,KAAK,EAAX;AACA,SAAOA,CAAC,KAAK,CAAb;AACD;;AAED,MAAMI,IAAI,GAAG,SAASA,IAAT,CAAcR,GAAd,EAA2B;AACtC,SAAOD,iBAAiB,CAACC,GAAD,EAAM,CAAN,CAAjB,CAA0BS,QAA1B,CAAmC,EAAnC,CAAP;AACD,CAFD;;AAIA,eAAeD,IAAf","sourcesContent":["/* eslint-disable */\r\n//@ts-nocheck\r\n// This hash function is taken from react native web\r\n/**\r\n * JS Implementation of MurmurHash2\r\n *\r\n * @author <a href=\"mailto:gary.court@gmail.com\">Gary Court</a>\r\n * @see http://github.com/garycourt/murmurhash-js\r\n * @author <a href=\"mailto:aappleby@gmail.com\">Austin Appleby</a>\r\n * @see http://sites.google.com/site/murmurhash/\r\n *\r\n * @param {string} str ASCII only\r\n * @param {number} seed Positive integer only\r\n * @return {number} 32-bit positive integer hash\r\n */\r\nfunction murmurhash2_32_gc(str: string, seed: number) {\r\n  var l = str.length,\r\n    h = seed ^ l,\r\n    i = 0,\r\n    k;\r\n\r\n  while (l >= 4) {\r\n    k =\r\n      (str.charCodeAt(i) & 0xff) |\r\n      ((str.charCodeAt(++i) & 0xff) << 8) |\r\n      ((str.charCodeAt(++i) & 0xff) << 16) |\r\n      ((str.charCodeAt(++i) & 0xff) << 24);\r\n    k =\r\n      (k & 0xffff) * 0x5bd1e995 + ((((k >>> 16) * 0x5bd1e995) & 0xffff) << 16);\r\n    k ^= k >>> 24;\r\n    k =\r\n      (k & 0xffff) * 0x5bd1e995 + ((((k >>> 16) * 0x5bd1e995) & 0xffff) << 16);\r\n    h =\r\n      ((h & 0xffff) * 0x5bd1e995 +\r\n        ((((h >>> 16) * 0x5bd1e995) & 0xffff) << 16)) ^\r\n      k;\r\n    l -= 4;\r\n    ++i;\r\n  }\r\n\r\n  switch (l) {\r\n    case 3:\r\n      h ^= (str.charCodeAt(i + 2) & 0xff) << 16;\r\n\r\n    case 2:\r\n      h ^= (str.charCodeAt(i + 1) & 0xff) << 8;\r\n\r\n    case 1:\r\n      h ^= str.charCodeAt(i) & 0xff;\r\n      h =\r\n        (h & 0xffff) * 0x5bd1e995 +\r\n        ((((h >>> 16) * 0x5bd1e995) & 0xffff) << 16);\r\n  }\r\n\r\n  h ^= h >>> 13;\r\n  h = (h & 0xffff) * 0x5bd1e995 + ((((h >>> 16) * 0x5bd1e995) & 0xffff) << 16);\r\n  h ^= h >>> 15;\r\n  return h >>> 0;\r\n}\r\n\r\nconst hash = function hash(str: string) {\r\n  return murmurhash2_32_gc(str, 1).toString(36);\r\n};\r\n\r\nexport default hash;\r\n"]}

package/lib/module/utils/useResponsiveQuery/index.js

@@ -0,0 +1,4 @@
+export { useResponsiveQuery } from './useResponsiveQuery';
+export { ResponsiveQueryProvider } from './ResponsiveQueryProvider';
+export * from './types';
+//# sourceMappingURL=index.js.map

package/lib/module/utils/useResponsiveQuery/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"names":["useResponsiveQuery","ResponsiveQueryProvider"],"mappings":"AAAA,SAASA,kBAAT,QAAmC,sBAAnC;AACA,SAASC,uBAAT,QAAwC,2BAAxC;AACA,cAAc,SAAd","sourcesContent":["export { useResponsiveQuery } from './useResponsiveQuery';\r\nexport { ResponsiveQueryProvider } from './ResponsiveQueryProvider';\r\nexport * from './types';\r\n"]}

package/lib/module/utils/useResponsiveQuery/types.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=types.js.map

package/lib/module/utils/useResponsiveQuery/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/lib/module/utils/useResponsiveQuery/useResponsiveQuery.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import { useWindowDimensions } from 'react-native';
+import { useStableMemo } from './useStableMemo';
+import { getResponsiveStylesImpl } from './common';
+export const useResponsiveQuery = queries => {
+  const windowWidth = useWindowDimensions().width;
+  const values = useStableMemo(() => {
+    const getResponsiveStyles = getResponsiveStylesImpl(windowWidth);
+
+    if (queries) {
+      const {
+        styles
+      } = getResponsiveStyles(queries);
+      return {
+        styles,
+        getResponsiveStyles
+      };
+    } else {
+      return {
+        getResponsiveStyles
+      };
+    }
+  }, [queries, windowWidth]);
+  return values;
+};
+/**
+ * This function is copied from intergalacticspacehighway/rnw-responsive-ssr
+ */
+// noop, web-only. Refer useResponsiveQuery.web.tsx
+
+export const getStyleElement = () => {
+  return /*#__PURE__*/React.createElement(React.Fragment, null);
+};
+//# sourceMappingURL=useResponsiveQuery.js.map

package/lib/module/utils/useResponsiveQuery/useResponsiveQuery.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useResponsiveQuery.tsx"],"names":["React","useWindowDimensions","useStableMemo","getResponsiveStylesImpl","useResponsiveQuery","queries","windowWidth","width","values","getResponsiveStyles","styles","getStyleElement"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAKA,SAASC,mBAAT,QAAoC,cAApC;AACA,SAASC,aAAT,QAA8B,iBAA9B;AACA,SAASC,uBAAT,QAAwC,UAAxC;AAEA,OAAO,MAAMC,kBAAkB,GAC7BC,OADgC,IAEC;AACjC,QAAMC,WAAW,GAAGL,mBAAmB,GAAGM,KAA1C;AAEA,QAAMC,MAAM,GAAGN,aAAa,CAAC,MAAM;AACjC,UAAMO,mBAAmB,GAAGN,uBAAuB,CAACG,WAAD,CAAnD;;AACA,QAAID,OAAJ,EAAa;AACX,YAAM;AAAEK,QAAAA;AAAF,UAAaD,mBAAmB,CAACJ,OAAD,CAAtC;AACA,aAAO;AAAEK,QAAAA,MAAF;AAAUD,QAAAA;AAAV,OAAP;AACD,KAHD,MAGO;AACL,aAAO;AAAEA,QAAAA;AAAF,OAAP;AACD;AACF,GAR2B,EAQzB,CAACJ,OAAD,EAAUC,WAAV,CARyB,CAA5B;AAUA,SAAOE,MAAP;AACD,CAhBM;AAkBP;AACA;AACA;AACA;;AACA,OAAO,MAAMG,eAAe,GAAG,MAAM;AACnC,sBAAO,yCAAP;AACD,CAFM","sourcesContent":["import React from 'react';\r\nimport type {\r\n  UseResponsiveQueryParams,\r\n  UseResponsiveQueryReturnType,\r\n} from './types';\r\nimport { useWindowDimensions } from 'react-native';\r\nimport { useStableMemo } from './useStableMemo';\r\nimport { getResponsiveStylesImpl } from './common';\r\n\r\nexport const useResponsiveQuery = (\r\n  queries?: UseResponsiveQueryParams\r\n): UseResponsiveQueryReturnType => {\r\n  const windowWidth = useWindowDimensions().width;\r\n\r\n  const values = useStableMemo(() => {\r\n    const getResponsiveStyles = getResponsiveStylesImpl(windowWidth);\r\n    if (queries) {\r\n      const { styles } = getResponsiveStyles(queries);\r\n      return { styles, getResponsiveStyles };\r\n    } else {\r\n      return { getResponsiveStyles };\r\n    }\r\n  }, [queries, windowWidth]);\r\n\r\n  return values;\r\n};\r\n\r\n/**\r\n * This function is copied from intergalacticspacehighway/rnw-responsive-ssr\r\n */\r\n// noop, web-only. Refer useResponsiveQuery.web.tsx\r\nexport const getStyleElement = () => {\r\n  return <></>;\r\n};\r\n"]}

package/lib/module/utils/useResponsiveQuery/useResponsiveQuery.web.js

@@ -0,0 +1,195 @@
+// import { atomic } from 'react-native-web/dist/exports/StyleSheet/compiler';
+import { atomic } from '../react-native-web-fucntions/atomic';
+import preprocess from '../react-native-web-fucntions/preprocess';
+import { StyleSheet } from 'react-native'; // @ts-ignore
+
+import stableHash from 'stable-hash';
+import hash from './hash';
+import { useStableMemo } from './useStableMemo';
+import { getResponsiveStylesImpl, useDimensionsWithEnable } from './common';
+import { ResponsiveQueryContext } from './ResponsiveQueryProvider';
+import React from 'react';
+/******************** Implementation after RNW v0.18 ***********************/
+
+/**
+ * 1. preprocess:- Handles shadow/text shadow conversion from RN styles to web *                 styles
+ *
+ * 2. atomic:- it handles prefixing, converting RN specific styles to web styles *             and generating the CSS selector.
+ *             Input {marginTop: 10}
+ *             Output
+ *             compiledStyle : marginTop: "r-marginTop-156q2ks"
+ *             compiledOrderedRules : ".r-marginTop-156q2ks{margin-top:10px;}"
+ *      a)compiledStyle:- Array it holds identifier/selector with properties
+ *      b)compiledOrderedRules:- Array it holds the css rule with selector name
+ *      Also from RNW v0.18 handles swapping of ltr styles if enabled by user
+ * 3. createSheet:- used to grab sheet which exist already created by rnw. when we *                  call createSheet without id it will return sheet which exist. *                  cause it automatically takes a default ID  which is already in *                  use (created by rnw with default ID) so this return sheet *                  which exist with  ID doesn't create a new sheet.
+ *
+ * This Implementation is based on asumptions that RNW doesn't change the         * function  or doesn't re-write them. if there is any change in RNW implmentation * it we'll break and needs to be updated.
+ *
+ */
+
+let textContentMap = {};
+export const useResponsiveQuery = queries => {
+  var _queries$disableCSSMe;
+
+  const responsiveQueryContext = React.useContext(ResponsiveQueryContext);
+  const disableCSSMediaQueries = (_queries$disableCSSMe = queries === null || queries === void 0 ? void 0 : queries.disableCSSMediaQueries) !== null && _queries$disableCSSMe !== void 0 ? _queries$disableCSSMe : responsiveQueryContext.disableCSSMediaQueries; // Only attaches listener if disableCSSMediaQueries is true
+
+  const windowWidth = useDimensionsWithEnable({
+    enable: disableCSSMediaQueries
+  }).width;
+  const values = useStableMemo(() => {
+    // Use the non-media query responsive styling
+    if (disableCSSMediaQueries) {
+      const getResponsiveStyles = getResponsiveStylesImpl(windowWidth);
+
+      if (queries) {
+        const {
+          styles
+        } = getResponsiveStyles(queries);
+        return {
+          styles,
+          getResponsiveStyles
+        };
+      } else {
+        return {
+          getResponsiveStyles
+        };
+      }
+    } else {
+      if (queries) {
+        const {
+          styles,
+          dataSet
+        } = getResponsiveStyles(queries);
+        return {
+          dataSet,
+          styles,
+          getResponsiveStyles
+        };
+      } else {
+        return {
+          getResponsiveStyles
+        };
+      }
+    }
+  }, [queries, windowWidth, disableCSSMediaQueries]);
+  return values;
+};
+
+const getDataAttribute = queryRule => {
+  if (typeof queryRule.minWidth === 'number' && typeof queryRule.maxWidth === 'number') {
+    return "min-width-".concat(queryRule.minWidth, "-max-width-").concat(queryRule.maxWidth);
+  } else if (typeof queryRule.minWidth === 'number') {
+    return "min-width-".concat(queryRule.minWidth);
+  } else if (typeof queryRule.maxWidth === 'number') {
+    return "max-width-".concat(queryRule.maxWidth);
+  }
+
+  return undefined;
+};
+
+const getMediaQueryRule = (query, newRule) => {
+  if (typeof query.minWidth === 'number' && typeof query.maxWidth === 'number') {
+    return "@media only screen and (min-width: ".concat(query.minWidth, "px) and (max-width: ").concat(query.maxWidth, "px) { ").concat(newRule, " }");
+  } else if (typeof query.minWidth === 'number') {
+    return "@media only screen and (min-width: ".concat(query.minWidth, "px) { ").concat(newRule, " }");
+  } else if (typeof query.maxWidth === 'number') {
+    return "@media only screen and (max-width: ".concat(query.maxWidth, "px) { ").concat(newRule, " }");
+  }
+
+  return undefined;
+};
+
+let styleSheet;
+
+const insert = rule => {
+  if (rule === '') {
+    return;
+  }
+
+  if (typeof window !== 'undefined') {
+    if (!styleSheet) {
+      const styleEl = document.createElement('style');
+      styleEl.type = 'text/css';
+      styleEl.appendChild(document.createTextNode(''));
+      document.head.appendChild(styleEl);
+      styleSheet = styleEl.sheet;
+    }
+
+    styleSheet.insertRule(rule, styleSheet.cssRules.length);
+  }
+};
+
+const getResponsiveStyles = queries => {
+  const queryString = stableHash(queries.query);
+  const queriesHash = hash(queryString);
+  const styles = queries.initial ? [StyleSheet.create({
+    initial: StyleSheet.flatten(queries.initial)
+  }).initial] : undefined;
+  let dataSet = {};
+  /**
+   * This function is copied from intergalacticspacehighway/rnw-responsive-ssr
+   */
+
+  if (queries.query) {
+    queries.query.forEach(queryRule => {
+      const queryHash = queriesHash + hash(stableHash(queryRule));
+      const dataAttribute = getDataAttribute(queryRule);
+
+      if (dataAttribute) {
+        const newIdentifier = "[data-".concat(dataAttribute, "$=\"").concat(queryHash, "\"]");
+        dataSet[dataAttribute] = queryHash;
+        let mediaRules = '';
+        const flattenQueryStyle = StyleSheet.flatten(queryRule.style);
+        const newStyle = preprocess(flattenQueryStyle);
+        const [compiledStyle, compiledOrderedRules] = atomic(newStyle); //@ts-ignore
+
+        delete compiledStyle.$$css; //removing unnecessary $$css property
+
+        Object.keys(compiledStyle).forEach(key => {
+          const oldIdentifier = compiledStyle[key];
+          compiledOrderedRules.forEach(([rules, _order]) => {
+            // Rule returned by atomic has css selectors, so we'll replace it with data-attr selector
+            let newRule = '';
+
+            if (rules[0].includes(oldIdentifier)) {
+              newRule = rules[0].replace('.' + oldIdentifier, newIdentifier);
+            }
+
+            mediaRules += newRule;
+          });
+        });
+
+        if (mediaRules) {
+          const mediaQueryRule = getMediaQueryRule(queryRule, mediaRules);
+          const queryKey = "/*".concat(queryHash, "{}*/").concat(mediaQueryRule);
+
+          if (!textContentMap[queryKey]) {
+            insert(queryKey);
+            textContentMap[queryKey] = true;
+          }
+        }
+      }
+    });
+  }
+
+  return {
+    styles,
+    dataSet
+  };
+};
+/**
+ * This function is copied from intergalacticspacehighway/rnw-responsive-ssr
+ */
+
+
+export const getStyleElement = () => {
+  return /*#__PURE__*/React.createElement("style", {
+    type: "text/css",
+    dangerouslySetInnerHTML: {
+      __html: Object.keys(textContentMap).join('')
+    }
+  });
+};
+//# sourceMappingURL=useResponsiveQuery.web.js.map

package/lib/module/utils/useResponsiveQuery/useResponsiveQuery.web.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useResponsiveQuery.web.tsx"],"names":["atomic","preprocess","StyleSheet","stableHash","hash","useStableMemo","getResponsiveStylesImpl","useDimensionsWithEnable","ResponsiveQueryContext","React","textContentMap","useResponsiveQuery","queries","responsiveQueryContext","useContext","disableCSSMediaQueries","windowWidth","enable","width","values","getResponsiveStyles","styles","dataSet","getDataAttribute","queryRule","minWidth","maxWidth","undefined","getMediaQueryRule","query","newRule","styleSheet","insert","rule","window","styleEl","document","createElement","type","appendChild","createTextNode","head","sheet","insertRule","cssRules","length","queryString","queriesHash","initial","create","flatten","forEach","queryHash","dataAttribute","newIdentifier","mediaRules","flattenQueryStyle","style","newStyle","compiledStyle","compiledOrderedRules","$$css","Object","keys","key","oldIdentifier","rules","_order","includes","replace","mediaQueryRule","queryKey","getStyleElement","__html","join"],"mappings":"AAAA;AACA,SAASA,MAAT,QAAuB,sCAAvB;AACA,OAAOC,UAAP,MAAuB,0CAAvB;AAQA,SAASC,UAAT,QAA2B,cAA3B,C,CACA;;AACA,OAAOC,UAAP,MAAuB,aAAvB;AACA,OAAOC,IAAP,MAAiB,QAAjB;AAEA,SAASC,aAAT,QAA8B,iBAA9B;AACA,SAASC,uBAAT,EAAkCC,uBAAlC,QAAiE,UAAjE;AACA,SAASC,sBAAT,QAAuC,2BAAvC;AACA,OAAOC,KAAP,MAAkB,OAAlB;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,IAAIC,cAAmB,GAAG,EAA1B;AAEA,OAAO,MAAMC,kBAAkB,GAC7BC,OADgC,IAEC;AAAA;;AACjC,QAAMC,sBAAsB,GAAGJ,KAAK,CAACK,UAAN,CAAiBN,sBAAjB,CAA/B;AACA,QAAMO,sBAAsB,4BAC1BH,OAD0B,aAC1BA,OAD0B,uBAC1BA,OAAO,CAAEG,sBADiB,yEAE1BF,sBAAsB,CAACE,sBAFzB,CAFiC,CAMjC;;AACA,QAAMC,WAAW,GAAGT,uBAAuB,CAAC;AAC1CU,IAAAA,MAAM,EAAEF;AADkC,GAAD,CAAvB,CAEjBG,KAFH;AAIA,QAAMC,MAAM,GAAGd,aAAa,CAAC,MAAM;AACjC;AACA,QAAIU,sBAAJ,EAA4B;AAC1B,YAAMK,mBAAmB,GAAGd,uBAAuB,CAACU,WAAD,CAAnD;;AACA,UAAIJ,OAAJ,EAAa;AACX,cAAM;AAAES,UAAAA;AAAF,YAAaD,mBAAmB,CAACR,OAAD,CAAtC;AACA,eAAO;AAAES,UAAAA,MAAF;AAAUD,UAAAA;AAAV,SAAP;AACD,OAHD,MAGO;AACL,eAAO;AAAEA,UAAAA;AAAF,SAAP;AACD;AACF,KARD,MAQO;AACL,UAAIR,OAAJ,EAAa;AACX,cAAM;AAAES,UAAAA,MAAF;AAAUC,UAAAA;AAAV,YAAsBF,mBAAmB,CAACR,OAAD,CAA/C;AACA,eAAO;AAAEU,UAAAA,OAAF;AAAWD,UAAAA,MAAX;AAAmBD,UAAAA;AAAnB,SAAP;AACD,OAHD,MAGO;AACL,eAAO;AAAEA,UAAAA;AAAF,SAAP;AACD;AACF;AACF,GAlB2B,EAkBzB,CAACR,OAAD,EAAUI,WAAV,EAAuBD,sBAAvB,CAlByB,CAA5B;AAoBA,SAAOI,MAAP;AACD,CAlCM;;AAoCP,MAAMI,gBAAgB,GAAIC,SAAD,IAAsB;AAC7C,MACE,OAAOA,SAAS,CAACC,QAAjB,KAA8B,QAA9B,IACA,OAAOD,SAAS,CAACE,QAAjB,KAA8B,QAFhC,EAGE;AACA,+BAAoBF,SAAS,CAACC,QAA9B,wBAAoDD,SAAS,CAACE,QAA9D;AACD,GALD,MAKO,IAAI,OAAOF,SAAS,CAACC,QAAjB,KAA8B,QAAlC,EAA4C;AACjD,+BAAoBD,SAAS,CAACC,QAA9B;AACD,GAFM,MAEA,IAAI,OAAOD,SAAS,CAACE,QAAjB,KAA8B,QAAlC,EAA4C;AACjD,+BAAoBF,SAAS,CAACE,QAA9B;AACD;;AAED,SAAOC,SAAP;AACD,CAbD;;AAeA,MAAMC,iBAAiB,GAAG,CAACC,KAAD,EAAeC,OAAf,KAAmC;AAC3D,MACE,OAAOD,KAAK,CAACJ,QAAb,KAA0B,QAA1B,IACA,OAAOI,KAAK,CAACH,QAAb,KAA0B,QAF5B,EAGE;AACA,wDAA6CG,KAAK,CAACJ,QAAnD,iCAAkFI,KAAK,CAACH,QAAxF,mBAAyGI,OAAzG;AACD,GALD,MAKO,IAAI,OAAOD,KAAK,CAACJ,QAAb,KAA0B,QAA9B,EAAwC;AAC7C,wDAA6CI,KAAK,CAACJ,QAAnD,mBAAoEK,OAApE;AACD,GAFM,MAEA,IAAI,OAAOD,KAAK,CAACH,QAAb,KAA0B,QAA9B,EAAwC;AAC7C,wDAA6CG,KAAK,CAACH,QAAnD,mBAAoEI,OAApE;AACD;;AACD,SAAOH,SAAP;AACD,CAZD;;AAaA,IAAII,UAAJ;;AACA,MAAMC,MAAM,GAAIC,IAAD,IAAkB;AAC/B,MAAIA,IAAI,KAAK,EAAb,EAAiB;AACf;AACD;;AACD,MAAI,OAAOC,MAAP,KAAkB,WAAtB,EAAmC;AACjC,QAAI,CAACH,UAAL,EAAiB;AACf,YAAMI,OAAO,GAAGC,QAAQ,CAACC,aAAT,CAAuB,OAAvB,CAAhB;AACAF,MAAAA,OAAO,CAACG,IAAR,GAAe,UAAf;AACAH,MAAAA,OAAO,CAACI,WAAR,CAAoBH,QAAQ,CAACI,cAAT,CAAwB,EAAxB,CAApB;AACAJ,MAAAA,QAAQ,CAACK,IAAT,CAAcF,WAAd,CAA0BJ,OAA1B;AACAJ,MAAAA,UAAU,GAAGI,OAAO,CAACO,KAArB;AACD;;AAEDX,IAAAA,UAAU,CAACY,UAAX,CAAsBV,IAAtB,EAA4BF,UAAU,CAACa,QAAX,CAAoBC,MAAhD;AACD;AACF,CAfD;;AAgBA,MAAMzB,mBAAmB,GACvBR,OAD0B,IAEQ;AAClC,QAAMkC,WAAW,GAAG3C,UAAU,CAACS,OAAO,CAACiB,KAAT,CAA9B;AAEA,QAAMkB,WAAW,GAAG3C,IAAI,CAAC0C,WAAD,CAAxB;AAEA,QAAMzB,MAAM,GAAGT,OAAO,CAACoC,OAAR,GACX,CACE9C,UAAU,CAAC+C,MAAX,CAAkB;AAAED,IAAAA,OAAO,EAAE9C,UAAU,CAACgD,OAAX,CAAmBtC,OAAO,CAACoC,OAA3B;AAAX,GAAlB,EACGA,OAFL,CADW,GAKXrB,SALJ;AAOA,MAAIL,OAAgB,GAAG,EAAvB;AAEA;AACF;AACA;;AAEE,MAAIV,OAAO,CAACiB,KAAZ,EAAmB;AACjBjB,IAAAA,OAAO,CAACiB,KAAR,CAAcsB,OAAd,CAAuB3B,SAAD,IAAe;AACnC,YAAM4B,SAAS,GAAGL,WAAW,GAAG3C,IAAI,CAACD,UAAU,CAACqB,SAAD,CAAX,CAApC;AACA,YAAM6B,aAAa,GAAG9B,gBAAgB,CAACC,SAAD,CAAtC;;AAEA,UAAI6B,aAAJ,EAAmB;AACjB,cAAMC,aAAa,mBAAYD,aAAZ,iBAA+BD,SAA/B,QAAnB;AACA9B,QAAAA,OAAO,CAAC+B,aAAD,CAAP,GAAyBD,SAAzB;AAEA,YAAIG,UAAU,GAAG,EAAjB;AAEA,cAAMC,iBAAiB,GAAGtD,UAAU,CAACgD,OAAX,CAAmB1B,SAAS,CAACiC,KAA7B,CAA1B;AACA,cAAMC,QAAQ,GAAGzD,UAAU,CAACuD,iBAAD,CAA3B;AACA,cAAM,CAACG,aAAD,EAAgBC,oBAAhB,IAAwC5D,MAAM,CAAC0D,QAAD,CAApD,CARiB,CASjB;;AACA,eAAOC,aAAa,CAACE,KAArB,CAViB,CAUW;;AAC5BC,QAAAA,MAAM,CAACC,IAAP,CAAYJ,aAAZ,EAA2BR,OAA3B,CAAoCa,GAAD,IAAS;AAC1C,gBAAMC,aAAa,GAAGN,aAAa,CAACK,GAAD,CAAnC;AACAJ,UAAAA,oBAAoB,CAACT,OAArB,CAA6B,CAAC,CAACe,KAAD,EAAQC,MAAR,CAAD,KAA0B;AACrD;AAEA,gBAAIrC,OAAO,GAAG,EAAd;;AACA,gBAAIoC,KAAK,CAAC,CAAD,CAAL,CAASE,QAAT,CAAkBH,aAAlB,CAAJ,EAAsC;AACpCnC,cAAAA,OAAO,GAAGoC,KAAK,CAAC,CAAD,CAAL,CAASG,OAAT,CAAiB,MAAMJ,aAAvB,EAAsCX,aAAtC,CAAV;AACD;;AACDC,YAAAA,UAAU,IAAIzB,OAAd;AACD,WARD;AASD,SAXD;;AAYA,YAAIyB,UAAJ,EAAgB;AACd,gBAAMe,cAAc,GAAG1C,iBAAiB,CAACJ,SAAD,EAAY+B,UAAZ,CAAxC;AAEA,gBAAMgB,QAAQ,eAAQnB,SAAR,iBAAwBkB,cAAxB,CAAd;;AAEA,cAAI,CAAC5D,cAAc,CAAC6D,QAAD,CAAnB,EAA+B;AAC7BvC,YAAAA,MAAM,CAACuC,QAAD,CAAN;AACA7D,YAAAA,cAAc,CAAC6D,QAAD,CAAd,GAA2B,IAA3B;AACD;AACF;AACF;AACF,KAtCD;AAuCD;;AAED,SAAO;AAAElD,IAAAA,MAAF;AAAUC,IAAAA;AAAV,GAAP;AACD,CA/DD;AAiEA;AACA;AACA;;;AACA,OAAO,MAAMkD,eAAe,GAAG,MAAM;AACnC,sBACE;AACE,IAAA,IAAI,EAAC,UADP;AAEE,IAAA,uBAAuB,EAAE;AAAEC,MAAAA,MAAM,EAAEX,MAAM,CAACC,IAAP,CAAYrD,cAAZ,EAA4BgE,IAA5B,CAAiC,EAAjC;AAAV;AAF3B,IADF;AAMD,CAPM","sourcesContent":["// import { atomic } from 'react-native-web/dist/exports/StyleSheet/compiler';\r\nimport { atomic } from '../react-native-web-fucntions/atomic';\r\nimport preprocess from '../react-native-web-fucntions/preprocess';\r\nimport type {\r\n  DataSet,\r\n  Query,\r\n  UseResponsiveQueryParams,\r\n  UseResponsiveQueryReturnType,\r\n  GetResponsiveStylesParams,\r\n} from './types';\r\nimport { StyleSheet } from 'react-native';\r\n// @ts-ignore\r\nimport stableHash from 'stable-hash';\r\nimport hash from './hash';\r\nimport type { GetResponsiveStylesReturnType } from './types';\r\nimport { useStableMemo } from './useStableMemo';\r\nimport { getResponsiveStylesImpl, useDimensionsWithEnable } from './common';\r\nimport { ResponsiveQueryContext } from './ResponsiveQueryProvider';\r\nimport React from 'react';\r\n\r\n/******************** Implementation after RNW v0.18 ***********************/\r\n\r\n/**\r\n * 1. preprocess:- Handles shadow/text shadow conversion from RN styles to web *                 styles\r\n *\r\n * 2. atomic:- it handles prefixing, converting RN specific styles to web styles *             and generating the CSS selector.\r\n *             Input {marginTop: 10}\r\n *             Output\r\n *             compiledStyle : marginTop: \"r-marginTop-156q2ks\"\r\n *             compiledOrderedRules : \".r-marginTop-156q2ks{margin-top:10px;}\"\r\n *      a)compiledStyle:- Array it holds identifier/selector with properties\r\n *      b)compiledOrderedRules:- Array it holds the css rule with selector name\r\n *      Also from RNW v0.18 handles swapping of ltr styles if enabled by user\r\n * 3. createSheet:- used to grab sheet which exist already created by rnw. when we *                  call createSheet without id it will return sheet which exist. *                  cause it automatically takes a default ID  which is already in *                  use (created by rnw with default ID) so this return sheet *                  which exist with  ID doesn't create a new sheet.\r\n *\r\n * This Implementation is based on asumptions that RNW doesn't change the         * function  or doesn't re-write them. if there is any change in RNW implmentation * it we'll break and needs to be updated.\r\n *\r\n */\r\nlet textContentMap: any = {};\r\n\r\nexport const useResponsiveQuery = (\r\n  queries?: UseResponsiveQueryParams\r\n): UseResponsiveQueryReturnType => {\r\n  const responsiveQueryContext = React.useContext(ResponsiveQueryContext);\r\n  const disableCSSMediaQueries =\r\n    queries?.disableCSSMediaQueries ??\r\n    responsiveQueryContext.disableCSSMediaQueries;\r\n\r\n  // Only attaches listener if disableCSSMediaQueries is true\r\n  const windowWidth = useDimensionsWithEnable({\r\n    enable: disableCSSMediaQueries,\r\n  }).width;\r\n\r\n  const values = useStableMemo(() => {\r\n    // Use the non-media query responsive styling\r\n    if (disableCSSMediaQueries) {\r\n      const getResponsiveStyles = getResponsiveStylesImpl(windowWidth);\r\n      if (queries) {\r\n        const { styles } = getResponsiveStyles(queries);\r\n        return { styles, getResponsiveStyles };\r\n      } else {\r\n        return { getResponsiveStyles };\r\n      }\r\n    } else {\r\n      if (queries) {\r\n        const { styles, dataSet } = getResponsiveStyles(queries);\r\n        return { dataSet, styles, getResponsiveStyles };\r\n      } else {\r\n        return { getResponsiveStyles };\r\n      }\r\n    }\r\n  }, [queries, windowWidth, disableCSSMediaQueries]);\r\n\r\n  return values;\r\n};\r\n\r\nconst getDataAttribute = (queryRule: Query) => {\r\n  if (\r\n    typeof queryRule.minWidth === 'number' &&\r\n    typeof queryRule.maxWidth === 'number'\r\n  ) {\r\n    return `min-width-${queryRule.minWidth}-max-width-${queryRule.maxWidth}`;\r\n  } else if (typeof queryRule.minWidth === 'number') {\r\n    return `min-width-${queryRule.minWidth}`;\r\n  } else if (typeof queryRule.maxWidth === 'number') {\r\n    return `max-width-${queryRule.maxWidth}`;\r\n  }\r\n\r\n  return undefined;\r\n};\r\n\r\nconst getMediaQueryRule = (query: Query, newRule: string) => {\r\n  if (\r\n    typeof query.minWidth === 'number' &&\r\n    typeof query.maxWidth === 'number'\r\n  ) {\r\n    return `@media only screen and (min-width: ${query.minWidth}px) and (max-width: ${query.maxWidth}px) { ${newRule} }`;\r\n  } else if (typeof query.minWidth === 'number') {\r\n    return `@media only screen and (min-width: ${query.minWidth}px) { ${newRule} }`;\r\n  } else if (typeof query.maxWidth === 'number') {\r\n    return `@media only screen and (max-width: ${query.maxWidth}px) { ${newRule} }`;\r\n  }\r\n  return undefined;\r\n};\r\nlet styleSheet: any;\r\nconst insert = (rule: string) => {\r\n  if (rule === '') {\r\n    return;\r\n  }\r\n  if (typeof window !== 'undefined') {\r\n    if (!styleSheet) {\r\n      const styleEl = document.createElement('style');\r\n      styleEl.type = 'text/css';\r\n      styleEl.appendChild(document.createTextNode(''));\r\n      document.head.appendChild(styleEl);\r\n      styleSheet = styleEl.sheet;\r\n    }\r\n\r\n    styleSheet.insertRule(rule, styleSheet.cssRules.length);\r\n  }\r\n};\r\nconst getResponsiveStyles = (\r\n  queries: GetResponsiveStylesParams\r\n): GetResponsiveStylesReturnType => {\r\n  const queryString = stableHash(queries.query);\r\n\r\n  const queriesHash = hash(queryString);\r\n\r\n  const styles = queries.initial\r\n    ? [\r\n        StyleSheet.create({ initial: StyleSheet.flatten(queries.initial) })\r\n          .initial,\r\n      ]\r\n    : undefined;\r\n\r\n  let dataSet: DataSet = {};\r\n\r\n  /**\r\n   * This function is copied from intergalacticspacehighway/rnw-responsive-ssr\r\n   */\r\n\r\n  if (queries.query) {\r\n    queries.query.forEach((queryRule) => {\r\n      const queryHash = queriesHash + hash(stableHash(queryRule));\r\n      const dataAttribute = getDataAttribute(queryRule);\r\n\r\n      if (dataAttribute) {\r\n        const newIdentifier = `[data-${dataAttribute}$=\"${queryHash}\"]`;\r\n        dataSet[dataAttribute] = queryHash;\r\n\r\n        let mediaRules = '';\r\n\r\n        const flattenQueryStyle = StyleSheet.flatten(queryRule.style);\r\n        const newStyle = preprocess(flattenQueryStyle);\r\n        const [compiledStyle, compiledOrderedRules] = atomic(newStyle);\r\n        //@ts-ignore\r\n        delete compiledStyle.$$css; //removing unnecessary $$css property\r\n        Object.keys(compiledStyle).forEach((key) => {\r\n          const oldIdentifier = compiledStyle[key];\r\n          compiledOrderedRules.forEach(([rules, _order]: any) => {\r\n            // Rule returned by atomic has css selectors, so we'll replace it with data-attr selector\r\n\r\n            let newRule = '';\r\n            if (rules[0].includes(oldIdentifier)) {\r\n              newRule = rules[0].replace('.' + oldIdentifier, newIdentifier);\r\n            }\r\n            mediaRules += newRule;\r\n          });\r\n        });\r\n        if (mediaRules) {\r\n          const mediaQueryRule = getMediaQueryRule(queryRule, mediaRules);\r\n\r\n          const queryKey = `/*${queryHash}{}*/${mediaQueryRule}`;\r\n\r\n          if (!textContentMap[queryKey]) {\r\n            insert(queryKey);\r\n            textContentMap[queryKey] = true;\r\n          }\r\n        }\r\n      }\r\n    });\r\n  }\r\n\r\n  return { styles, dataSet };\r\n};\r\n\r\n/**\r\n * This function is copied from intergalacticspacehighway/rnw-responsive-ssr\r\n */\r\nexport const getStyleElement = () => {\r\n  return (\r\n    <style\r\n      type=\"text/css\"\r\n      dangerouslySetInnerHTML={{ __html: Object.keys(textContentMap).join('') }}\r\n    />\r\n  );\r\n};\r\n"]}

package/lib/module/utils/useResponsiveQuery/useStableMemo.js

@@ -0,0 +1,8 @@
+import { useMemo } from 'react'; //@ts-ignore
+
+import hash from 'stable-hash';
+export function useStableMemo(factory, deps) {
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  return useMemo(factory, [hash(deps)]);
+}
+//# sourceMappingURL=useStableMemo.js.map