@razorpay/blade 6.3.0 → 6.5.0

package/build/utils/index.web.js

@@ -2787,11 +2787,6 @@ function cloneDeep(value) {
 
 var cloneDeep_1 = cloneDeep;
 
-var metaAttribute = function metaAttribute(name, value) {
-  if (!value) return {};
-  return _defineProperty$1({}, "data-".concat(name), value);
-};
-
 var MetaConstants = {
   ActionList: 'action-list',
   ActionListFooter: 'action-list-footer',
@@ -2800,6 +2795,7 @@ var MetaConstants = {
   ActionListSection: 'action-list-section',
   Alert: 'alert',
   Badge: 'badge',
+  Box: 'Box',
   Button: 'button',
   Checkbox: 'checkbox',
   CheckboxGroup: 'checkbox-group',
@@ -2823,7 +2819,18 @@ var MetaConstants = {
   Card: 'card',
   CardBody: 'card-body',
   CardHeader: 'card-header',
-  CardFooter: 'card-footer'
+  CardFooter: 'card-footer',
+  VisuallyHidden: 'visually-hidden'
+};
+
+function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys$3(Object(source), !0).forEach(function (key) { _defineProperty$1(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var metaAttribute = function metaAttribute(_ref) {
+  var name = _ref.name,
+      testID = _ref.testID;
+  return _objectSpread$3(_objectSpread$3({}, name ? _defineProperty$1({}, "data-".concat(MetaConstants.Component), name) : {}), testID ? _defineProperty$1({}, "data-testid", testID) : {});
 };
 
 var getColorScheme = function getColorScheme() {
@@ -3229,6 +3236,12 @@ function get(object, path, defaultValue) {
 
 var get_1 = get;
 
+var getMediaQuery = function getMediaQuery(_ref) {
+  var min = _ref.min,
+      max = _ref.max;
+  return "screen and (min-width: ".concat(min, "px)").concat(max ? " and (max-width: ".concat(max, "px)") : '');
+};
+
 var getPlatformType = function getPlatformType() {
   if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {
     return 'react-native';
@@ -4803,20 +4816,18 @@ var useBreakpoint = function useBreakpoint(_ref) {
   var supportsMatchMedia = typeof document !== 'undefined' && typeof window !== 'undefined' && typeof ((_window = window) === null || _window === void 0 ? void 0 : _window.matchMedia) === 'function';
   var breakpointsTokenAndQueryCollection = useMemo(function () {
     return supportsMatchMedia ? Object.entries(breakpoints).map(function (_ref2, index, breakpointsArray) {
+      var _breakpointsArray;
+
       var _ref3 = _slicedToArray(_ref2, 2),
           token = _ref3[0],
           screenSize = _ref3[1];
 
-      var mediaQuery = '';
-
-      if (token === 'max') {
-        mediaQuery = "screen and (min-width: ".concat(screenSize, "px)");
-      } else if (breakpointsArray[index - 1]) {
-        mediaQuery = "screen and (min-width: ".concat(breakpointsArray[index - 1][1] + 1, "px) and (max-width: ").concat(screenSize, "px)");
-      } else {
-        mediaQuery = "screen and (max-width: ".concat(screenSize, "px)");
-      }
-
+      var min = screenSize;
+      var maxValue = (_breakpointsArray = breakpointsArray[index + 1]) === null || _breakpointsArray === void 0 ? void 0 : _breakpointsArray[1];
+      var mediaQuery = getMediaQuery({
+        min: min,
+        max: maxValue ? maxValue - 1 : undefined
+      });
       return {
         token: token,
         screenSize: screenSize,
@@ -4831,7 +4842,7 @@ var useBreakpoint = function useBreakpoint(_ref) {
     if (platform === 'react-native') {
       matchedDeviceType = deviceType.mobile;
     } else if (platform === 'browser') {
-      if (matchedBreakpoint && ['xs', 's', 'm'].includes(matchedBreakpoint)) {
+      if (matchedBreakpoint && ['base', 'xs', 's'].includes(matchedBreakpoint)) {
         // tablet is also categorised as mobile
         matchedDeviceType = deviceType.mobile;
       } else {
@@ -5105,5 +5116,5 @@ var castNativeType = function castNativeType(value) {
   return value;
 };
 
-export { MetaConstants, Platform, castNativeType, castWebType, cloneDeep_1 as cloneDeep, getColorScheme, getComponentId, get_1 as getIn, getOS, getPlatformType, isAndroid, isEmpty_1 as isEmpty, isEqual_1 as isEqual, isPartialMatchObjectKeys, isReactNative, isValidAllowedChildren, makeAccessible, makeBezier, makeBorderSize, makeMotionTime, makeSize, makeSpace, makeTypographySize, merge_1 as merge, metaAttribute, setupMatchMediaMock, testID, toTitleCase, useBreakpoint, useColorScheme, usePrevious };
+export { MetaConstants, Platform, castNativeType, castWebType, cloneDeep_1 as cloneDeep, getColorScheme, getComponentId, get_1 as getIn, getMediaQuery, getOS, getPlatformType, isAndroid, isEmpty_1 as isEmpty, isEqual_1 as isEqual, isPartialMatchObjectKeys, isReactNative, isValidAllowedChildren, makeAccessible, makeBezier, makeBorderSize, makeMotionTime, makeSize, makeSpace, makeTypographySize, merge_1 as merge, metaAttribute, setupMatchMediaMock, testID, toTitleCase, useBreakpoint, useColorScheme, usePrevious };
 //# sourceMappingURL=index.web.js.map