@razorpay/blade 8.3.0 → 8.4.1

package/build/components/index.d.ts

@@ -2234,7 +2234,40 @@ declare type BoxVisualProps = MakeObjectResponsive<{
 }> & {
     as: BoxAsType;
 };
-declare type BoxProps = Partial<PaddingProps & MarginProps & LayoutProps & FlexboxProps & PositionProps & GridProps & BoxVisualProps & {
+declare type BoxCallbackProps = Omit<Platform.Select<{
+    web: {
+        /**
+         * **Warning**
+         *
+         * Make sure to not use Box when you want to create a trigger that performs action on hover.
+         * You would probably want to render it as `button` using `styled.button` instead.
+         *
+         * Use this for hoverable containers in cases like custom menus.
+         */
+        onMouseOver: React.MouseEventHandler<HTMLElement>;
+        /**
+         * **Warning**
+         *
+         * Make sure to not use Box when you want to create a trigger that performs action on hover.
+         * You would probably want to render it as `button` using `styled.button` instead.
+         *
+         * Use this for hoverable containers in cases like custom menus.
+         */
+        onMouseEnter: React.MouseEventHandler<HTMLElement>;
+        /**
+         * **Warning**
+         *
+         * Make sure to not use Box when you want to create a trigger that performs action on hover.
+         * You would probably want to render it as `button` using `styled.button` instead.
+         *
+         * Use this for hoverable containers in cases like custom menus.
+         */
+        onMouseLeave: React.MouseEventHandler<HTMLElement>;
+        onScroll: React.UIEventHandler<HTMLElement>;
+    };
+    native: Record<'onMouseOver' | 'onMouseEnter' | 'onMouseLeave' | 'onScroll', undefined>;
+}>, '__brand__'>;
+declare type BoxProps = Partial<PaddingProps & MarginProps & LayoutProps & FlexboxProps & PositionProps & GridProps & BoxCallbackProps & BoxVisualProps & {
     children?: React.ReactNode | React.ReactNode[];
 } & TestID>;
 declare type BoxRefType = Platform.Select<{
@@ -2281,7 +2314,12 @@ declare const Box: React__default.ForwardRefExoticComponent<Partial<MakeObjectRe
     left: SpacingValueType;
 } & PickIfExist$1<styled_components.CSSObject, "position" | "zIndex"> & {
     __brand__?: "platform-web" | undefined;
-}> & MakeObjectResponsive<PickCSSByPlatform$1<"grid" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "gridArea" | "gridColumn" | "gridRow" | "gridTemplate">> & MakeObjectResponsive<{
+}> & MakeObjectResponsive<PickCSSByPlatform$1<"grid" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "gridArea" | "gridColumn" | "gridRow" | "gridTemplate">> & {
+    onMouseOver: React__default.MouseEventHandler<HTMLElement>;
+    onMouseEnter: React__default.MouseEventHandler<HTMLElement>;
+    onMouseLeave: React__default.MouseEventHandler<HTMLElement>;
+    onScroll: React__default.UIEventHandler<HTMLElement>;
+} & MakeObjectResponsive<{
     backgroundColor: "surface.background.level1.lowContrast" | "surface.background.level1.highContrast" | "surface.background.level2.lowContrast" | "surface.background.level2.highContrast" | "surface.background.level3.lowContrast" | "surface.background.level3.highContrast";
     borderWidth: "none" | "thin" | "thick";
     borderColor: "surface.border.normal.lowContrast" | "surface.border.normal.highContrast" | "surface.border.subtle.lowContrast" | "surface.border.subtle.highContrast";

package/build/components/index.native.d.ts

@@ -2236,7 +2236,40 @@ declare type BoxVisualProps = MakeObjectResponsive<{
 }> & {
     as: BoxAsType;
 };
-declare type BoxProps = Partial<PaddingProps & MarginProps & LayoutProps & FlexboxProps & PositionProps & GridProps & BoxVisualProps & {
+declare type BoxCallbackProps = Omit<Platform.Select<{
+    web: {
+        /**
+         * **Warning**
+         *
+         * Make sure to not use Box when you want to create a trigger that performs action on hover.
+         * You would probably want to render it as `button` using `styled.button` instead.
+         *
+         * Use this for hoverable containers in cases like custom menus.
+         */
+        onMouseOver: React.MouseEventHandler<HTMLElement>;
+        /**
+         * **Warning**
+         *
+         * Make sure to not use Box when you want to create a trigger that performs action on hover.
+         * You would probably want to render it as `button` using `styled.button` instead.
+         *
+         * Use this for hoverable containers in cases like custom menus.
+         */
+        onMouseEnter: React.MouseEventHandler<HTMLElement>;
+        /**
+         * **Warning**
+         *
+         * Make sure to not use Box when you want to create a trigger that performs action on hover.
+         * You would probably want to render it as `button` using `styled.button` instead.
+         *
+         * Use this for hoverable containers in cases like custom menus.
+         */
+        onMouseLeave: React.MouseEventHandler<HTMLElement>;
+        onScroll: React.UIEventHandler<HTMLElement>;
+    };
+    native: Record<'onMouseOver' | 'onMouseEnter' | 'onMouseLeave' | 'onScroll', undefined>;
+}>, '__brand__'>;
+declare type BoxProps = Partial<PaddingProps & MarginProps & LayoutProps & FlexboxProps & PositionProps & GridProps & BoxCallbackProps & BoxVisualProps & {
     children?: React.ReactNode | React.ReactNode[];
 } & TestID>;
 declare type BoxRefType = Platform.Select<{
@@ -2283,7 +2316,12 @@ declare const Box: React__default.ForwardRefExoticComponent<Partial<MakeObjectRe
     left: SpacingValueType;
 } & PickIfExist$1<react_native.ViewStyle, "position" | "zIndex"> & {
     __brand__?: "platform-native" | undefined;
-}> & MakeObjectResponsive<PickCSSByPlatform$1<"grid" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "gridArea" | "gridColumn" | "gridRow" | "gridTemplate">> & MakeObjectResponsive<{
+}> & MakeObjectResponsive<PickCSSByPlatform$1<"grid" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridColumnEnd" | "gridColumnStart" | "gridRowEnd" | "gridRowStart" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "gridArea" | "gridColumn" | "gridRow" | "gridTemplate">> & {
+    onMouseOver: undefined;
+    onMouseEnter: undefined;
+    onMouseLeave: undefined;
+    onScroll: undefined;
+} & MakeObjectResponsive<{
     backgroundColor: "surface.background.level1.lowContrast" | "surface.background.level1.highContrast" | "surface.background.level2.lowContrast" | "surface.background.level2.highContrast" | "surface.background.level3.lowContrast" | "surface.background.level3.highContrast";
     borderWidth: "none" | "thin" | "thick";
     borderColor: "surface.border.normal.lowContrast" | "surface.border.normal.highContrast" | "surface.border.subtle.lowContrast" | "surface.border.subtle.highContrast";

package/build/components/index.native.js

@@ -3285,7 +3285,7 @@ var _excluded$4M=["variant","size","type","weight","contrast","children","testID
 
 var _excluded$4L=["variant","weight","size","type","contrast","truncateAfterLines","children","color","testID","textAlign"];var getTextProps=function getTextProps(_ref){var variant=_ref.variant,type=_ref.type,weight=_ref.weight,size=_ref.size,contrast=_ref.contrast,testID=_ref.testID,textAlign=_ref.textAlign;var isPlatformWeb=getPlatformType()==='browser'||getPlatformType()==='node';var colorContrast=contrast?contrast+"Contrast":'lowContrast';var props={color:"surface.text."+(type!=null?type:'normal')+"."+colorContrast,fontSize:100,fontWeight:weight!=null?weight:'regular',fontStyle:'normal',lineHeight:100,fontFamily:'text',forwardedAs:isPlatformWeb?'p':undefined,componentName:'text',testID:testID,textAlign:textAlign};if(variant==='body'){if(size==='xsmall'){props.fontSize=25;props.lineHeight=50;}if(size==='small'){props.fontSize=75;props.lineHeight=50;}if(size==='medium'){props.fontSize=100;props.lineHeight=100;}if(size==='large'){props.fontSize=200;props.lineHeight=300;}}if(variant==='caption'){if(size==='medium'){props.fontSize=50;props.lineHeight=50;}else {throw new Error("[Blade: Text]: size cannot be '"+size+"' when variant is 'caption'");}props.fontStyle='italic';}return props;};var StyledText=styled(BaseText)(function(_ref2){var truncateAfterLines=_ref2.truncateAfterLines;if(truncateAfterLines){if(getPlatformType()==='react-native'){return null;}return {overflow:'hidden',display:'-webkit-box','line-clamp':""+truncateAfterLines,'-webkit-line-clamp':""+truncateAfterLines,'-webkit-box-orient':'vertical'};}return {};});var _Text=function _Text(_ref3){var _ref3$variant=_ref3.variant,variant=_ref3$variant===void 0?'body':_ref3$variant,_ref3$weight=_ref3.weight,weight=_ref3$weight===void 0?'regular':_ref3$weight,_ref3$size=_ref3.size,size=_ref3$size===void 0?'medium':_ref3$size,_ref3$type=_ref3.type,type=_ref3$type===void 0?'normal':_ref3$type,_ref3$contrast=_ref3.contrast,contrast=_ref3$contrast===void 0?'low':_ref3$contrast,truncateAfterLines=_ref3.truncateAfterLines,children=_ref3.children,color=_ref3.color,testID=_ref3.testID,textAlign=_ref3.textAlign,styledProps=_objectWithoutProperties(_ref3,_excluded$4L);var props=_extends({truncateAfterLines:truncateAfterLines},getTextProps({variant:variant,type:type,weight:weight,size:size,contrast:contrast,testID:testID,textAlign:textAlign}),color?{color:color}:{});return jsx(StyledText,_extends({},props,getStyledProps(styledProps),{children:children}));};var Text=assignWithoutSideEffects(_Text,{displayName:'Text',componentId:'Text'});
 
-var _excluded$4K=["children","size","weight","testID"];var platformType=getPlatformType();var isPlatformWeb=platformType==='browser'||platformType==='node';var getCodeFontSizeAndLineHeight=function getCodeFontSizeAndLineHeight(size){switch(size){case'medium':return {fontSize:75,lineHeight:75};case'small':return {fontSize:25,lineHeight:25};default:throw new Error("[Blade Code]: Unexpected size: "+size);}};var CodeContainer=styled(BaseBox)(function(props){var padding=makeSpace(props.theme.spacing[0])+" "+makeSpace(props.theme.spacing[2]);return {padding:padding,backgroundColor:props.theme.colors.brand.gray.a50.lowContrast,borderRadius:props.theme.border.radius.medium,display:isPlatformWeb?'inline-block':undefined,verticalAlign:'middle',lineHeight:makeTypographySize(props.theme.typography.lineHeights[0])};});var Code=function Code(_ref){var children=_ref.children,_ref$size=_ref.size,size=_ref$size===void 0?'small':_ref$size,_ref$weight=_ref.weight,weight=_ref$weight===void 0?'regular':_ref$weight,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded$4K);var _getCodeFontSizeAndLi=getCodeFontSizeAndLineHeight(size),fontSize=_getCodeFontSizeAndLi.fontSize,lineHeight=_getCodeFontSizeAndLi.lineHeight;return jsx(CodeContainer,_extends({size:size,as:isPlatformWeb?'span':undefined},metaAttribute({name:MetaConstants.Code,testID:testID}),getStyledProps(styledProps),{children:jsx(BaseText,{color:"surface.text.subtle.lowContrast",fontFamily:"code",fontSize:fontSize,fontWeight:weight,as:isPlatformWeb?'code':undefined,lineHeight:lineHeight,children:children})}));};
+var _excluded$4K=["children","size","weight","testID"];var platformType=getPlatformType();var isPlatformWeb=platformType==='browser'||platformType==='node';var getCodeFontSizeAndLineHeight=function getCodeFontSizeAndLineHeight(size){switch(size){case'medium':return {fontSize:75,lineHeight:75};case'small':return {fontSize:25,lineHeight:25};default:throw new Error("[Blade Code]: Unexpected size: "+size);}};var CodeContainer=styled(BaseBox)(function(props){var padding=makeSpace(props.theme.spacing[0])+" "+makeSpace(props.theme.spacing[2]);return {padding:padding,backgroundColor:props.theme.colors.brand.gray.a50.lowContrast,borderRadius:props.theme.border.radius.medium,display:isPlatformWeb?'inline-block':'flex',alignSelf:isPlatformWeb?undefined:'center',verticalAlign:'middle',lineHeight:makeTypographySize(props.theme.typography.lineHeights[0])};});var Code=function Code(_ref){var children=_ref.children,_ref$size=_ref.size,size=_ref$size===void 0?'small':_ref$size,_ref$weight=_ref.weight,weight=_ref$weight===void 0?'regular':_ref$weight,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded$4K);var _getCodeFontSizeAndLi=getCodeFontSizeAndLineHeight(size),fontSize=_getCodeFontSizeAndLi.fontSize,lineHeight=_getCodeFontSizeAndLi.lineHeight;return jsx(CodeContainer,_extends({size:size,as:isPlatformWeb?'span':undefined},metaAttribute({name:MetaConstants.Code,testID:testID}),getStyledProps(styledProps),{children:jsx(BaseText,{color:"surface.text.subtle.lowContrast",fontFamily:"code",fontSize:fontSize,fontWeight:weight,as:isPlatformWeb?'code':undefined,lineHeight:lineHeight,children:children})}));};
 
 /**
  * Checks if `value` is `undefined`.
@@ -3979,7 +3979,7 @@ var _excluded$m=["children","contrast","fontWeight","icon","size","variant","tes
 
 var validBoxAsValues=['div','section','footer','header','main','aside','nav','span'];
 
-var validateBackgroundString=function validateBackgroundString(stringBackgroundColorValue){if(!stringBackgroundColorValue.startsWith('surface.background')){throw new Error("[Blade - Box]: Oops! Currently you can only use `surface.background.*` tokens with backgroundColor property but we received `"+stringBackgroundColorValue+"` instead.\n\n Do you have a usecase of using other values? Create an issue on https://github.com/razorpay/blade repo to let us know and we can discuss \u2728");}};var validateBackgroundProp=function validateBackgroundProp(responsiveBackgroundColor){if(responsiveBackgroundColor){if(typeof responsiveBackgroundColor==='string'){validateBackgroundString(responsiveBackgroundColor);return;}Object.values(responsiveBackgroundColor).forEach(function(backgroundColor){validateBackgroundString(backgroundColor);});}};var makeBoxProps=function makeBoxProps(props){return {display:props.display,overflow:props.overflow,overflowX:props.overflowX,overflowY:props.overflowY,height:props.height,minHeight:props.minHeight,maxHeight:props.maxHeight,width:props.width,minWidth:props.minWidth,maxWidth:props.maxWidth,flex:props.flex,flexWrap:props.flexWrap,flexDirection:props.flexDirection,flexGrow:props.flexGrow,flexShrink:props.flexShrink,flexBasis:props.flexBasis,alignItems:props.alignItems,alignContent:props.alignContent,alignSelf:props.alignSelf,justifyItems:props.justifyItems,justifyContent:props.justifyContent,justifySelf:props.justifySelf,placeSelf:props.placeSelf,order:props.order,grid:props.grid,gridColumn:props.gridColumn,gridRow:props.gridRow,gridRowStart:props.gridRowStart,gridRowEnd:props.gridRowEnd,gridColumnStart:props.gridColumnStart,gridColumnEnd:props.gridColumnEnd,gridArea:props.gridArea,gridAutoFlow:props.gridAutoFlow,gridAutoRows:props.gridAutoRows,gridAutoColumns:props.gridAutoColumns,gridTemplate:props.gridTemplate,gridTemplateAreas:props.gridTemplateAreas,gridTemplateColumns:props.gridTemplateColumns,gridTemplateRows:props.gridTemplateRows,padding:props.padding,paddingTop:props.paddingTop,paddingBottom:props.paddingBottom,paddingRight:props.paddingRight,paddingLeft:props.paddingLeft,paddingX:props.paddingX,paddingY:props.paddingY,margin:props.margin,marginBottom:props.marginBottom,marginTop:props.marginTop,marginRight:props.marginRight,marginLeft:props.marginLeft,marginX:props.marginX,marginY:props.marginY,gap:props.gap,rowGap:props.rowGap,columnGap:props.columnGap,position:props.position,zIndex:props.zIndex,top:props.top,right:props.right,bottom:props.bottom,left:props.left,backgroundColor:props.backgroundColor,borderWidth:props.borderWidth,borderColor:props.borderColor,borderTopWidth:props.borderTopWidth,borderTopColor:props.borderTopColor,borderRightWidth:props.borderRightWidth,borderRightColor:props.borderRightColor,borderBottomWidth:props.borderBottomWidth,borderBottomColor:props.borderBottomColor,borderLeftWidth:props.borderLeftWidth,borderLeftColor:props.borderLeftColor,borderRadius:props.borderRadius,borderTopLeftRadius:props.borderTopLeftRadius,borderTopRightRadius:props.borderTopRightRadius,borderBottomRightRadius:props.borderBottomRightRadius,borderBottomLeftRadius:props.borderBottomLeftRadius,children:props.children,as:isReactNative$4()?undefined:props.as};};var _Box=function _Box(props,ref){React__default.useEffect(function(){validateBackgroundProp(props.backgroundColor);},[props.backgroundColor]);React__default.useEffect(function(){if(props.as){if(isReactNative$4()){throw new Error('[Blade - Box]: `as` prop is not supported on React Native');}if(!validBoxAsValues.includes(props.as)){throw new Error("[Blade - Box]: Invalid `as` prop value - "+props.as+". Only "+validBoxAsValues.join(', ')+" are valid values");}}},[props.as]);return jsx(BaseBox,_extends({ref:ref},metaAttribute({name:MetaConstants.Box,testID:props.testID}),makeBoxProps(props)));};var Box=assignWithoutSideEffects(React__default.forwardRef(_Box),{displayName:'Box'});
+var validateBackgroundString=function validateBackgroundString(stringBackgroundColorValue){if(!stringBackgroundColorValue.startsWith('surface.background')){throw new Error("[Blade - Box]: Oops! Currently you can only use `surface.background.*` tokens with backgroundColor property but we received `"+stringBackgroundColorValue+"` instead.\n\n Do you have a usecase of using other values? Create an issue on https://github.com/razorpay/blade repo to let us know and we can discuss \u2728");}};var validateBackgroundProp=function validateBackgroundProp(responsiveBackgroundColor){if(responsiveBackgroundColor){if(typeof responsiveBackgroundColor==='string'){validateBackgroundString(responsiveBackgroundColor);return;}Object.values(responsiveBackgroundColor).forEach(function(backgroundColor){validateBackgroundString(backgroundColor);});}};var makeBoxProps=function makeBoxProps(props){return {display:props.display,overflow:props.overflow,overflowX:props.overflowX,overflowY:props.overflowY,height:props.height,minHeight:props.minHeight,maxHeight:props.maxHeight,width:props.width,minWidth:props.minWidth,maxWidth:props.maxWidth,flex:props.flex,flexWrap:props.flexWrap,flexDirection:props.flexDirection,flexGrow:props.flexGrow,flexShrink:props.flexShrink,flexBasis:props.flexBasis,alignItems:props.alignItems,alignContent:props.alignContent,alignSelf:props.alignSelf,justifyItems:props.justifyItems,justifyContent:props.justifyContent,justifySelf:props.justifySelf,placeSelf:props.placeSelf,order:props.order,grid:props.grid,gridColumn:props.gridColumn,gridRow:props.gridRow,gridRowStart:props.gridRowStart,gridRowEnd:props.gridRowEnd,gridColumnStart:props.gridColumnStart,gridColumnEnd:props.gridColumnEnd,gridArea:props.gridArea,gridAutoFlow:props.gridAutoFlow,gridAutoRows:props.gridAutoRows,gridAutoColumns:props.gridAutoColumns,gridTemplate:props.gridTemplate,gridTemplateAreas:props.gridTemplateAreas,gridTemplateColumns:props.gridTemplateColumns,gridTemplateRows:props.gridTemplateRows,padding:props.padding,paddingTop:props.paddingTop,paddingBottom:props.paddingBottom,paddingRight:props.paddingRight,paddingLeft:props.paddingLeft,paddingX:props.paddingX,paddingY:props.paddingY,margin:props.margin,marginBottom:props.marginBottom,marginTop:props.marginTop,marginRight:props.marginRight,marginLeft:props.marginLeft,marginX:props.marginX,marginY:props.marginY,gap:props.gap,rowGap:props.rowGap,columnGap:props.columnGap,position:props.position,zIndex:props.zIndex,top:props.top,right:props.right,bottom:props.bottom,left:props.left,backgroundColor:props.backgroundColor,borderWidth:props.borderWidth,borderColor:props.borderColor,borderTopWidth:props.borderTopWidth,borderTopColor:props.borderTopColor,borderRightWidth:props.borderRightWidth,borderRightColor:props.borderRightColor,borderBottomWidth:props.borderBottomWidth,borderBottomColor:props.borderBottomColor,borderLeftWidth:props.borderLeftWidth,borderLeftColor:props.borderLeftColor,borderRadius:props.borderRadius,borderTopLeftRadius:props.borderTopLeftRadius,borderTopRightRadius:props.borderTopRightRadius,borderBottomRightRadius:props.borderBottomRightRadius,borderBottomLeftRadius:props.borderBottomLeftRadius,onMouseEnter:props.onMouseEnter,onMouseLeave:props.onMouseLeave,onMouseOver:props.onMouseOver,onScroll:props.onScroll,children:props.children,as:isReactNative$4()?undefined:props.as};};var _Box=function _Box(props,ref){React__default.useEffect(function(){validateBackgroundProp(props.backgroundColor);},[props.backgroundColor]);React__default.useEffect(function(){if(props.as){if(isReactNative$4()){throw new Error('[Blade - Box]: `as` prop is not supported on React Native');}if(!validBoxAsValues.includes(props.as)){throw new Error("[Blade - Box]: Invalid `as` prop value - "+props.as+". Only "+validBoxAsValues.join(', ')+" are valid values");}}},[props.as]);return jsx(BaseBox,_extends({ref:ref},metaAttribute({name:MetaConstants.Box,testID:props.testID}),makeBoxProps(props)));};var Box=assignWithoutSideEffects(React__default.forwardRef(_Box),{displayName:'Box'});
 
 var _excluded$l=["children","surfaceLevel","elevation"];var CardSurfaceStyled=styled(BaseBox)(function(_ref){var surfaceLevel=_ref.surfaceLevel,elevation=_ref.elevation,theme=_ref.theme;var backgroundColor=theme.colors.surface.background["level"+surfaceLevel].lowContrast;return {width:'100%',display:'flex',flexDirection:'column',borderWidth:elevation==='none'?""+theme.border.width.thin:undefined,borderStyle:elevation==='none'?'solid':undefined,borderColor:elevation==='none'?""+theme.colors.surface.border.normal.lowContrast:undefined,backgroundColor:backgroundColor};});var CardSurface=function CardSurface(_ref2){var children=_ref2.children,surfaceLevel=_ref2.surfaceLevel,elevation=_ref2.elevation,props=_objectWithoutProperties(_ref2,_excluded$l);var _useTheme=useTheme(),theme=_useTheme.theme;return jsx(CardSurfaceStyled,_extends({},props,{surfaceLevel:surfaceLevel,elevation:elevation,style:castNativeType(theme.elevation[elevation]),children:children}));};
 
@@ -4269,7 +4269,7 @@ var SkipNavLink=function SkipNavLink(_props){throw new Error('[Blade: SkipNav]:
 
 var affixFontSizes={'body-small':75,'body-small-bold':75,'body-medium':75,'body-medium-bold':75,'heading-small':75,'heading-small-bold':75,'heading-large':100,'heading-large-bold':100,'title-small':300,'title-medium':400};var amountFontSizes={'body-small':75,'body-small-bold':75,'body-medium':100,'body-medium-bold':100,'heading-small':200,'heading-small-bold':200,'heading-large':400,'heading-large-bold':400,'title-small':600,'title-medium':700};var amountLineHeights={'body-small':50,'body-small-bold':50,'body-medium':100,'body-medium-bold':100,'heading-small':300,'heading-small-bold':300,'heading-large':400,'heading-large-bold':400,'title-small':500,'title-medium':600};var currencyPrefixMapping={INR:{'currency-symbol':'₹','currency-code':'INR'},MYR:{'currency-symbol':'RM','currency-code':'MYR'}};var currencyLocaleMapping={INR:'en-IN',MYR:'en-MY'};var currencyAbbreviationsMapping={INR:[{value:1e7,symbol:'Cr'},{value:1e5,symbol:'L'},{value:1e3,symbol:'k'}],MYR:[{value:1e9,symbol:'B'},{value:1e6,symbol:'M'},{value:1e3,symbol:'K'}]};
 
-var _excluded=["value","suffix","size","isAffixSubtle","intent","prefix","testID","currency"];var getTextColorProps=function getTextColorProps(_ref){var intent=_ref.intent;var props={amountValueColor:'surface.text.normal.lowContrast',affixColor:'surface.text.muted.lowContrast'};if(!intent)return props;props.amountValueColor="feedback.text."+intent+".lowContrast";props.affixColor="feedback.text."+intent+".lowContrast";return props;};var AmountValue=function AmountValue(_ref2){var value=_ref2.value,size=_ref2.size,amountValueColor=_ref2.amountValueColor,isAffixSubtle=_ref2.isAffixSubtle,suffix=_ref2.suffix,affixColor=_ref2.affixColor;var affixFontWeight=isAffixSubtle?'regular':'bold';var isReactNative=getPlatformType()==='react-native';var affixFontSize=isAffixSubtle?affixFontSizes[size]:amountFontSizes[size];var valueForWeight=size.includes('bold')||size.startsWith('title')?'bold':'regular';if(suffix==='decimals'&&isAffixSubtle){var integer=value.split('.')[0];var decimal=value.split('.')[1];var AmountWrapper=getPlatformType()==='react-native'?BaseText:React__default.Fragment;return jsxs(AmountWrapper,{children:[jsxs(BaseText,{fontSize:amountFontSizes[size],fontWeight:valueForWeight,lineHeight:amountLineHeights[size],color:amountValueColor,as:isReactNative?undefined:'span',children:[integer,"."]}),jsx(BaseText,{marginLeft:"spacing.1",fontWeight:affixFontWeight,fontSize:affixFontSize,color:affixColor,as:isReactNative?undefined:'span',children:decimal||'00'})]});}return jsx(BaseText,{fontSize:amountFontSizes[size],fontWeight:valueForWeight,color:amountValueColor,children:value});};var getFlooredFixed=function getFlooredFixed(value,decimalPlaces){var factor=Math.pow(10,decimalPlaces);var roundedValue=Math.floor(value*factor)/factor;return Number(roundedValue.toFixed(decimalPlaces));};var addCommas=function addCommas(amountValue,currency){var locale=currencyLocaleMapping[currency];return amountValue.toLocaleString(locale);};var getHumanizedAmount=function getHumanizedAmount(amountValue,currency){var abbreviations=currencyAbbreviationsMapping[currency];var abbreviation=abbreviations.find(function(abbr){return amountValue>=abbr.value;});if(abbreviation){amountValue=amountValue/abbreviation.value;var formattedAmountValue=getFlooredFixed(amountValue,2);return addCommas(formattedAmountValue,currency)+abbreviation.symbol;}else {return amountValue.toString();}};var formatAmountWithSuffix=function formatAmountWithSuffix(_ref3){var suffix=_ref3.suffix,value=_ref3.value,currency=_ref3.currency;switch(suffix){case'decimals':{var decimalNumber=getFlooredFixed(value,2);return addCommas(decimalNumber,currency);}case'humanize':{return getHumanizedAmount(value,currency);}case'none':{return addCommas(getFlooredFixed(value,0),currency);}default:return addCommas(getFlooredFixed(value,0),currency);}};var getCurrencyWeight=function getCurrencyWeight(isAffixSubtle,size){if(isAffixSubtle||size.startsWith('bold'))return 'bold';return 'regular';};var Amount=function Amount(_ref4){var value=_ref4.value,_ref4$suffix=_ref4.suffix,suffix=_ref4$suffix===void 0?'decimals':_ref4$suffix,_ref4$size=_ref4.size,size=_ref4$size===void 0?'body-medium':_ref4$size,_ref4$isAffixSubtle=_ref4.isAffixSubtle,isAffixSubtle=_ref4$isAffixSubtle===void 0?true:_ref4$isAffixSubtle,intent=_ref4.intent,_ref4$prefix=_ref4.prefix,prefix=_ref4$prefix===void 0?'currency-symbol':_ref4$prefix,testID=_ref4.testID,_ref4$currency=_ref4.currency,currency=_ref4$currency===void 0?'INR':_ref4$currency,styledProps=_objectWithoutProperties(_ref4,_excluded);if(typeof value!=='number'){throw new Error('[Blade: Amount]: `value` prop must be of type `number` for Amount.');}if(intent==='neutral'){throw new Error('[Blade Amount]: `neutral` intent is not supported.');}var currencyPrefix=currencyPrefixMapping[currency][prefix];var renderedValue=formatAmountWithSuffix({suffix:suffix,value:value,currency:currency});var _getTextColorProps=getTextColorProps({intent:intent}),amountValueColor=_getTextColorProps.amountValueColor,affixColor=_getTextColorProps.affixColor;var currencyColor=isAffixSubtle?affixColor:amountValueColor;var currencyFontSize=isAffixSubtle?affixFontSizes[size]:amountFontSizes[size];var currencyWeight=getCurrencyWeight(isAffixSubtle,size);var isReactNative=getPlatformType()==='react-native';return jsxs(BaseBox,_extends({paddingLeft:"spacing.2",paddingRight:"spacing.2",display:"flex",alignItems:"baseline",flexDirection:"row"},metaAttribute({name:MetaConstants.Amount,testID:testID}),getStyledProps(styledProps),{children:[jsx(BaseText,{marginRight:"spacing.1",fontWeight:currencyWeight,fontSize:currencyFontSize,color:currencyColor,as:isReactNative?undefined:'span',children:currencyPrefix}),jsx(AmountValue,{value:renderedValue,amountValueColor:amountValueColor,size:size,isAffixSubtle:isAffixSubtle,suffix:suffix,affixColor:affixColor})]}));};
+var _excluded=["value","suffix","size","isAffixSubtle","intent","prefix","testID","currency"];var getTextColorProps=function getTextColorProps(_ref){var intent=_ref.intent;var props={amountValueColor:'surface.text.normal.lowContrast',affixColor:'surface.text.muted.lowContrast'};if(!intent)return props;props.amountValueColor="feedback.text."+intent+".lowContrast";props.affixColor="feedback.text."+intent+".lowContrast";return props;};var AmountValue=function AmountValue(_ref2){var value=_ref2.value,size=_ref2.size,amountValueColor=_ref2.amountValueColor,isAffixSubtle=_ref2.isAffixSubtle,suffix=_ref2.suffix,affixColor=_ref2.affixColor;var affixFontWeight=isAffixSubtle?'regular':'bold';var isReactNative=getPlatformType()==='react-native';var affixFontSize=isAffixSubtle?affixFontSizes[size]:amountFontSizes[size];var valueForWeight=size.includes('bold')||size.startsWith('title')?'bold':'regular';if(suffix==='decimals'&&isAffixSubtle){var integer=value.split('.')[0];var decimal=value.split('.')[1];var AmountWrapper=getPlatformType()==='react-native'?BaseText:React__default.Fragment;return jsxs(AmountWrapper,{children:[jsxs(BaseText,{fontSize:amountFontSizes[size],fontWeight:valueForWeight,lineHeight:amountLineHeights[size],color:amountValueColor,as:isReactNative?undefined:'span',children:[integer,"."]}),jsx(BaseText,{marginLeft:"spacing.1",fontWeight:affixFontWeight,fontSize:affixFontSize,color:affixColor,as:isReactNative?undefined:'span',children:decimal||'00'})]});}return jsx(BaseText,{fontSize:amountFontSizes[size],fontWeight:valueForWeight,color:amountValueColor,lineHeight:amountLineHeights[size],children:value});};var getFlooredFixed=function getFlooredFixed(value,decimalPlaces){var factor=Math.pow(10,decimalPlaces);var roundedValue=Math.floor(value*factor)/factor;return Number(roundedValue.toFixed(decimalPlaces));};var addCommas=function addCommas(amountValue,currency){var locale=currencyLocaleMapping[currency];return amountValue.toLocaleString(locale);};var getHumanizedAmount=function getHumanizedAmount(amountValue,currency){var abbreviations=currencyAbbreviationsMapping[currency];var abbreviation=abbreviations.find(function(abbr){return amountValue>=abbr.value;});if(abbreviation){amountValue=amountValue/abbreviation.value;var formattedAmountValue=getFlooredFixed(amountValue,2);return addCommas(formattedAmountValue,currency)+abbreviation.symbol;}else {return amountValue.toString();}};var formatAmountWithSuffix=function formatAmountWithSuffix(_ref3){var suffix=_ref3.suffix,value=_ref3.value,currency=_ref3.currency;switch(suffix){case'decimals':{var decimalNumber=getFlooredFixed(value,2);return addCommas(decimalNumber,currency);}case'humanize':{return getHumanizedAmount(value,currency);}case'none':{return addCommas(getFlooredFixed(value,0),currency);}default:return addCommas(getFlooredFixed(value,0),currency);}};var getCurrencyWeight=function getCurrencyWeight(isAffixSubtle,size){if(isAffixSubtle||size.startsWith('bold'))return 'bold';return 'regular';};var Amount=function Amount(_ref4){var value=_ref4.value,_ref4$suffix=_ref4.suffix,suffix=_ref4$suffix===void 0?'decimals':_ref4$suffix,_ref4$size=_ref4.size,size=_ref4$size===void 0?'body-medium':_ref4$size,_ref4$isAffixSubtle=_ref4.isAffixSubtle,isAffixSubtle=_ref4$isAffixSubtle===void 0?true:_ref4$isAffixSubtle,intent=_ref4.intent,_ref4$prefix=_ref4.prefix,prefix=_ref4$prefix===void 0?'currency-symbol':_ref4$prefix,testID=_ref4.testID,_ref4$currency=_ref4.currency,currency=_ref4$currency===void 0?'INR':_ref4$currency,styledProps=_objectWithoutProperties(_ref4,_excluded);if(typeof value!=='number'){throw new Error('[Blade: Amount]: `value` prop must be of type `number` for Amount.');}if(intent==='neutral'){throw new Error('[Blade Amount]: `neutral` intent is not supported.');}var currencyPrefix=currencyPrefixMapping[currency][prefix];var renderedValue=formatAmountWithSuffix({suffix:suffix,value:value,currency:currency});var _getTextColorProps=getTextColorProps({intent:intent}),amountValueColor=_getTextColorProps.amountValueColor,affixColor=_getTextColorProps.affixColor;var currencyColor=isAffixSubtle?affixColor:amountValueColor;var currencyFontSize=isAffixSubtle?affixFontSizes[size]:amountFontSizes[size];var currencyWeight=getCurrencyWeight(isAffixSubtle,size);var isReactNative=getPlatformType()==='react-native';return jsxs(BaseBox,_extends({paddingLeft:"spacing.2",paddingRight:"spacing.2",display:"flex",alignItems:"baseline",flexDirection:"row"},metaAttribute({name:MetaConstants.Amount,testID:testID}),getStyledProps(styledProps),{children:[jsx(BaseText,{marginRight:"spacing.1",fontWeight:currencyWeight,fontSize:currencyFontSize,color:currencyColor,as:isReactNative?undefined:'span',children:currencyPrefix}),jsx(AmountValue,{value:renderedValue,amountValueColor:amountValueColor,size:size,isAffixSubtle:isAffixSubtle,suffix:suffix,affixColor:affixColor})]}));};
 
 var propRestrictionMap={Button:{size:'xsmall',variant:'tertiary'},Badge:{size:'medium'},Link:{size:'medium'},Text:{size:'medium',variant:'body'}};var useBottomSheetHeaderTrailingRestriction=function useBottomSheetHeaderTrailingRestriction(trailing){var _React$useState=React__default.useState(null),_React$useState2=_slicedToArray(_React$useState,2),validatedTrailingComponent=_React$useState2[0],setValidatedTrailingComponent=_React$useState2[1];React__default.useEffect(function(){if(React__default.isValidElement(trailing)){var trailingComponentType=getComponentId(trailing);var restrictedProps=propRestrictionMap[trailingComponentType];var allowedComponents=Object.keys(propRestrictionMap);if(!restrictedProps){throw new Error("[Blade BottomSheetHeader]: Only one of `"+allowedComponents.join(', ')+"` component is accepted as trailing");}var restrictedPropKeys=Object.keys(propRestrictionMap[trailingComponentType]);for(var _i=0,_restrictedPropKeys=restrictedPropKeys;_i<_restrictedPropKeys.length;_i++){var _trailing$props;var prop=_restrictedPropKeys[_i];if(trailing!=null&&(_trailing$props=trailing.props)!=null&&_trailing$props.hasOwnProperty(prop)){console.warn("[Blade BottomSheetHeader]: Do not pass \""+prop+"\" to \""+trailingComponentType+"\" while inside BottomSheetHeader trailing, because we override it.");}}setValidatedTrailingComponent(React__default.cloneElement(trailing,restrictedProps));}},[trailing]);return validatedTrailingComponent;};