@razorpay/blade 12.0.2 → 12.1.0

package/build/lib/native/components/Button/IconButton/IconButton.js

@@ -4,7 +4,7 @@ import StyledIconButton from './StyledIconButton.native.js';
 import { makeAnalyticsAttribute } from '../../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
 import { jsx } from 'react/jsx-runtime';
 
-var _excluded=["icon","onClick","size","emphasis","accessibilityLabel","isDisabled","onBlur","onFocus","onMouseLeave","onMouseMove","onPointerDown","onPointerEnter","onTouchEnd","onTouchStart","isHighlighted","_tabIndex"];var _IconButton=function _IconButton(_ref,ref){var icon=_ref.icon,onClick=_ref.onClick,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,_ref$emphasis=_ref.emphasis,emphasis=_ref$emphasis===void 0?'intense':_ref$emphasis,accessibilityLabel=_ref.accessibilityLabel,isDisabled=_ref.isDisabled,onBlur=_ref.onBlur,onFocus=_ref.onFocus,onMouseLeave=_ref.onMouseLeave,onMouseMove=_ref.onMouseMove,onPointerDown=_ref.onPointerDown,onPointerEnter=_ref.onPointerEnter,onTouchEnd=_ref.onTouchEnd,onTouchStart=_ref.onTouchStart,isHighlighted=_ref.isHighlighted,_tabIndex=_ref._tabIndex,rest=_objectWithoutProperties(_ref,_excluded);return jsx(StyledIconButton,Object.assign({ref:ref,onClick:onClick,emphasis:emphasis,size:size,icon:icon,tabIndex:_tabIndex,accessibilityLabel:accessibilityLabel,isDisabled:isDisabled,isHighlighted:isHighlighted,onBlur:onBlur,onFocus:onFocus,onMouseLeave:onMouseLeave,onMouseMove:onMouseMove,onPointerDown:onPointerDown,onPointerEnter:onPointerEnter,onTouchEnd:onTouchEnd,onTouchStart:onTouchStart},makeAnalyticsAttribute(rest)));};var IconButton=React__default.forwardRef(_IconButton);
+var _excluded=["icon","onClick","size","emphasis","accessibilityLabel","isDisabled","onBlur","onFocus","onMouseLeave","onMouseMove","onPointerDown","onPointerEnter","onTouchEnd","onTouchStart","isHighlighted","_tabIndex"];var _IconButton=function _IconButton(_ref,ref){var icon=_ref.icon,onClick=_ref.onClick,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,_ref$emphasis=_ref.emphasis,emphasis=_ref$emphasis===void 0?'intense':_ref$emphasis,accessibilityLabel=_ref.accessibilityLabel,isDisabled=_ref.isDisabled,onBlur=_ref.onBlur,onFocus=_ref.onFocus,onMouseLeave=_ref.onMouseLeave,onMouseMove=_ref.onMouseMove,onPointerDown=_ref.onPointerDown,onPointerEnter=_ref.onPointerEnter,onTouchEnd=_ref.onTouchEnd,onTouchStart=_ref.onTouchStart,isHighlighted=_ref.isHighlighted,_tabIndex=_ref._tabIndex,rest=_objectWithoutProperties(_ref,_excluded);return jsx(StyledIconButton,Object.assign({ref:ref,onClick:onClick,emphasis:emphasis,size:size,icon:icon,tabIndex:_tabIndex,accessibilityLabel:accessibilityLabel,isDisabled:isDisabled,isHighlighted:isHighlighted,onBlur:onBlur,onFocus:onFocus,onMouseLeave:onMouseLeave,onMouseMove:onMouseMove,onPointerDown:onPointerDown,onPointerEnter:onPointerEnter,onTouchEnd:onTouchEnd,onTouchStart:onTouchStart},makeAnalyticsAttribute(rest),rest));};var IconButton=React__default.forwardRef(_IconButton);
 
 export { IconButton };
 //# sourceMappingURL=IconButton.js.map

package/build/lib/native/components/Button/IconButton/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.js","sources":["../../../../../../src/components/Button/IconButton/IconButton.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable react/display-name */\nimport React from 'react';\nimport type { GestureResponderEvent } from 'react-native';\nimport StyledIconButton from './StyledIconButton';\nimport type { IconComponent } from '~components/Icons';\nimport type { BladeElementRef, DataAnalyticsAttribute } from '~utils/types';\nimport type { BladeCommonEvents } from '~components/types';\nimport type { Platform } from '~utils';\nimport type { SubtleOrIntense } from '~tokens/theme/theme';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype IconButtonProps = {\n  /**\n   * Icon component to be rendered, eg. `CloseIcon`\n   */\n  icon: IconComponent;\n\n  /**\n   * Icon size\n   *\n   * @default 'medium'\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * Icon contrast\n   *\n   * @default 'intense'\n   */\n  emphasis?: SubtleOrIntense;\n\n  /**\n   * Sets aria-label to help users know what the action does, eg 'Dismiss alert'\n   */\n  accessibilityLabel: string;\n\n  /**\n   * Disabled state for IconButton\n   */\n  isDisabled?: boolean;\n\n  /**\n   * Sets tabindex property on button element\n   */\n  _tabIndex?: number;\n} & DataAnalyticsAttribute &\n  BladeCommonEvents &\n  Platform.Select<{\n    web: {\n      onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;\n      /**\n       * This changes the hover interaction to highlight icon more\n       *\n       * **Only available on web currently**\n       */\n      isHighlighted?: boolean;\n    };\n    native: {\n      onClick: (event: GestureResponderEvent) => void;\n      isHighlighted?: undefined;\n    };\n  }>;\n\n/**\n * Component for making clickable icons with transparent background.\n * For other cases please use `Button` component with `icon` prop.\n */\nconst _IconButton: React.ForwardRefRenderFunction<BladeElementRef, IconButtonProps> = (\n  {\n    icon,\n    onClick,\n    size = 'medium',\n    emphasis = 'intense',\n    accessibilityLabel,\n    isDisabled,\n    onBlur,\n    onFocus,\n    onMouseLeave,\n    onMouseMove,\n    onPointerDown,\n    onPointerEnter,\n    onTouchEnd,\n    onTouchStart,\n    isHighlighted,\n    _tabIndex,\n    ...rest\n  },\n  ref,\n) => {\n  return (\n    <StyledIconButton\n      ref={ref as any}\n      onClick={onClick}\n      emphasis={emphasis}\n      size={size}\n      icon={icon}\n      tabIndex={_tabIndex}\n      accessibilityLabel={accessibilityLabel}\n      isDisabled={isDisabled}\n      isHighlighted={isHighlighted}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      onMouseLeave={onMouseLeave}\n      onMouseMove={onMouseMove}\n      onPointerDown={onPointerDown}\n      onPointerEnter={onPointerEnter}\n      onTouchEnd={onTouchEnd}\n      onTouchStart={onTouchStart}\n      {...makeAnalyticsAttribute(rest)}\n    />\n  );\n};\n\nconst IconButton = React.forwardRef(_IconButton);\n\nexport type { IconButtonProps };\nexport { IconButton };\n"],"names":["_IconButton","_ref","ref","icon","onClick","_ref$size","size","_ref$emphasis","emphasis","accessibilityLabel","isDisabled","onBlur","onFocus","onMouseLeave","onMouseMove","onPointerDown","onPointerEnter","onTouchEnd","onTouchStart","isHighlighted","_tabIndex","rest","_objectWithoutProperties","_excluded","_jsx","StyledIconButton","Object","assign","tabIndex","makeAnalyticsAttribute","IconButton","React","forwardRef"],"mappings":";;;;;;8NAoEA,IAAMA,WAA6E,CAAG,SAAhFA,WAA6EA,CAAAC,IAAA,CAoBjFC,GAAG,CACA,CAnBD,IAAAC,IAAI,CAAAF,IAAA,CAAJE,IAAI,CACJC,OAAO,CAAAH,IAAA,CAAPG,OAAO,CAAAC,SAAA,CAAAJ,IAAA,CACPK,IAAI,CAAJA,IAAI,CAAAD,SAAA,GAAA,KAAA,CAAA,CAAG,QAAQ,CAAAA,SAAA,CAAAE,aAAA,CAAAN,IAAA,CACfO,QAAQ,CAARA,QAAQ,CAAAD,aAAA,GAAA,KAAA,CAAA,CAAG,SAAS,CAAAA,aAAA,CACpBE,kBAAkB,CAAAR,IAAA,CAAlBQ,kBAAkB,CAClBC,UAAU,CAAAT,IAAA,CAAVS,UAAU,CACVC,MAAM,CAAAV,IAAA,CAANU,MAAM,CACNC,OAAO,CAAAX,IAAA,CAAPW,OAAO,CACPC,YAAY,CAAAZ,IAAA,CAAZY,YAAY,CACZC,WAAW,CAAAb,IAAA,CAAXa,WAAW,CACXC,aAAa,CAAAd,IAAA,CAAbc,aAAa,CACbC,cAAc,CAAAf,IAAA,CAAde,cAAc,CACdC,UAAU,CAAAhB,IAAA,CAAVgB,UAAU,CACVC,YAAY,CAAAjB,IAAA,CAAZiB,YAAY,CACZC,aAAa,CAAAlB,IAAA,CAAbkB,aAAa,CACbC,SAAS,CAAAnB,IAAA,CAATmB,SAAS,CACNC,IAAI,CAAAC,wBAAA,CAAArB,IAAA,CAAAsB,SAAA,CAIT,CAAA,OACEC,GAAA,CAACC,gBAAgB,CAAAC,MAAA,CAAAC,MAAA,CACfzB,CAAAA,GAAG,CAAEA,GAAW,CAChBE,OAAO,CAAEA,OAAQ,CACjBI,QAAQ,CAAEA,QAAS,CACnBF,IAAI,CAAEA,IAAK,CACXH,IAAI,CAAEA,IAAK,CACXyB,QAAQ,CAAER,SAAU,CACpBX,kBAAkB,CAAEA,kBAAmB,CACvCC,UAAU,CAAEA,UAAW,CACvBS,aAAa,CAAEA,aAAc,CAC7BR,MAAM,CAAEA,MAAO,CACfC,OAAO,CAAEA,OAAQ,CACjBC,YAAY,CAAEA,YAAa,CAC3BC,WAAW,CAAEA,WAAY,CACzBC,aAAa,CAAEA,aAAc,CAC7BC,cAAc,CAAEA,cAAe,CAC/BC,UAAU,CAAEA,UAAW,CACvBC,YAAY,CAAEA,YAAa,CACvBW,CAAAA,sBAAsB,CAACR,IAAI,CAAC,CACjC,CAAC,CAEN,CAAC,CAEK,IAAAS,UAAU,CAAGC,cAAK,CAACC,UAAU,CAAChC,WAAW;;;;"}
+{"version":3,"file":"IconButton.js","sources":["../../../../../../src/components/Button/IconButton/IconButton.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable react/display-name */\nimport React from 'react';\nimport type { GestureResponderEvent } from 'react-native';\nimport StyledIconButton from './StyledIconButton';\nimport type { IconComponent } from '~components/Icons';\nimport type { BladeElementRef, DataAnalyticsAttribute } from '~utils/types';\nimport type { BladeCommonEvents } from '~components/types';\nimport type { Platform } from '~utils';\nimport type { SubtleOrIntense } from '~tokens/theme/theme';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\n\ntype IconButtonProps = {\n  /**\n   * Icon component to be rendered, eg. `CloseIcon`\n   */\n  icon: IconComponent;\n\n  /**\n   * Icon size\n   *\n   * @default 'medium'\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * Icon contrast\n   *\n   * @default 'intense'\n   */\n  emphasis?: SubtleOrIntense;\n\n  /**\n   * Sets aria-label to help users know what the action does, eg 'Dismiss alert'\n   */\n  accessibilityLabel: string;\n\n  /**\n   * Disabled state for IconButton\n   */\n  isDisabled?: boolean;\n\n  /**\n   * Sets tabindex property on button element\n   */\n  _tabIndex?: number;\n} & DataAnalyticsAttribute &\n  BladeCommonEvents &\n  StyledPropsBlade &\n  Platform.Select<{\n    web: {\n      onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;\n      /**\n       * This changes the hover interaction to highlight icon more\n       *\n       * **Only available on web currently**\n       */\n      isHighlighted?: boolean;\n    };\n    native: {\n      onClick: (event: GestureResponderEvent) => void;\n      isHighlighted?: undefined;\n    };\n  }>;\n\n/**\n * Component for making clickable icons with transparent background.\n * For other cases please use `Button` component with `icon` prop.\n */\nconst _IconButton: React.ForwardRefRenderFunction<BladeElementRef, IconButtonProps> = (\n  {\n    icon,\n    onClick,\n    size = 'medium',\n    emphasis = 'intense',\n    accessibilityLabel,\n    isDisabled,\n    onBlur,\n    onFocus,\n    onMouseLeave,\n    onMouseMove,\n    onPointerDown,\n    onPointerEnter,\n    onTouchEnd,\n    onTouchStart,\n    isHighlighted,\n    _tabIndex,\n    ...rest\n  },\n  ref,\n) => {\n  return (\n    <StyledIconButton\n      ref={ref as any}\n      onClick={onClick}\n      emphasis={emphasis}\n      size={size}\n      icon={icon}\n      tabIndex={_tabIndex}\n      accessibilityLabel={accessibilityLabel}\n      isDisabled={isDisabled}\n      isHighlighted={isHighlighted}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      onMouseLeave={onMouseLeave}\n      onMouseMove={onMouseMove}\n      onPointerDown={onPointerDown}\n      onPointerEnter={onPointerEnter}\n      onTouchEnd={onTouchEnd}\n      onTouchStart={onTouchStart}\n      {...makeAnalyticsAttribute(rest)}\n      {...rest}\n    />\n  );\n};\n\nconst IconButton = React.forwardRef(_IconButton);\n\nexport type { IconButtonProps };\nexport { IconButton };\n"],"names":["_IconButton","_ref","ref","icon","onClick","_ref$size","size","_ref$emphasis","emphasis","accessibilityLabel","isDisabled","onBlur","onFocus","onMouseLeave","onMouseMove","onPointerDown","onPointerEnter","onTouchEnd","onTouchStart","isHighlighted","_tabIndex","rest","_objectWithoutProperties","_excluded","_jsx","StyledIconButton","Object","assign","tabIndex","makeAnalyticsAttribute","IconButton","React","forwardRef"],"mappings":";;;;;;AAEA,IAAA,SAAA,CAAA,CAAA,MAAA,CAAA,SAAA,CAAA,MAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,YAAA,CAAA,QAAA,CAAA,SAAA,CAAA,cAAA,CAAA,aAAA,CAAA,eAAA,CAAA,gBAAA,CAAA,YAAA,CAAA,cAAA,CAAA,eAAA,CAAA,WAAA,CAAA,CAoEA,IAAMA,WAA6E,CAAG,SAAhFA,WAA6EA,CAAAC,IAAA,CAoBjFC,GAAG,CACA,CAAA,IAnBDC,IAAI,CAAAF,IAAA,CAAJE,IAAI,CACJC,OAAO,CAAAH,IAAA,CAAPG,OAAO,CAAAC,SAAA,CAAAJ,IAAA,CACPK,IAAI,CAAJA,IAAI,CAAAD,SAAA,GAAG,KAAA,CAAA,CAAA,QAAQ,CAAAA,SAAA,CAAAE,aAAA,CAAAN,IAAA,CACfO,QAAQ,CAARA,QAAQ,CAAAD,aAAA,GAAG,KAAA,CAAA,CAAA,SAAS,CAAAA,aAAA,CACpBE,kBAAkB,CAAAR,IAAA,CAAlBQ,kBAAkB,CAClBC,UAAU,CAAAT,IAAA,CAAVS,UAAU,CACVC,MAAM,CAAAV,IAAA,CAANU,MAAM,CACNC,OAAO,CAAAX,IAAA,CAAPW,OAAO,CACPC,YAAY,CAAAZ,IAAA,CAAZY,YAAY,CACZC,WAAW,CAAAb,IAAA,CAAXa,WAAW,CACXC,aAAa,CAAAd,IAAA,CAAbc,aAAa,CACbC,cAAc,CAAAf,IAAA,CAAde,cAAc,CACdC,UAAU,CAAAhB,IAAA,CAAVgB,UAAU,CACVC,YAAY,CAAAjB,IAAA,CAAZiB,YAAY,CACZC,aAAa,CAAAlB,IAAA,CAAbkB,aAAa,CACbC,SAAS,CAAAnB,IAAA,CAATmB,SAAS,CACNC,IAAI,CAAAC,wBAAA,CAAArB,IAAA,CAAAsB,SAAA,CAIT,CAAA,OACEC,GAAA,CAACC,gBAAgB,CAAAC,MAAA,CAAAC,MAAA,CACfzB,CAAAA,GAAG,CAAEA,GAAW,CAChBE,OAAO,CAAEA,OAAQ,CACjBI,QAAQ,CAAEA,QAAS,CACnBF,IAAI,CAAEA,IAAK,CACXH,IAAI,CAAEA,IAAK,CACXyB,QAAQ,CAAER,SAAU,CACpBX,kBAAkB,CAAEA,kBAAmB,CACvCC,UAAU,CAAEA,UAAW,CACvBS,aAAa,CAAEA,aAAc,CAC7BR,MAAM,CAAEA,MAAO,CACfC,OAAO,CAAEA,OAAQ,CACjBC,YAAY,CAAEA,YAAa,CAC3BC,WAAW,CAAEA,WAAY,CACzBC,aAAa,CAAEA,aAAc,CAC7BC,cAAc,CAAEA,cAAe,CAC/BC,UAAU,CAAEA,UAAW,CACvBC,YAAY,CAAEA,YAAa,CACvBW,CAAAA,sBAAsB,CAACR,IAAI,CAAC,CAC5BA,IAAI,CACT,CAAC,CAEN,CAAC,CAEK,IAAAS,UAAU,CAAGC,cAAK,CAACC,UAAU,CAAChC,WAAW;;;;"}

package/build/lib/native/components/Card/Card.js

@@ -21,7 +21,7 @@ import { useVerifyAllowedChildren } from '../../utils/useVerifyAllowedChildren/u
 import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-var _excluded=["children","backgroundColor","borderRadius","elevation","testID","padding","width","height","minHeight","minWidth","onClick","isSelected","accessibilityLabel","shouldScaleOnHover","onHover","href","target","rel","as"],_excluded2=["height","children","testID"];var ComponentIds={CardHeader:'CardHeader',CardHeaderTrailing:'CardHeaderTrailing',CardHeaderLeading:'CardHeaderLeading',CardFooter:'CardFooter',CardFooterTrailing:'CardFooterTrailing',CardFooterLeading:'CardFooterLeading',CardBody:'CardBody',CardHeaderIcon:'CardHeaderIcon',CardHeaderCounter:'CardHeaderCounter',CardHeaderBadge:'CardHeaderBadge',CardHeaderAmount:'CardHeaderAmount',CardHeaderText:'CardHeaderText',CardHeaderLink:'CardHeaderLink',CardHeaderIconButton:'CardHeaderIconButton'};var _Card=function _Card(_ref,ref){var children=_ref.children,_ref$backgroundColor=_ref.backgroundColor,backgroundColor=_ref$backgroundColor===void 0?'surface.background.gray.intense':_ref$backgroundColor,_ref$borderRadius=_ref.borderRadius,borderRadius=_ref$borderRadius===void 0?'medium':_ref$borderRadius,_ref$elevation=_ref.elevation,elevation=_ref$elevation===void 0?'lowRaised':_ref$elevation,testID=_ref.testID,_ref$padding=_ref.padding,padding=_ref$padding===void 0?'spacing.7':_ref$padding,width=_ref.width,height=_ref.height,minHeight=_ref.minHeight,minWidth=_ref.minWidth,onClick=_ref.onClick,_ref$isSelected=_ref.isSelected,isSelected=_ref$isSelected===void 0?false:_ref$isSelected,accessibilityLabel=_ref.accessibilityLabel,_ref$shouldScaleOnHov=_ref.shouldScaleOnHover,shouldScaleOnHover=_ref$shouldScaleOnHov===void 0?false:_ref$shouldScaleOnHov,onHover=_ref.onHover,href=_ref.href,target=_ref.target,rel=_ref.rel,as=_ref.as,rest=_objectWithoutProperties(_ref,_excluded);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isFocused=_React$useState2[0],setIsFocused=_React$useState2[1];useVerifyAllowedChildren({children:children,componentName:'Card',allowedComponents:[ComponentIds.CardHeader,ComponentIds.CardBody,ComponentIds.CardFooter]});var linkOverlayProps=Object.assign({},metaAttribute({name:CARD_LINK_OVERLAY_ID}),makeAccessible({label:accessibilityLabel,pressed:isSelected}),{onFocus:function onFocus(){setIsFocused(true);},onBlur:function onBlur(){setIsFocused(false);}});var defaultRel=target&&target==='_blank'?'noreferrer noopener':undefined;return jsx(CardProvider,{children:jsx(CardRoot,Object.assign({as:as,ref:ref,display:'block',borderRadius:"medium",onMouseEnter:onHover,shouldScaleOnHover:shouldScaleOnHover,isSelected:isSelected,isFocused:isFocused,onClick:isReactNative()?onClick:undefined,width:width,height:height,minHeight:minHeight,minWidth:minWidth,href:href,accessibilityLabel:accessibilityLabel},metaAttribute({name:MetaConstants.Card,testID:testID}),getStyledProps(rest),makeAnalyticsAttribute(rest),{children:jsxs(CardSurface,{height:height,minHeight:minHeight,padding:padding,borderRadius:borderRadius,elevation:elevation,textAlign:'left',backgroundColor:backgroundColor,children:[href?jsx(LinkOverlay,Object.assign({onClick:onClick,href:href,target:target,rel:rel!=null?rel:defaultRel},linkOverlayProps)):null,!href&&onClick?jsx(LinkOverlay,Object.assign({as:"button",onClick:onClick},linkOverlayProps)):null,children]})}))});};var _CardBody=function _CardBody(_ref2){var height=_ref2.height,children=_ref2.children,testID=_ref2.testID,rest=_objectWithoutProperties(_ref2,_excluded2);useVerifyInsideCard('CardBody');return jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.CardBody,testID:testID}),makeAnalyticsAttribute(rest),{height:height,children:children}));};var Card=React__default.forwardRef(_Card);var CardBody=assignWithoutSideEffects(_CardBody,{componentId:ComponentIds.CardBody});
+var _excluded=["children","backgroundColor","borderRadius","elevation","testID","padding","width","height","minHeight","minWidth","onClick","isSelected","accessibilityLabel","shouldScaleOnHover","onHover","href","target","rel","as"],_excluded2=["height","children","testID"];var ComponentIds={CardHeader:'CardHeader',CardHeaderTrailing:'CardHeaderTrailing',CardHeaderLeading:'CardHeaderLeading',CardFooter:'CardFooter',CardFooterTrailing:'CardFooterTrailing',CardFooterLeading:'CardFooterLeading',CardBody:'CardBody',CardHeaderIcon:'CardHeaderIcon',CardHeaderCounter:'CardHeaderCounter',CardHeaderBadge:'CardHeaderBadge',CardHeaderAmount:'CardHeaderAmount',CardHeaderText:'CardHeaderText',CardHeaderLink:'CardHeaderLink',CardHeaderIconButton:'CardHeaderIconButton'};var _Card=function _Card(_ref,ref){var children=_ref.children,_ref$backgroundColor=_ref.backgroundColor,backgroundColor=_ref$backgroundColor===void 0?'surface.background.gray.intense':_ref$backgroundColor,_ref$borderRadius=_ref.borderRadius,borderRadius=_ref$borderRadius===void 0?'medium':_ref$borderRadius,_ref$elevation=_ref.elevation,elevation=_ref$elevation===void 0?'lowRaised':_ref$elevation,testID=_ref.testID,_ref$padding=_ref.padding,padding=_ref$padding===void 0?'spacing.7':_ref$padding,width=_ref.width,height=_ref.height,minHeight=_ref.minHeight,minWidth=_ref.minWidth,onClick=_ref.onClick,_ref$isSelected=_ref.isSelected,isSelected=_ref$isSelected===void 0?false:_ref$isSelected,accessibilityLabel=_ref.accessibilityLabel,_ref$shouldScaleOnHov=_ref.shouldScaleOnHover,shouldScaleOnHover=_ref$shouldScaleOnHov===void 0?false:_ref$shouldScaleOnHov,onHover=_ref.onHover,href=_ref.href,target=_ref.target,rel=_ref.rel,as=_ref.as,rest=_objectWithoutProperties(_ref,_excluded);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isFocused=_React$useState2[0],setIsFocused=_React$useState2[1];useVerifyAllowedChildren({children:children,componentName:'Card',allowedComponents:[ComponentIds.CardHeader,ComponentIds.CardBody,ComponentIds.CardFooter]});var linkOverlayProps=Object.assign({},metaAttribute({name:CARD_LINK_OVERLAY_ID}),makeAccessible({label:accessibilityLabel,pressed:isSelected}),{onFocus:function onFocus(){setIsFocused(true);},onBlur:function onBlur(){setIsFocused(false);}});var defaultRel=target&&target==='_blank'?'noreferrer noopener':undefined;return jsx(CardProvider,{children:jsx(CardRoot,Object.assign({as:as,ref:ref,display:'block',borderRadius:borderRadius,onMouseEnter:onHover,shouldScaleOnHover:shouldScaleOnHover,isSelected:isSelected,isFocused:isFocused,onClick:isReactNative()?onClick:undefined,width:width,height:height,minHeight:minHeight,minWidth:minWidth,href:href,accessibilityLabel:accessibilityLabel},metaAttribute({name:MetaConstants.Card,testID:testID}),getStyledProps(rest),makeAnalyticsAttribute(rest),{children:jsxs(CardSurface,{height:height,minHeight:minHeight,padding:padding,borderRadius:borderRadius,elevation:elevation,textAlign:'left',backgroundColor:backgroundColor,children:[href?jsx(LinkOverlay,Object.assign({onClick:onClick,href:href,target:target,rel:rel!=null?rel:defaultRel},linkOverlayProps)):null,!href&&onClick?jsx(LinkOverlay,Object.assign({as:"button",onClick:onClick},linkOverlayProps)):null,children]})}))});};var _CardBody=function _CardBody(_ref2){var height=_ref2.height,children=_ref2.children,testID=_ref2.testID,rest=_objectWithoutProperties(_ref2,_excluded2);useVerifyInsideCard('CardBody');return jsx(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.CardBody,testID:testID}),makeAnalyticsAttribute(rest),{height:height,children:children}));};var Card=React__default.forwardRef(_Card);var CardBody=assignWithoutSideEffects(_CardBody,{componentId:ComponentIds.CardBody});
 
 export { Card, CardBody, ComponentIds };
 //# sourceMappingURL=Card.js.map

package/build/lib/native/components/Card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../../../../../src/components/Card/Card.tsx"],"sourcesContent":["import React from 'react';\nimport type { GestureResponderEvent } from 'react-native';\nimport { CardSurface } from './CardSurface';\nimport { CardProvider, useVerifyInsideCard } from './CardContext';\nimport { LinkOverlay } from './LinkOverlay';\nimport { CardRoot } from './CardRoot';\nimport type { CardSpacingValueType, LinkOverlayProps } from './types';\nimport { CARD_LINK_OVERLAY_ID } from './constants';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { DataAnalyticsAttribute, BladeElementRef, TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport type { Elevation } from '~tokens/global';\nimport type { BoxProps } from '~components/Box';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren/useVerifyAllowedChildren';\nimport type { Platform } from '~utils';\nimport { isReactNative } from '~utils';\nimport type { Theme } from '~components/BladeProvider';\nimport type { DotNotationToken } from '~utils/lodashButBetter/get';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nexport const ComponentIds = {\n  CardHeader: 'CardHeader',\n  CardHeaderTrailing: 'CardHeaderTrailing',\n  CardHeaderLeading: 'CardHeaderLeading',\n  CardFooter: 'CardFooter',\n  CardFooterTrailing: 'CardFooterTrailing',\n  CardFooterLeading: 'CardFooterLeading',\n  CardBody: 'CardBody',\n  CardHeaderIcon: 'CardHeaderIcon',\n  CardHeaderCounter: 'CardHeaderCounter',\n  CardHeaderBadge: 'CardHeaderBadge',\n  CardHeaderAmount: 'CardHeaderAmount',\n  CardHeaderText: 'CardHeaderText',\n  CardHeaderLink: 'CardHeaderLink',\n  CardHeaderIconButton: 'CardHeaderIconButton',\n};\n\ntype CardSurfaceBackgroundColors = `surface.background.gray.${DotNotationToken<\n  Theme['colors']['surface']['background']['gray']\n>}`;\n\nexport type CardProps = {\n  /**\n   * Card contents\n   */\n  children: React.ReactNode;\n  /**\n   * Sets the background color of the Card\n   *\n   * @default `surface.background.gray.intense`\n   */\n  backgroundColor?: CardSurfaceBackgroundColors;\n  /**\n   * Sets the border radius of the Card\n   *\n   * @default `medium`\n   */\n  borderRadius?: Extract<BoxProps['borderRadius'], 'medium' | 'large' | 'xlarge'>;\n  /**\n   * Sets the elevation for Cards\n   *\n   * eg: `theme.elevation.midRaised`\n   *\n   * @default `theme.elevation.lowRaised`\n   *\n   * **Links:**\n   * - Docs: https://blade.razorpay.com/?path=/docs/tokens-elevation--docs\n   */\n  elevation?: keyof Elevation;\n  /**\n   * Sets the padding equally on all sides. Only few `spacing` tokens are allowed deliberately\n   * @default `spacing.7`\n   *\n   * **Links:**\n   * - Docs: https://blade.razorpay.com/?path=/docs/tokens-spacing--docs\n   */\n  padding?: CardSpacingValueType;\n  /**\n   * Sets the width of the card\n   */\n  width?: BoxProps['width'];\n  /**\n   * Sets the height of the card\n   */\n  height?: BoxProps['height'];\n  /**\n   * Sets minimum height of the card\n   */\n  minHeight?: BoxProps['minHeight'];\n  /**\n   * Sets minimum width of the card\n   */\n  minWidth?: BoxProps['minWidth'];\n  /**\n   * If `true`, the card will be in selected state\n   * Card will have a primary color border around it.\n   *\n   * @default false\n   */\n\n  isSelected?: boolean;\n  /**\n   * Makes the Card linkable by setting the `href` prop\n   *\n   * @default undefined\n   */\n  href?: string;\n  /**\n   * Sets the `target` attribute for the linkable card\n   */\n  target?: string;\n  /**\n   * Sets the `rel` attribute for the linkable card\n   */\n  rel?: string;\n  /**\n   * Sets the accessibility label for the card\n   * This is useful when the card has an `href` or `onClick` prop\n   * Setting this will announce the label when the card is focused\n   */\n  accessibilityLabel?: string;\n  /**\n   * If `true`, the card will scale up on hover\n   *\n   * On mobile devices it will scale down on press\n   *\n   * **This prop is deprecated in favour of motion presets released in v12**\n   *\n   * ### Migration\n   *\n   * ```diff\n   * - <Card\n   * -  shouldScaleOnHover\n   * - />\n   *\n   * + <Scale motionTriggers={['hover']}>\n   * +   <Card />\n   * + </Scale>\n   * ```\n   *\n   * @default false\n   *\n   * @deprecated This prop is deprecated in favour of motion presets released in v12\n   */\n  shouldScaleOnHover?: boolean;\n  /**\n   * Callback triggered when the card is hovered\n   */\n  onHover?: () => void;\n  /**\n   * Callback triggered when the card is clicked\n   */\n  onClick?: (\n    event: Platform.Select<{\n      web: React.MouseEvent;\n      native: GestureResponderEvent;\n    }>,\n  ) => void;\n  /**\n   * Sets the HTML element for the Card\n   *\n   * When `as` is set to `label`, the card will be rendered as a label element\n   * This can be used to create a custom checkbox or radio button using the card\n   *\n   * @default undefined\n   */\n  as?: 'label';\n} & TestID &\n  DataAnalyticsAttribute &\n  StyledPropsBlade;\n\nconst _Card: React.ForwardRefRenderFunction<BladeElementRef, CardProps> = (\n  {\n    children,\n    backgroundColor = 'surface.background.gray.intense',\n    borderRadius = 'medium',\n    elevation = 'lowRaised',\n    testID,\n    padding = 'spacing.7',\n    width,\n    height,\n    minHeight,\n    minWidth,\n    onClick,\n    isSelected = false,\n    accessibilityLabel,\n    shouldScaleOnHover = false,\n    onHover,\n    href,\n    target,\n    rel,\n    as,\n    ...rest\n  },\n  ref,\n): React.ReactElement => {\n  const [isFocused, setIsFocused] = React.useState(false);\n\n  useVerifyAllowedChildren({\n    children,\n    componentName: 'Card',\n    allowedComponents: [ComponentIds.CardHeader, ComponentIds.CardBody, ComponentIds.CardFooter],\n  });\n\n  const linkOverlayProps: LinkOverlayProps = {\n    ...metaAttribute({ name: CARD_LINK_OVERLAY_ID }),\n    ...makeAccessible({ label: accessibilityLabel, pressed: isSelected }),\n    onFocus: () => {\n      setIsFocused(true);\n    },\n    onBlur: () => {\n      setIsFocused(false);\n    },\n  };\n  const defaultRel = target && target === '_blank' ? 'noreferrer noopener' : undefined;\n\n  return (\n    <CardProvider>\n      <CardRoot\n        as={as}\n        ref={ref as never}\n        display={'block' as never}\n        borderRadius=\"medium\"\n        onMouseEnter={onHover as never}\n        shouldScaleOnHover={shouldScaleOnHover}\n        isSelected={isSelected}\n        isFocused={isFocused}\n        // on react native we need to pass onClick to root, because we don't need the LinkOverlay in RN\n        onClick={isReactNative() ? onClick : undefined}\n        width={width}\n        height={height}\n        minHeight={minHeight}\n        minWidth={minWidth}\n        href={href}\n        accessibilityLabel={accessibilityLabel}\n        {...metaAttribute({ name: MetaConstants.Card, testID })}\n        {...getStyledProps(rest)}\n        {...makeAnalyticsAttribute(rest)}\n      >\n        <CardSurface\n          height={height}\n          minHeight={minHeight}\n          padding={padding}\n          borderRadius={borderRadius}\n          elevation={elevation}\n          textAlign={'left' as never}\n          backgroundColor={backgroundColor}\n        >\n          {href ? (\n            <LinkOverlay\n              onClick={onClick}\n              href={href}\n              target={target}\n              rel={rel ?? defaultRel}\n              {...linkOverlayProps}\n            />\n          ) : null}\n          {!href && onClick ? (\n            <LinkOverlay as=\"button\" onClick={onClick} {...linkOverlayProps} />\n          ) : null}\n          {children}\n        </CardSurface>\n      </CardRoot>\n    </CardProvider>\n  );\n};\n\ntype CardBodyProps = {\n  children: React.ReactNode;\n  height?: BoxProps['height'];\n} & TestID &\n  DataAnalyticsAttribute;\n\nconst _CardBody = ({ height, children, testID, ...rest }: CardBodyProps): React.ReactElement => {\n  useVerifyInsideCard('CardBody');\n\n  return (\n    <BaseBox\n      {...metaAttribute({ name: MetaConstants.CardBody, testID })}\n      {...makeAnalyticsAttribute(rest)}\n      height={height}\n    >\n      {children}\n    </BaseBox>\n  );\n};\n\nconst Card = React.forwardRef(_Card);\nconst CardBody = assignWithoutSideEffects(_CardBody, { componentId: ComponentIds.CardBody });\n\nexport { Card, CardBody };\n"],"names":["ComponentIds","CardHeader","CardHeaderTrailing","CardHeaderLeading","CardFooter","CardFooterTrailing","CardFooterLeading","CardBody","CardHeaderIcon","CardHeaderCounter","CardHeaderBadge","CardHeaderAmount","CardHeaderText","CardHeaderLink","CardHeaderIconButton","_Card","_ref","ref","children","_ref$backgroundColor","backgroundColor","_ref$borderRadius","borderRadius","_ref$elevation","elevation","testID","_ref$padding","padding","width","height","minHeight","minWidth","onClick","_ref$isSelected","isSelected","accessibilityLabel","_ref$shouldScaleOnHov","shouldScaleOnHover","onHover","href","target","rel","as","rest","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","isFocused","setIsFocused","useVerifyAllowedChildren","componentName","allowedComponents","linkOverlayProps","Object","assign","metaAttribute","name","CARD_LINK_OVERLAY_ID","makeAccessible","label","pressed","onFocus","onBlur","defaultRel","undefined","_jsx","CardProvider","CardRoot","display","onMouseEnter","isReactNative","MetaConstants","Card","getStyledProps","makeAnalyticsAttribute","_jsxs","CardSurface","textAlign","LinkOverlay","_CardBody","_ref2","_excluded2","useVerifyInsideCard","BaseBox","forwardRef","assignWithoutSideEffects","componentId"],"mappings":"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"}
+{"version":3,"file":"Card.js","sources":["../../../../../src/components/Card/Card.tsx"],"sourcesContent":["import React from 'react';\nimport type { GestureResponderEvent } from 'react-native';\nimport { CardSurface } from './CardSurface';\nimport { CardProvider, useVerifyInsideCard } from './CardContext';\nimport { LinkOverlay } from './LinkOverlay';\nimport { CardRoot } from './CardRoot';\nimport type { CardSpacingValueType, LinkOverlayProps } from './types';\nimport { CARD_LINK_OVERLAY_ID } from './constants';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { DataAnalyticsAttribute, BladeElementRef, TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport type { Elevation } from '~tokens/global';\nimport type { BoxProps } from '~components/Box';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { useVerifyAllowedChildren } from '~utils/useVerifyAllowedChildren/useVerifyAllowedChildren';\nimport type { Platform } from '~utils';\nimport { isReactNative } from '~utils';\nimport type { Theme } from '~components/BladeProvider';\nimport type { DotNotationToken } from '~utils/lodashButBetter/get';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nexport const ComponentIds = {\n  CardHeader: 'CardHeader',\n  CardHeaderTrailing: 'CardHeaderTrailing',\n  CardHeaderLeading: 'CardHeaderLeading',\n  CardFooter: 'CardFooter',\n  CardFooterTrailing: 'CardFooterTrailing',\n  CardFooterLeading: 'CardFooterLeading',\n  CardBody: 'CardBody',\n  CardHeaderIcon: 'CardHeaderIcon',\n  CardHeaderCounter: 'CardHeaderCounter',\n  CardHeaderBadge: 'CardHeaderBadge',\n  CardHeaderAmount: 'CardHeaderAmount',\n  CardHeaderText: 'CardHeaderText',\n  CardHeaderLink: 'CardHeaderLink',\n  CardHeaderIconButton: 'CardHeaderIconButton',\n};\n\ntype CardSurfaceBackgroundColors = `surface.background.gray.${DotNotationToken<\n  Theme['colors']['surface']['background']['gray']\n>}`;\n\nexport type CardProps = {\n  /**\n   * Card contents\n   */\n  children: React.ReactNode;\n  /**\n   * Sets the background color of the Card\n   *\n   * @default `surface.background.gray.intense`\n   */\n  backgroundColor?: CardSurfaceBackgroundColors;\n  /**\n   * Sets the border radius of the Card\n   *\n   * @default `medium`\n   */\n  borderRadius?: Extract<BoxProps['borderRadius'], 'medium' | 'large' | 'xlarge'>;\n  /**\n   * Sets the elevation for Cards\n   *\n   * eg: `theme.elevation.midRaised`\n   *\n   * @default `theme.elevation.lowRaised`\n   *\n   * **Links:**\n   * - Docs: https://blade.razorpay.com/?path=/docs/tokens-elevation--docs\n   */\n  elevation?: keyof Elevation;\n  /**\n   * Sets the padding equally on all sides. Only few `spacing` tokens are allowed deliberately\n   * @default `spacing.7`\n   *\n   * **Links:**\n   * - Docs: https://blade.razorpay.com/?path=/docs/tokens-spacing--docs\n   */\n  padding?: CardSpacingValueType;\n  /**\n   * Sets the width of the card\n   */\n  width?: BoxProps['width'];\n  /**\n   * Sets the height of the card\n   */\n  height?: BoxProps['height'];\n  /**\n   * Sets minimum height of the card\n   */\n  minHeight?: BoxProps['minHeight'];\n  /**\n   * Sets minimum width of the card\n   */\n  minWidth?: BoxProps['minWidth'];\n  /**\n   * If `true`, the card will be in selected state\n   * Card will have a primary color border around it.\n   *\n   * @default false\n   */\n\n  isSelected?: boolean;\n  /**\n   * Makes the Card linkable by setting the `href` prop\n   *\n   * @default undefined\n   */\n  href?: string;\n  /**\n   * Sets the `target` attribute for the linkable card\n   */\n  target?: string;\n  /**\n   * Sets the `rel` attribute for the linkable card\n   */\n  rel?: string;\n  /**\n   * Sets the accessibility label for the card\n   * This is useful when the card has an `href` or `onClick` prop\n   * Setting this will announce the label when the card is focused\n   */\n  accessibilityLabel?: string;\n  /**\n   * If `true`, the card will scale up on hover\n   *\n   * On mobile devices it will scale down on press\n   *\n   * **This prop is deprecated in favour of motion presets released in v12**\n   *\n   * ### Migration\n   *\n   * ```diff\n   * - <Card\n   * -  shouldScaleOnHover\n   * - />\n   *\n   * + <Scale motionTriggers={['hover']}>\n   * +   <Card />\n   * + </Scale>\n   * ```\n   *\n   * @default false\n   *\n   * @deprecated This prop is deprecated in favour of motion presets released in v12\n   */\n  shouldScaleOnHover?: boolean;\n  /**\n   * Callback triggered when the card is hovered\n   */\n  onHover?: () => void;\n  /**\n   * Callback triggered when the card is clicked\n   */\n  onClick?: (\n    event: Platform.Select<{\n      web: React.MouseEvent;\n      native: GestureResponderEvent;\n    }>,\n  ) => void;\n  /**\n   * Sets the HTML element for the Card\n   *\n   * When `as` is set to `label`, the card will be rendered as a label element\n   * This can be used to create a custom checkbox or radio button using the card\n   *\n   * @default undefined\n   */\n  as?: 'label';\n} & TestID &\n  DataAnalyticsAttribute &\n  StyledPropsBlade;\n\nconst _Card: React.ForwardRefRenderFunction<BladeElementRef, CardProps> = (\n  {\n    children,\n    backgroundColor = 'surface.background.gray.intense',\n    borderRadius = 'medium',\n    elevation = 'lowRaised',\n    testID,\n    padding = 'spacing.7',\n    width,\n    height,\n    minHeight,\n    minWidth,\n    onClick,\n    isSelected = false,\n    accessibilityLabel,\n    shouldScaleOnHover = false,\n    onHover,\n    href,\n    target,\n    rel,\n    as,\n    ...rest\n  },\n  ref,\n): React.ReactElement => {\n  const [isFocused, setIsFocused] = React.useState(false);\n\n  useVerifyAllowedChildren({\n    children,\n    componentName: 'Card',\n    allowedComponents: [ComponentIds.CardHeader, ComponentIds.CardBody, ComponentIds.CardFooter],\n  });\n\n  const linkOverlayProps: LinkOverlayProps = {\n    ...metaAttribute({ name: CARD_LINK_OVERLAY_ID }),\n    ...makeAccessible({ label: accessibilityLabel, pressed: isSelected }),\n    onFocus: () => {\n      setIsFocused(true);\n    },\n    onBlur: () => {\n      setIsFocused(false);\n    },\n  };\n  const defaultRel = target && target === '_blank' ? 'noreferrer noopener' : undefined;\n\n  return (\n    <CardProvider>\n      <CardRoot\n        as={as}\n        ref={ref as never}\n        display={'block' as never}\n        borderRadius={borderRadius}\n        onMouseEnter={onHover as never}\n        shouldScaleOnHover={shouldScaleOnHover}\n        isSelected={isSelected}\n        isFocused={isFocused}\n        // on react native we need to pass onClick to root, because we don't need the LinkOverlay in RN\n        onClick={isReactNative() ? onClick : undefined}\n        width={width}\n        height={height}\n        minHeight={minHeight}\n        minWidth={minWidth}\n        href={href}\n        accessibilityLabel={accessibilityLabel}\n        {...metaAttribute({ name: MetaConstants.Card, testID })}\n        {...getStyledProps(rest)}\n        {...makeAnalyticsAttribute(rest)}\n      >\n        <CardSurface\n          height={height}\n          minHeight={minHeight}\n          padding={padding}\n          borderRadius={borderRadius}\n          elevation={elevation}\n          textAlign={'left' as never}\n          backgroundColor={backgroundColor}\n        >\n          {href ? (\n            <LinkOverlay\n              onClick={onClick}\n              href={href}\n              target={target}\n              rel={rel ?? defaultRel}\n              {...linkOverlayProps}\n            />\n          ) : null}\n          {!href && onClick ? (\n            <LinkOverlay as=\"button\" onClick={onClick} {...linkOverlayProps} />\n          ) : null}\n          {children}\n        </CardSurface>\n      </CardRoot>\n    </CardProvider>\n  );\n};\n\ntype CardBodyProps = {\n  children: React.ReactNode;\n  height?: BoxProps['height'];\n} & TestID &\n  DataAnalyticsAttribute;\n\nconst _CardBody = ({ height, children, testID, ...rest }: CardBodyProps): React.ReactElement => {\n  useVerifyInsideCard('CardBody');\n\n  return (\n    <BaseBox\n      {...metaAttribute({ name: MetaConstants.CardBody, testID })}\n      {...makeAnalyticsAttribute(rest)}\n      height={height}\n    >\n      {children}\n    </BaseBox>\n  );\n};\n\nconst Card = React.forwardRef(_Card);\nconst CardBody = assignWithoutSideEffects(_CardBody, { componentId: ComponentIds.CardBody });\n\nexport { Card, CardBody };\n"],"names":["ComponentIds","CardHeader","CardHeaderTrailing","CardHeaderLeading","CardFooter","CardFooterTrailing","CardFooterLeading","CardBody","CardHeaderIcon","CardHeaderCounter","CardHeaderBadge","CardHeaderAmount","CardHeaderText","CardHeaderLink","CardHeaderIconButton","_Card","_ref","ref","children","_ref$backgroundColor","backgroundColor","_ref$borderRadius","borderRadius","_ref$elevation","elevation","testID","_ref$padding","padding","width","height","minHeight","minWidth","onClick","_ref$isSelected","isSelected","accessibilityLabel","_ref$shouldScaleOnHov","shouldScaleOnHover","onHover","href","target","rel","as","rest","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","isFocused","setIsFocused","useVerifyAllowedChildren","componentName","allowedComponents","linkOverlayProps","Object","assign","metaAttribute","name","CARD_LINK_OVERLAY_ID","makeAccessible","label","pressed","onFocus","onBlur","defaultRel","undefined","_jsx","CardProvider","CardRoot","display","onMouseEnter","isReactNative","MetaConstants","Card","getStyledProps","makeAnalyticsAttribute","_jsxs","CardSurface","textAlign","LinkOverlay","_CardBody","_ref2","_excluded2","useVerifyInsideCard","BaseBox","forwardRef","assignWithoutSideEffects","componentId"],"mappings":"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"}

package/build/lib/native/components/Radio/Radio.js

@@ -26,7 +26,7 @@ import { getOuterMotionRef, getInnerMotionRef } from '../../utils/getMotionRefs.
 import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-var _excluded=["value","children","helpText","isDisabled","size","testID","_motionMeta"];var _Radio=function _Radio(_ref,ref){var _groupProps$state,_groupProps$size;var value=_ref.value,children=_ref.children,helpText=_ref.helpText,isDisabled=_ref.isDisabled,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,testID=_ref.testID,_motionMeta=_ref._motionMeta,rest=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var groupProps=useRadioGroupContext();var isInsideGroup=!isEmpty(groupProps);if(__DEV__){if(!isInsideGroup){throwBladeError({moduleName:'Radio',message:'Cannot use <Radio /> outside of <RadioGroup />'});}}var isChecked=groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var defaultChecked=(groupProps==null?void 0:groupProps.defaultValue)===undefined?undefined:(groupProps==null?void 0:groupProps.defaultValue)===value;var validationState=groupProps==null?void 0:groupProps.validationState;var hasError=validationState==='error';var _isDisabled=isDisabled!=null?isDisabled:groupProps==null?void 0:groupProps.isDisabled;var _isRequired=(groupProps==null?void 0:groupProps.isRequired)||(groupProps==null?void 0:groupProps.necessityIndicator)==='required';var name=groupProps==null?void 0:groupProps.name;var showHelpText=helpText;var isReactNative=getPlatformType()==='react-native';var _size=(_groupProps$size=groupProps.size)!=null?_groupProps$size:size;var handleChange=function handleChange(_ref2){var isChecked=_ref2.isChecked,value=_ref2.value;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.setValue(value);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue();}};var _useRadio=useRadio({defaultChecked:defaultChecked,isChecked:isChecked,hasError:hasError,isDisabled:_isDisabled,isRequired:_isRequired,name:name,value:value,onChange:handleChange}),state=_useRadio.state,ids=_useRadio.ids,inputProps=_useRadio.inputProps;var helpTextLeftSpacing=makeSize(radioSizes.icon[size].width+theme.spacing[3]);return jsx(BaseBox,Object.assign({ref:getOuterMotionRef({_motionMeta:_motionMeta,ref:ref})},getStyledProps(rest),{children:jsx(SelectorLabel,{componentName:MetaConstants.RadioLabel,inputProps:isReactNative?inputProps:{},testID:testID,children:jsxs(BaseBox,{display:"flex",flexDirection:"column",children:[jsxs(BaseBox,{display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(SelectorInput,Object.assign({hoverTokens:radioHoverTokens,isChecked:state.isChecked,isDisabled:_isDisabled,hasError:hasError,inputProps:inputProps,ref:getInnerMotionRef({_motionMeta:_motionMeta,ref:ref})},makeAnalyticsAttribute(rest))),jsx(RadioIcon,{size:_size,isChecked:state.isChecked,isDisabled:_isDisabled,isNegative:hasError}),children?jsx(SelectorTitle,{size:_size,isDisabled:_isDisabled,children:children}):null]}),showHelpText&&jsx(BaseBox,{marginLeft:helpTextLeftSpacing,children:jsx(SelectorSupportText,{size:_size,id:ids==null?void 0:ids.helpTextId,children:helpText})})]})})}));};var Radio=assignWithoutSideEffects(React__default.forwardRef(_Radio),{displayName:'Radio'});
+var _excluded=["value","children","helpText","isDisabled","size","testID","_motionMeta"];var _Radio=function _Radio(_ref,ref){var _groupProps$state,_groupProps$size;var value=_ref.value,children=_ref.children,helpText=_ref.helpText,isDisabled=_ref.isDisabled,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,testID=_ref.testID,_motionMeta=_ref._motionMeta,rest=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var groupProps=useRadioGroupContext();var isInsideGroup=!isEmpty(groupProps);if(__DEV__){if(!isInsideGroup){throwBladeError({moduleName:'Radio',message:'Cannot use <Radio /> outside of <RadioGroup />'});}}var isChecked=groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var defaultChecked=(groupProps==null?void 0:groupProps.defaultValue)===undefined?undefined:(groupProps==null?void 0:groupProps.defaultValue)===value;var validationState=groupProps==null?void 0:groupProps.validationState;var hasError=validationState==='error';var _isDisabled=isDisabled!=null?isDisabled:groupProps==null?void 0:groupProps.isDisabled;var _isRequired=(groupProps==null?void 0:groupProps.isRequired)||(groupProps==null?void 0:groupProps.necessityIndicator)==='required';var name=groupProps==null?void 0:groupProps.name;var showHelpText=helpText;var isReactNative=getPlatformType()==='react-native';var _size=(_groupProps$size=groupProps.size)!=null?_groupProps$size:size;var handleChange=function handleChange(_ref2){var isChecked=_ref2.isChecked,value=_ref2.value,event=_ref2.event;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.setValue(value,event);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue();}};var _useRadio=useRadio({defaultChecked:defaultChecked,isChecked:isChecked,hasError:hasError,isDisabled:_isDisabled,isRequired:_isRequired,name:name,value:value,onChange:handleChange}),state=_useRadio.state,ids=_useRadio.ids,inputProps=_useRadio.inputProps;var helpTextLeftSpacing=makeSize(radioSizes.icon[size].width+theme.spacing[3]);return jsx(BaseBox,Object.assign({ref:getOuterMotionRef({_motionMeta:_motionMeta,ref:ref})},getStyledProps(rest),{children:jsx(SelectorLabel,{componentName:MetaConstants.RadioLabel,inputProps:isReactNative?inputProps:{},testID:testID,children:jsxs(BaseBox,{display:"flex",flexDirection:"column",children:[jsxs(BaseBox,{display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(SelectorInput,Object.assign({hoverTokens:radioHoverTokens,isChecked:state.isChecked,isDisabled:_isDisabled,hasError:hasError,inputProps:inputProps,ref:getInnerMotionRef({_motionMeta:_motionMeta,ref:ref})},makeAnalyticsAttribute(rest))),jsx(RadioIcon,{size:_size,isChecked:state.isChecked,isDisabled:_isDisabled,isNegative:hasError}),children?jsx(SelectorTitle,{size:_size,isDisabled:_isDisabled,children:children}):null]}),showHelpText&&jsx(BaseBox,{marginLeft:helpTextLeftSpacing,children:jsx(SelectorSupportText,{size:_size,id:ids==null?void 0:ids.helpTextId,children:helpText})})]})})}));};var Radio=assignWithoutSideEffects(React__default.forwardRef(_Radio),{displayName:'Radio'});
 
 export { Radio };
 //# sourceMappingURL=Radio.js.map

package/build/lib/native/components/Radio/Radio.js.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","sources":["../../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\n/* eslint-disable @typescript-eslint/no-shadow */\nimport React from 'react';\nimport type { OnChange } from './useRadio';\nimport { useRadio } from './useRadio';\nimport { RadioIcon } from './RadioIcon/RadioIcon';\nimport { useRadioGroupContext } from './RadioGroup/RadioContext';\nimport { radioHoverTokens, radioSizes } from './radioTokens';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorTitle } from '~components/Form/Selector/SelectorTitle';\nimport { SelectorSupportText } from '~components/Form/Selector/SelectorSupportText';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type {\n  BladeElementRef,\n  DataAnalyticsAttribute,\n  StringChildrenType,\n  TestID,\n} from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getPlatformType, makeSize, useTheme } from '~utils';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { throwBladeError } from '~utils/logger';\nimport type { MotionMetaProp } from '~components/BaseMotion';\nimport { getInnerMotionRef, getOuterMotionRef } from '~utils/getMotionRefs';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype RadioProps = {\n  /**\n   * Sets the label text of the Radio\n   */\n  children?: StringChildrenType;\n  /**\n   * Help text for the Radio\n   */\n  helpText?: string;\n  /**\n   * The value to be used in the Radio input.\n   * This is the value that will be returned on form submission.\n   */\n  value: string;\n  /**\n   * If `true`, the Radio will be disabled\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Size of the radios\n   *\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium' | 'large';\n} & TestID &\n  DataAnalyticsAttribute &\n  StyledPropsBlade &\n  MotionMetaProp;\n\nconst _Radio: React.ForwardRefRenderFunction<BladeElementRef, RadioProps> = (\n  { value, children, helpText, isDisabled, size = 'medium', testID, _motionMeta, ...rest },\n  ref,\n) => {\n  const { theme } = useTheme();\n  const groupProps = useRadioGroupContext();\n  const isInsideGroup = !isEmpty(groupProps);\n\n  if (__DEV__) {\n    if (!isInsideGroup) {\n      throwBladeError({\n        moduleName: 'Radio',\n        message: 'Cannot use <Radio /> outside of <RadioGroup />',\n      });\n    }\n  }\n\n  const isChecked = groupProps?.state?.isChecked(value);\n  const defaultChecked =\n    groupProps?.defaultValue === undefined ? undefined : groupProps?.defaultValue === value;\n  const validationState = groupProps?.validationState;\n  const hasError = validationState === 'error';\n  const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n  const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n  const name = groupProps?.name;\n  const showHelpText = helpText;\n  const isReactNative = getPlatformType() === 'react-native';\n  const _size = groupProps.size ?? size;\n\n  const handleChange: OnChange = ({ isChecked, value }) => {\n    if (isChecked) {\n      groupProps?.state?.setValue(value!);\n    } else {\n      groupProps?.state?.removeValue();\n    }\n  };\n\n  const { state, ids, inputProps } = useRadio({\n    defaultChecked,\n    isChecked,\n    hasError,\n    isDisabled: _isDisabled,\n    isRequired: _isRequired,\n    name,\n    value,\n    onChange: handleChange,\n  });\n\n  // radio icon's size & margin + margin-left of SelectorTitle which is 2\n  const helpTextLeftSpacing = makeSize(radioSizes.icon[size].width + theme.spacing[3]);\n\n  return (\n    <BaseBox ref={getOuterMotionRef({ _motionMeta, ref })} {...getStyledProps(rest)}>\n      <SelectorLabel\n        componentName={MetaConstants.RadioLabel}\n        inputProps={isReactNative ? inputProps : {}}\n        testID={testID}\n      >\n        <BaseBox display=\"flex\" flexDirection=\"column\">\n          <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n            <SelectorInput\n              hoverTokens={radioHoverTokens}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              hasError={hasError}\n              inputProps={inputProps}\n              ref={getInnerMotionRef({ _motionMeta, ref })}\n              {...makeAnalyticsAttribute(rest)}\n            />\n            <RadioIcon\n              size={_size}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              isNegative={hasError}\n            />\n            {children ? (\n              <SelectorTitle size={_size} isDisabled={_isDisabled}>\n                {children}\n              </SelectorTitle>\n            ) : null}\n          </BaseBox>\n          {showHelpText && (\n            <BaseBox marginLeft={helpTextLeftSpacing}>\n              <SelectorSupportText size={_size} id={ids?.helpTextId}>\n                {helpText}\n              </SelectorSupportText>\n            </BaseBox>\n          )}\n        </BaseBox>\n      </SelectorLabel>\n    </BaseBox>\n  );\n};\n\nconst Radio = assignWithoutSideEffects(React.forwardRef(_Radio), { displayName: 'Radio' });\n\nexport type { RadioProps };\nexport { Radio };\n"],"names":["_Radio","_ref","ref","_groupProps$state","_groupProps$size","value","children","helpText","isDisabled","_ref$size","size","testID","_motionMeta","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","groupProps","useRadioGroupContext","isInsideGroup","isEmpty","__DEV__","throwBladeError","moduleName","message","isChecked","state","defaultChecked","defaultValue","undefined","validationState","hasError","_isDisabled","_isRequired","isRequired","necessityIndicator","name","showHelpText","isReactNative","getPlatformType","_size","handleChange","_ref2","_groupProps$state2","setValue","_groupProps$state3","removeValue","_useRadio","useRadio","onChange","ids","inputProps","helpTextLeftSpacing","makeSize","radioSizes","icon","width","spacing","_jsx","BaseBox","Object","assign","getOuterMotionRef","getStyledProps","SelectorLabel","componentName","MetaConstants","RadioLabel","_jsxs","display","flexDirection","alignItems","SelectorInput","hoverTokens","radioHoverTokens","getInnerMotionRef","makeAnalyticsAttribute","RadioIcon","isNegative","SelectorTitle","marginLeft","SelectorSupportText","id","helpTextId","Radio","assignWithoutSideEffects","React","forwardRef","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,IAAA,SAAA,CAAA,CAAA,OAAA,CAAA,UAAA,CAAA,UAAA,CAAA,YAAA,CAAA,MAAA,CAAA,QAAA,CAAA,aAAA,CAAA,CA2DA,IAAMA,MAAmE,CAAG,SAAtEA,MAAmEA,CAAAC,IAAA,CAEvEC,GAAG,CACA,CAAA,IAAAC,iBAAA,CAAAC,gBAAA,CAFD,IAAAC,KAAK,CAAAJ,IAAA,CAALI,KAAK,CAAEC,QAAQ,CAAAL,IAAA,CAARK,QAAQ,CAAEC,QAAQ,CAAAN,IAAA,CAARM,QAAQ,CAAEC,UAAU,CAAAP,IAAA,CAAVO,UAAU,CAAAC,SAAA,CAAAR,IAAA,CAAES,IAAI,CAAJA,IAAI,CAAAD,SAAA,GAAG,KAAA,CAAA,CAAA,QAAQ,CAAAA,SAAA,CAAEE,MAAM,CAAAV,IAAA,CAANU,MAAM,CAAEC,WAAW,CAAAX,IAAA,CAAXW,WAAW,CAAKC,IAAI,CAAAC,wBAAA,CAAAb,IAAA,CAAAc,SAAA,CAAA,CAGtF,IAAAC,SAAA,CAAkBC,QAAQ,EAAE,CAApBC,KAAK,CAAAF,SAAA,CAALE,KAAK,CACb,IAAMC,UAAU,CAAGC,oBAAoB,EAAE,CACzC,IAAMC,aAAa,CAAG,CAACC,OAAO,CAACH,UAAU,CAAC,CAE1C,GAAII,OAAO,CAAE,CACX,GAAI,CAACF,aAAa,CAAE,CAClBG,eAAe,CAAC,CACdC,UAAU,CAAE,OAAO,CACnBC,OAAO,CAAE,gDACX,CAAC,CAAC,CACJ,CACF,CAEA,IAAMC,SAAS,CAAGR,UAAU,EAAA,IAAA,CAAA,KAAA,CAAA,CAAA,CAAAhB,iBAAA,CAAVgB,UAAU,CAAES,KAAK,GAAA,IAAA,CAAA,KAAA,CAAA,CAAjBzB,iBAAA,CAAmBwB,SAAS,CAACtB,KAAK,CAAC,CACrD,IAAMwB,cAAc,CAClB,CAAAV,UAAU,EAAA,IAAA,CAAA,KAAA,CAAA,CAAVA,UAAU,CAAEW,YAAY,IAAKC,SAAS,CAAGA,SAAS,CAAG,CAAAZ,UAAU,EAAVA,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,UAAU,CAAEW,YAAY,IAAKzB,KAAK,CACzF,IAAM2B,eAAe,CAAGb,UAAU,EAAVA,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,UAAU,CAAEa,eAAe,CACnD,IAAMC,QAAQ,CAAGD,eAAe,GAAK,OAAO,CAC5C,IAAME,WAAW,CAAG1B,UAAU,EAAVA,IAAAA,CAAAA,UAAU,CAAIW,UAAU,EAAA,IAAA,CAAA,KAAA,CAAA,CAAVA,UAAU,CAAEX,UAAU,CACxD,IAAM2B,WAAW,CAAG,CAAAhB,UAAU,EAAA,IAAA,CAAA,KAAA,CAAA,CAAVA,UAAU,CAAEiB,UAAU,GAAI,CAAAjB,UAAU,cAAVA,UAAU,CAAEkB,kBAAkB,IAAK,UAAU,CAC3F,IAAMC,IAAI,CAAGnB,UAAU,cAAVA,UAAU,CAAEmB,IAAI,CAC7B,IAAMC,YAAY,CAAGhC,QAAQ,CAC7B,IAAMiC,aAAa,CAAGC,eAAe,EAAE,GAAK,cAAc,CAC1D,IAAMC,KAAK,CAAAtC,CAAAA,gBAAA,CAAGe,UAAU,CAACT,IAAI,GAAAN,IAAAA,CAAAA,gBAAA,CAAIM,IAAI,CAErC,IAAMiC,YAAsB,CAAG,SAAzBA,YAAsBA,CAAAC,KAAA,CAA6B,CAAvB,IAAAjB,SAAS,CAAAiB,KAAA,CAATjB,SAAS,CAAEtB,KAAK,CAAAuC,KAAA,CAALvC,KAAK,CAChD,GAAIsB,SAAS,CAAE,KAAAkB,kBAAA,CACb1B,UAAU,EAAA,IAAA,CAAA,KAAA,CAAA,CAAA,CAAA0B,kBAAA,CAAV1B,UAAU,CAAES,KAAK,GAAA,IAAA,CAAA,KAAA,CAAA,CAAjBiB,kBAAA,CAAmBC,QAAQ,CAACzC,KAAM,CAAC,CACrC,CAAC,KAAM,KAAA0C,kBAAA,CACL5B,UAAU,EAAA4B,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,CAAAA,kBAAA,CAAV5B,UAAU,CAAES,KAAK,GAAA,IAAA,CAAA,KAAA,CAAA,CAAjBmB,kBAAA,CAAmBC,WAAW,EAAE,CAClC,CACF,CAAC,CAED,IAAAC,SAAA,CAAmCC,QAAQ,CAAC,CAC1CrB,cAAc,CAAdA,cAAc,CACdF,SAAS,CAATA,SAAS,CACTM,QAAQ,CAARA,QAAQ,CACRzB,UAAU,CAAE0B,WAAW,CACvBE,UAAU,CAAED,WAAW,CACvBG,IAAI,CAAJA,IAAI,CACJjC,KAAK,CAALA,KAAK,CACL8C,QAAQ,CAAER,YACZ,CAAC,CAAC,CATMf,KAAK,CAAAqB,SAAA,CAALrB,KAAK,CAAEwB,GAAG,CAAAH,SAAA,CAAHG,GAAG,CAAEC,UAAU,CAAAJ,SAAA,CAAVI,UAAU,CAY9B,IAAMC,mBAAmB,CAAGC,QAAQ,CAACC,UAAU,CAACC,IAAI,CAAC/C,IAAI,CAAC,CAACgD,KAAK,CAAGxC,KAAK,CAACyC,OAAO,CAAC,CAAC,CAAC,CAAC,CAEpF,OACEC,GAAA,CAACC,OAAO,CAAAC,MAAA,CAAAC,MAAA,CAAA,CAAC7D,GAAG,CAAE8D,iBAAiB,CAAC,CAAEpD,WAAW,CAAXA,WAAW,CAAEV,GAAG,CAAHA,GAAI,CAAC,CAAE,EAAK+D,cAAc,CAACpD,IAAI,CAAC,CAAA,CAAAP,QAAA,CAC7EsD,GAAA,CAACM,aAAa,CAAA,CACZC,aAAa,CAAEC,aAAa,CAACC,UAAW,CACxChB,UAAU,CAAEb,aAAa,CAAGa,UAAU,CAAG,EAAG,CAC5C1C,MAAM,CAAEA,MAAO,CAAAL,QAAA,CAEfgE,IAAA,CAACT,OAAO,EAACU,OAAO,CAAC,MAAM,CAACC,aAAa,CAAC,QAAQ,CAAAlE,QAAA,CAAA,CAC5CgE,IAAA,CAACT,OAAO,EAACU,OAAO,CAAC,MAAM,CAACE,UAAU,CAAC,QAAQ,CAACD,aAAa,CAAC,KAAK,CAAAlE,QAAA,CAAA,CAC7DsD,GAAA,CAACc,aAAa,CAAAZ,MAAA,CAAAC,MAAA,CAAA,CACZY,WAAW,CAAEC,gBAAiB,CAC9BjD,SAAS,CAAEC,KAAK,CAACD,SAAU,CAC3BnB,UAAU,CAAE0B,WAAY,CACxBD,QAAQ,CAAEA,QAAS,CACnBoB,UAAU,CAAEA,UAAW,CACvBnD,GAAG,CAAE2E,iBAAiB,CAAC,CAAEjE,WAAW,CAAXA,WAAW,CAAEV,GAAG,CAAHA,GAAI,CAAC,CAAE,CACzC4E,CAAAA,sBAAsB,CAACjE,IAAI,CAAC,CACjC,CAAC,CACF+C,GAAA,CAACmB,SAAS,EACRrE,IAAI,CAAEgC,KAAM,CACZf,SAAS,CAAEC,KAAK,CAACD,SAAU,CAC3BnB,UAAU,CAAE0B,WAAY,CACxB8C,UAAU,CAAE/C,QAAS,CACtB,CAAC,CACD3B,QAAQ,CACPsD,GAAA,CAACqB,aAAa,EAACvE,IAAI,CAAEgC,KAAM,CAAClC,UAAU,CAAE0B,WAAY,CAAA5B,QAAA,CACjDA,QAAQ,CACI,CAAC,CACd,IAAI,CACD,CAAA,CAAC,CACTiC,YAAY,EACXqB,GAAA,CAACC,OAAO,EAACqB,UAAU,CAAE5B,mBAAoB,CAAAhD,QAAA,CACvCsD,GAAA,CAACuB,mBAAmB,CAACzE,CAAAA,IAAI,CAAEgC,KAAM,CAAC0C,EAAE,CAAEhC,GAAG,EAAHA,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,GAAG,CAAEiC,UAAW,CAAA/E,QAAA,CACnDC,QAAQ,CACU,CAAC,CACf,CACV,CACM,CAAA,CAAC,CACG,CAAC,CAAA,CACT,CAAC,CAEd,CAAC,CAEK,IAAA+E,KAAK,CAAGC,wBAAwB,CAACC,cAAK,CAACC,UAAU,CAACzF,MAAM,CAAC,CAAE,CAAE0F,WAAW,CAAE,OAAQ,CAAC;;;;"}
+{"version":3,"file":"Radio.js","sources":["../../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\n/* eslint-disable @typescript-eslint/no-shadow */\nimport React from 'react';\nimport type { OnChange } from './useRadio';\nimport { useRadio } from './useRadio';\nimport { RadioIcon } from './RadioIcon/RadioIcon';\nimport { useRadioGroupContext } from './RadioGroup/RadioContext';\nimport { radioHoverTokens, radioSizes } from './radioTokens';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorTitle } from '~components/Form/Selector/SelectorTitle';\nimport { SelectorSupportText } from '~components/Form/Selector/SelectorSupportText';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type {\n  BladeElementRef,\n  DataAnalyticsAttribute,\n  StringChildrenType,\n  TestID,\n} from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getPlatformType, makeSize, useTheme } from '~utils';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { throwBladeError } from '~utils/logger';\nimport type { MotionMetaProp } from '~components/BaseMotion';\nimport { getInnerMotionRef, getOuterMotionRef } from '~utils/getMotionRefs';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype RadioProps = {\n  /**\n   * Sets the label text of the Radio\n   */\n  children?: StringChildrenType;\n  /**\n   * Help text for the Radio\n   */\n  helpText?: string;\n  /**\n   * The value to be used in the Radio input.\n   * This is the value that will be returned on form submission.\n   */\n  value: string;\n  /**\n   * If `true`, the Radio will be disabled\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Size of the radios\n   *\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium' | 'large';\n} & TestID &\n  DataAnalyticsAttribute &\n  StyledPropsBlade &\n  MotionMetaProp;\n\nconst _Radio: React.ForwardRefRenderFunction<BladeElementRef, RadioProps> = (\n  { value, children, helpText, isDisabled, size = 'medium', testID, _motionMeta, ...rest },\n  ref,\n) => {\n  const { theme } = useTheme();\n  const groupProps = useRadioGroupContext();\n  const isInsideGroup = !isEmpty(groupProps);\n\n  if (__DEV__) {\n    if (!isInsideGroup) {\n      throwBladeError({\n        moduleName: 'Radio',\n        message: 'Cannot use <Radio /> outside of <RadioGroup />',\n      });\n    }\n  }\n\n  const isChecked = groupProps?.state?.isChecked(value);\n  const defaultChecked =\n    groupProps?.defaultValue === undefined ? undefined : groupProps?.defaultValue === value;\n  const validationState = groupProps?.validationState;\n  const hasError = validationState === 'error';\n  const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n  const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n  const name = groupProps?.name;\n  const showHelpText = helpText;\n  const isReactNative = getPlatformType() === 'react-native';\n  const _size = groupProps.size ?? size;\n\n  const handleChange: OnChange = ({ isChecked, value, event }) => {\n    if (isChecked) {\n      groupProps?.state?.setValue(value!, event);\n    } else {\n      groupProps?.state?.removeValue();\n    }\n  };\n\n  const { state, ids, inputProps } = useRadio({\n    defaultChecked,\n    isChecked,\n    hasError,\n    isDisabled: _isDisabled,\n    isRequired: _isRequired,\n    name,\n    value,\n    onChange: handleChange,\n  });\n\n  // radio icon's size & margin + margin-left of SelectorTitle which is 2\n  const helpTextLeftSpacing = makeSize(radioSizes.icon[size].width + theme.spacing[3]);\n\n  return (\n    <BaseBox ref={getOuterMotionRef({ _motionMeta, ref })} {...getStyledProps(rest)}>\n      <SelectorLabel\n        componentName={MetaConstants.RadioLabel}\n        inputProps={isReactNative ? inputProps : {}}\n        testID={testID}\n      >\n        <BaseBox display=\"flex\" flexDirection=\"column\">\n          <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n            <SelectorInput\n              hoverTokens={radioHoverTokens}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              hasError={hasError}\n              inputProps={inputProps}\n              ref={getInnerMotionRef({ _motionMeta, ref })}\n              {...makeAnalyticsAttribute(rest)}\n            />\n            <RadioIcon\n              size={_size}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              isNegative={hasError}\n            />\n            {children ? (\n              <SelectorTitle size={_size} isDisabled={_isDisabled}>\n                {children}\n              </SelectorTitle>\n            ) : null}\n          </BaseBox>\n          {showHelpText && (\n            <BaseBox marginLeft={helpTextLeftSpacing}>\n              <SelectorSupportText size={_size} id={ids?.helpTextId}>\n                {helpText}\n              </SelectorSupportText>\n            </BaseBox>\n          )}\n        </BaseBox>\n      </SelectorLabel>\n    </BaseBox>\n  );\n};\n\nconst Radio = assignWithoutSideEffects(React.forwardRef(_Radio), { displayName: 'Radio' });\n\nexport type { RadioProps };\nexport { Radio };\n"],"names":["_Radio","_ref","ref","_groupProps$state","_groupProps$size","value","children","helpText","isDisabled","_ref$size","size","testID","_motionMeta","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","groupProps","useRadioGroupContext","isInsideGroup","isEmpty","__DEV__","throwBladeError","moduleName","message","isChecked","state","defaultChecked","defaultValue","undefined","validationState","hasError","_isDisabled","_isRequired","isRequired","necessityIndicator","name","showHelpText","isReactNative","getPlatformType","_size","handleChange","_ref2","event","_groupProps$state2","setValue","_groupProps$state3","removeValue","_useRadio","useRadio","onChange","ids","inputProps","helpTextLeftSpacing","makeSize","radioSizes","icon","width","spacing","_jsx","BaseBox","Object","assign","getOuterMotionRef","getStyledProps","SelectorLabel","componentName","MetaConstants","RadioLabel","_jsxs","display","flexDirection","alignItems","SelectorInput","hoverTokens","radioHoverTokens","getInnerMotionRef","makeAnalyticsAttribute","RadioIcon","isNegative","SelectorTitle","marginLeft","SelectorSupportText","id","helpTextId","Radio","assignWithoutSideEffects","React","forwardRef","displayName"],"mappings":"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"}

package/build/lib/native/components/Radio/RadioGroup/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","sources":["../../../../../../src/components/Radio/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { radioSizes } from '../radioTokens';\nimport { RadioGroupProvider } from './RadioContext';\nimport { useRadioGroup } from './useRadioGroup';\nimport BaseBox from '~components/Box/BaseBox';\nimport { FormHint, FormLabel } from '~components/Form';\nimport { SelectorGroupField } from '~components/Form/Selector/SelectorGroupField';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { useBreakpoint } from '~utils';\nimport { useTheme } from '~components/BladeProvider';\nimport type { DataAnalyticsAttribute, TestID } from '~utils/types';\nimport { makeSize } from '~utils/makeSize';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype RadioGroupProps = {\n  /**\n   * Accepts multiple radios as children\n   */\n  children: React.ReactNode;\n  /**\n   * Help text of the radio group\n   */\n  helpText?: string;\n  /**\n   * Error text of the radio group\n   * Renders when `validationState` is set to 'error'\n   *\n   * Overrides helpText\n   */\n  errorText?: string;\n  /**\n   * Sets the error state of the radioGroup\n   * If set to `error` it will render the `errorText` of the group,\n   * and propagate `invalid` prop to every radio\n   */\n  validationState?: 'error' | 'none';\n  /**\n   * Renders a necessity indicator after radioGroup label\n   *\n   * If set to `undefined` it renders nothing.\n   */\n  necessityIndicator?: 'required' | 'optional' | 'none';\n  /**\n   * Sets the disabled state of the radioGroup\n   * If set to `true` it propagate down to all the radios\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Sets the required state of the radioGroup\n   * @default false\n   */\n  isRequired?: boolean;\n  /**\n   * Renders the label of the radio group\n   */\n  label?: string;\n  /**\n   * Sets the position of the label\n   *\n   * @default 'top'\n   */\n  labelPosition?: 'top' | 'left';\n  /**\n   * Initial value of the radio group\n   */\n  defaultValue?: string;\n  /**\n   * value of the radio group\n   *\n   * Use `onChange` to update its value\n   */\n  value?: string;\n  /**\n   * The callback invoked when any of the radio's state changes\n   */\n  onChange?: ({ name, value }: { name: string | undefined; value: string }) => void;\n  /**\n   * The name of the input field in a radio\n   * (Useful for form submission).\n   */\n  name?: string;\n  /**\n   * Size of the radios\n   *\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium' | 'large';\n} & TestID &\n  DataAnalyticsAttribute &\n  StyledPropsBlade;\n\nconst RadioGroup = ({\n  children,\n  label,\n  helpText,\n  isDisabled = false,\n  isRequired = false,\n  necessityIndicator = 'none',\n  labelPosition = 'top',\n  validationState = 'none',\n  errorText,\n  name,\n  defaultValue,\n  onChange,\n  value,\n  size = 'medium',\n  testID,\n  ...rest\n}: RadioGroupProps): React.ReactElement => {\n  const { contextValue, ids } = useRadioGroup({\n    defaultValue,\n    isDisabled,\n    isRequired,\n    labelPosition,\n    name,\n    necessityIndicator,\n    onChange,\n    validationState,\n    value,\n    size,\n  });\n\n  const { theme } = useTheme();\n  const { matchedDeviceType } = useBreakpoint({ breakpoints: theme.breakpoints });\n  const showError = validationState === 'error' && errorText;\n  const showHelpText = !showError && helpText;\n  const accessibilityText = `${showError ? errorText : ''} ${showHelpText ? helpText : ''}`.trim();\n  const gap = radioSizes.group.gap[size][matchedDeviceType];\n  const childCount = React.Children.count(children);\n\n  return (\n    <RadioGroupProvider value={contextValue}>\n      <BaseBox {...getStyledProps(rest)}>\n        <SelectorGroupField\n          position={labelPosition}\n          labelledBy={ids.labelId}\n          accessibilityRole=\"radiogroup\"\n          componentName=\"radio-group\"\n          testID={testID}\n          {...makeAnalyticsAttribute(rest)}\n        >\n          {label ? (\n            <FormLabel\n              as=\"span\"\n              necessityIndicator={necessityIndicator}\n              position={labelPosition}\n              id={ids.labelId}\n              accessibilityText={accessibilityText && `,${accessibilityText}`}\n              size={size}\n            >\n              {label}\n            </FormLabel>\n          ) : null}\n          <BaseBox>\n            <BaseBox display=\"flex\" flexDirection=\"column\">\n              {React.Children.map(children, (child, index) => {\n                return (\n                  <BaseBox\n                    key={index}\n                    {...{ marginBottom: index === childCount - 1 ? makeSize(0) : gap }}\n                  >\n                    {child}\n                  </BaseBox>\n                );\n              })}\n            </BaseBox>\n            <FormHint\n              size={size}\n              type={validationState === 'error' ? 'error' : 'help'}\n              errorText={errorText}\n              helpText={helpText}\n            />\n          </BaseBox>\n        </SelectorGroupField>\n      </BaseBox>\n    </RadioGroupProvider>\n  );\n};\n\nexport type { RadioGroupProps };\nexport { RadioGroup };\n"],"names":["RadioGroup","_ref","children","label","helpText","_ref$isDisabled","isDisabled","_ref$isRequired","isRequired","_ref$necessityIndicat","necessityIndicator","_ref$labelPosition","labelPosition","_ref$validationState","validationState","errorText","name","defaultValue","onChange","value","_ref$size","size","testID","rest","_objectWithoutProperties","_excluded","_useRadioGroup","useRadioGroup","contextValue","ids","_useTheme","useTheme","theme","_useBreakpoint","useBreakpoint","breakpoints","matchedDeviceType","showError","showHelpText","accessibilityText","trim","gap","radioSizes","group","childCount","React","Children","count","_jsx","RadioGroupProvider","BaseBox","Object","assign","getStyledProps","_jsxs","SelectorGroupField","position","labelledBy","labelId","accessibilityRole","componentName","makeAnalyticsAttribute","FormLabel","as","id","display","flexDirection","map","child","index","marginBottom","makeSize","FormHint","type"],"mappings":"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"}
+{"version":3,"file":"RadioGroup.js","sources":["../../../../../../src/components/Radio/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { radioSizes } from '../radioTokens';\nimport { RadioGroupProvider } from './RadioContext';\nimport { useRadioGroup } from './useRadioGroup';\nimport BaseBox from '~components/Box/BaseBox';\nimport { FormHint, FormLabel } from '~components/Form';\nimport { SelectorGroupField } from '~components/Form/Selector/SelectorGroupField';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { useBreakpoint } from '~utils';\nimport { useTheme } from '~components/BladeProvider';\nimport type { DataAnalyticsAttribute, TestID } from '~utils/types';\nimport { makeSize } from '~utils/makeSize';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype RadioGroupProps = {\n  /**\n   * Accepts multiple radios as children\n   */\n  children: React.ReactNode;\n  /**\n   * Help text of the radio group\n   */\n  helpText?: string;\n  /**\n   * Error text of the radio group\n   * Renders when `validationState` is set to 'error'\n   *\n   * Overrides helpText\n   */\n  errorText?: string;\n  /**\n   * Sets the error state of the radioGroup\n   * If set to `error` it will render the `errorText` of the group,\n   * and propagate `invalid` prop to every radio\n   */\n  validationState?: 'error' | 'none';\n  /**\n   * Renders a necessity indicator after radioGroup label\n   *\n   * If set to `undefined` it renders nothing.\n   */\n  necessityIndicator?: 'required' | 'optional' | 'none';\n  /**\n   * Sets the disabled state of the radioGroup\n   * If set to `true` it propagate down to all the radios\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Sets the required state of the radioGroup\n   * @default false\n   */\n  isRequired?: boolean;\n  /**\n   * Renders the label of the radio group\n   */\n  label?: string;\n  /**\n   * Sets the position of the label\n   *\n   * @default 'top'\n   */\n  labelPosition?: 'top' | 'left';\n  /**\n   * Initial value of the radio group\n   */\n  defaultValue?: string;\n  /**\n   * value of the radio group\n   *\n   * Use `onChange` to update its value\n   */\n  value?: string;\n  /**\n   * The callback invoked when any of the radio's state changes\n   */\n  onChange?: ({\n    name,\n    value,\n    event,\n  }: {\n    name: string | undefined;\n    value: string;\n    event: React.ChangeEvent<HTMLInputElement>;\n  }) => void;\n  /**\n   * The name of the input field in a radio\n   * (Useful for form submission).\n   */\n  name?: string;\n  /**\n   * Size of the radios\n   *\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium' | 'large';\n} & TestID &\n  DataAnalyticsAttribute &\n  StyledPropsBlade;\n\nconst RadioGroup = ({\n  children,\n  label,\n  helpText,\n  isDisabled = false,\n  isRequired = false,\n  necessityIndicator = 'none',\n  labelPosition = 'top',\n  validationState = 'none',\n  errorText,\n  name,\n  defaultValue,\n  onChange,\n  value,\n  size = 'medium',\n  testID,\n  ...rest\n}: RadioGroupProps): React.ReactElement => {\n  const { contextValue, ids } = useRadioGroup({\n    defaultValue,\n    isDisabled,\n    isRequired,\n    labelPosition,\n    name,\n    necessityIndicator,\n    onChange,\n    validationState,\n    value,\n    size,\n  });\n\n  const { theme } = useTheme();\n  const { matchedDeviceType } = useBreakpoint({ breakpoints: theme.breakpoints });\n  const showError = validationState === 'error' && errorText;\n  const showHelpText = !showError && helpText;\n  const accessibilityText = `${showError ? errorText : ''} ${showHelpText ? helpText : ''}`.trim();\n  const gap = radioSizes.group.gap[size][matchedDeviceType];\n  const childCount = React.Children.count(children);\n\n  return (\n    <RadioGroupProvider value={contextValue}>\n      <BaseBox {...getStyledProps(rest)}>\n        <SelectorGroupField\n          position={labelPosition}\n          labelledBy={ids.labelId}\n          accessibilityRole=\"radiogroup\"\n          componentName=\"radio-group\"\n          testID={testID}\n          {...makeAnalyticsAttribute(rest)}\n        >\n          {label ? (\n            <FormLabel\n              as=\"span\"\n              necessityIndicator={necessityIndicator}\n              position={labelPosition}\n              id={ids.labelId}\n              accessibilityText={accessibilityText && `,${accessibilityText}`}\n              size={size}\n            >\n              {label}\n            </FormLabel>\n          ) : null}\n          <BaseBox>\n            <BaseBox display=\"flex\" flexDirection=\"column\">\n              {React.Children.map(children, (child, index) => {\n                return (\n                  <BaseBox\n                    key={index}\n                    {...{ marginBottom: index === childCount - 1 ? makeSize(0) : gap }}\n                  >\n                    {child}\n                  </BaseBox>\n                );\n              })}\n            </BaseBox>\n            <FormHint\n              size={size}\n              type={validationState === 'error' ? 'error' : 'help'}\n              errorText={errorText}\n              helpText={helpText}\n            />\n          </BaseBox>\n        </SelectorGroupField>\n      </BaseBox>\n    </RadioGroupProvider>\n  );\n};\n\nexport type { RadioGroupProps };\nexport { RadioGroup };\n"],"names":["RadioGroup","_ref","children","label","helpText","_ref$isDisabled","isDisabled","_ref$isRequired","isRequired","_ref$necessityIndicat","necessityIndicator","_ref$labelPosition","labelPosition","_ref$validationState","validationState","errorText","name","defaultValue","onChange","value","_ref$size","size","testID","rest","_objectWithoutProperties","_excluded","_useRadioGroup","useRadioGroup","contextValue","ids","_useTheme","useTheme","theme","_useBreakpoint","useBreakpoint","breakpoints","matchedDeviceType","showError","showHelpText","accessibilityText","trim","gap","radioSizes","group","childCount","React","Children","count","_jsx","RadioGroupProvider","BaseBox","Object","assign","getStyledProps","_jsxs","SelectorGroupField","position","labelledBy","labelId","accessibilityRole","componentName","makeAnalyticsAttribute","FormLabel","as","id","display","flexDirection","map","child","index","marginBottom","makeSize","FormHint","type"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA,SAAA,CAAA,CAAA,UAAA,CAAA,OAAA,CAAA,UAAA,CAAA,YAAA,CAAA,YAAA,CAAA,oBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,WAAA,CAAA,MAAA,CAAA,cAAA,CAAA,UAAA,CAAA,OAAA,CAAA,MAAA,CAAA,QAAA,CAAA,CAsGM,IAAAA,UAAU,CAAG,SAAbA,UAAUA,CAAAC,IAAA,CAiB2B,CAAA,IAhBzCC,QAAQ,CAAAD,IAAA,CAARC,QAAQ,CACRC,KAAK,CAAAF,IAAA,CAALE,KAAK,CACLC,QAAQ,CAAAH,IAAA,CAARG,QAAQ,CAAAC,eAAA,CAAAJ,IAAA,CACRK,UAAU,CAAVA,UAAU,CAAAD,eAAA,GAAG,KAAA,CAAA,CAAA,KAAK,CAAAA,eAAA,CAAAE,eAAA,CAAAN,IAAA,CAClBO,UAAU,CAAVA,UAAU,CAAAD,eAAA,GAAG,KAAA,CAAA,CAAA,KAAK,CAAAA,eAAA,CAAAE,qBAAA,CAAAR,IAAA,CAClBS,kBAAkB,CAAlBA,kBAAkB,CAAAD,qBAAA,GAAG,KAAA,CAAA,CAAA,MAAM,CAAAA,qBAAA,CAAAE,kBAAA,CAAAV,IAAA,CAC3BW,aAAa,CAAbA,aAAa,CAAAD,kBAAA,GAAA,KAAA,CAAA,CAAG,KAAK,CAAAA,kBAAA,CAAAE,oBAAA,CAAAZ,IAAA,CACrBa,eAAe,CAAfA,eAAe,CAAAD,oBAAA,GAAG,KAAA,CAAA,CAAA,MAAM,CAAAA,oBAAA,CACxBE,SAAS,CAAAd,IAAA,CAATc,SAAS,CACTC,IAAI,CAAAf,IAAA,CAAJe,IAAI,CACJC,YAAY,CAAAhB,IAAA,CAAZgB,YAAY,CACZC,QAAQ,CAAAjB,IAAA,CAARiB,QAAQ,CACRC,KAAK,CAAAlB,IAAA,CAALkB,KAAK,CAAAC,SAAA,CAAAnB,IAAA,CACLoB,IAAI,CAAJA,IAAI,CAAAD,SAAA,GAAA,KAAA,CAAA,CAAG,QAAQ,CAAAA,SAAA,CACfE,MAAM,CAAArB,IAAA,CAANqB,MAAM,CACHC,IAAI,CAAAC,wBAAA,CAAAvB,IAAA,CAAAwB,SAAA,CAAA,CAEP,IAAAC,cAAA,CAA8BC,aAAa,CAAC,CAC1CV,YAAY,CAAZA,YAAY,CACZX,UAAU,CAAVA,UAAU,CACVE,UAAU,CAAVA,UAAU,CACVI,aAAa,CAAbA,aAAa,CACbI,IAAI,CAAJA,IAAI,CACJN,kBAAkB,CAAlBA,kBAAkB,CAClBQ,QAAQ,CAARA,QAAQ,CACRJ,eAAe,CAAfA,eAAe,CACfK,KAAK,CAALA,KAAK,CACLE,IAAI,CAAJA,IACF,CAAC,CAAC,CAXMO,YAAY,CAAAF,cAAA,CAAZE,YAAY,CAAEC,GAAG,CAAAH,cAAA,CAAHG,GAAG,CAazB,IAAAC,SAAA,CAAkBC,QAAQ,EAAE,CAApBC,KAAK,CAAAF,SAAA,CAALE,KAAK,CACb,IAAAC,cAAA,CAA8BC,aAAa,CAAC,CAAEC,WAAW,CAAEH,KAAK,CAACG,WAAY,CAAC,CAAC,CAAvEC,iBAAiB,CAAAH,cAAA,CAAjBG,iBAAiB,CACzB,IAAMC,SAAS,CAAGvB,eAAe,GAAK,OAAO,EAAIC,SAAS,CAC1D,IAAMuB,YAAY,CAAG,CAACD,SAAS,EAAIjC,QAAQ,CAC3C,IAAMmC,iBAAiB,CAAI,CAAA,EAAEF,SAAS,CAAGtB,SAAS,CAAG,EAAG,CAAGuB,CAAAA,EAAAA,YAAY,CAAGlC,QAAQ,CAAG,EAAG,CAAA,CAAC,CAACoC,IAAI,EAAE,CAChG,IAAMC,GAAG,CAAGC,UAAU,CAACC,KAAK,CAACF,GAAG,CAACpB,IAAI,CAAC,CAACe,iBAAiB,CAAC,CACzD,IAAMQ,UAAU,CAAGC,cAAK,CAACC,QAAQ,CAACC,KAAK,CAAC7C,QAAQ,CAAC,CAEjD,OACE8C,GAAA,CAACC,kBAAkB,CAAC9B,CAAAA,KAAK,CAAES,YAAa,CAAA1B,QAAA,CACtC8C,GAAA,CAACE,OAAO,CAAAC,MAAA,CAAAC,MAAA,CAAKC,EAAAA,CAAAA,cAAc,CAAC9B,IAAI,CAAC,CAAArB,CAAAA,QAAA,CAC/BoD,IAAA,CAACC,kBAAkB,CAAAJ,MAAA,CAAAC,MAAA,CAAA,CACjBI,QAAQ,CAAE5C,aAAc,CACxB6C,UAAU,CAAE5B,GAAG,CAAC6B,OAAQ,CACxBC,iBAAiB,CAAC,YAAY,CAC9BC,aAAa,CAAC,aAAa,CAC3BtC,MAAM,CAAEA,MAAO,CACXuC,CAAAA,sBAAsB,CAACtC,IAAI,CAAC,CAAArB,CAAAA,QAAA,CAE/BC,CAAAA,KAAK,CACJ6C,GAAA,CAACc,SAAS,CAAA,CACRC,EAAE,CAAC,MAAM,CACTrD,kBAAkB,CAAEA,kBAAmB,CACvC8C,QAAQ,CAAE5C,aAAc,CACxBoD,EAAE,CAAEnC,GAAG,CAAC6B,OAAQ,CAChBnB,iBAAiB,CAAEA,iBAAiB,EAAK,IAAGA,iBAAkB,CAAA,CAAE,CAChElB,IAAI,CAAEA,IAAK,CAAAnB,QAAA,CAEVC,KAAK,CACG,CAAC,CACV,IAAI,CACRmD,IAAA,CAACJ,OAAO,EAAAhD,QAAA,CAAA,CACN8C,GAAA,CAACE,OAAO,CAAA,CAACe,OAAO,CAAC,MAAM,CAACC,aAAa,CAAC,QAAQ,CAAAhE,QAAA,CAC3C2C,cAAK,CAACC,QAAQ,CAACqB,GAAG,CAACjE,QAAQ,CAAE,SAACkE,KAAK,CAAEC,KAAK,CAAK,CAC9C,OACErB,GAAA,CAACE,OAAO,CAAA,CAEAoB,YAAY,CAAED,KAAK,GAAKzB,UAAU,CAAG,CAAC,CAAG2B,QAAQ,CAAC,CAAC,CAAC,CAAG9B,GAAG,CAAAvC,QAAA,CAE/DkE,KAAK,EAHDC,KAIE,CAAC,CAEd,CAAC,CAAC,CACK,CAAC,CACVrB,GAAA,CAACwB,QAAQ,CAAA,CACPnD,IAAI,CAAEA,IAAK,CACXoD,IAAI,CAAE3D,eAAe,GAAK,OAAO,CAAG,OAAO,CAAG,MAAO,CACrDC,SAAS,CAAEA,SAAU,CACrBX,QAAQ,CAAEA,QAAS,CACpB,CAAC,CAAA,CACK,CAAC,CACQ,CAAA,CAAA,CAAC,CACd,CAAA,CAAC,CACQ,CAAC,CAEzB;;;;"}

package/build/lib/native/components/Radio/RadioGroup/useRadioGroup.js

@@ -11,7 +11,7 @@ import '../../BottomSheet/BottomSheetStack.js';
 import 'react/jsx-runtime';
 import { useId } from '../../../utils/useId.js';
 
-var useRadioGroup=function useRadioGroup(_ref){var value=_ref.value,defaultValue=_ref.defaultValue,isDisabled=_ref.isDisabled,isRequired=_ref.isRequired,labelPosition=_ref.labelPosition,_onChange=_ref.onChange,validationState=_ref.validationState,necessityIndicator=_ref.necessityIndicator,name=_ref.name,size=_ref.size;var _useTheme=useTheme(),platform=_useTheme.platform;var idBase=useId('radio-group');var labelId=`${idBase}-label`;var fallbackName=name!=null?name:idBase;var _useControllableState=useControllableState({value:value,defaultValue:defaultValue,onChange:function onChange(v){return _onChange==null?void 0:_onChange({value:v,name:fallbackName});}}),_useControllableState2=_slicedToArray(_useControllableState,2),checkedValue=_useControllableState2[0],setValue=_useControllableState2[1];var state=React__default.useMemo(function(){return {value:checkedValue,setValue:function(_setValue){function setValue(_x){return _setValue.apply(this,arguments);}setValue.toString=function(){return _setValue.toString();};return setValue;}(function(v){if(isDisabled){return;}setValue(function(){return v;});}),removeValue:function removeValue(){if(isDisabled){return;}setValue(undefined);},isChecked:function isChecked(v){if(isUndefined(v)||isUndefined(checkedValue))return false;return checkedValue===v;}};},[checkedValue,isDisabled,setValue]);var contextValue=React__default.useMemo(function(){return {necessityIndicator:necessityIndicator,validationState:validationState,isDisabled:isDisabled,isRequired:isRequired,labelPosition:platform==='onMobile'?'top':labelPosition,name:fallbackName,state:state,size:size};},[validationState,isDisabled,isRequired,platform,labelPosition,state,fallbackName,necessityIndicator,size]);return {state:state,contextValue:contextValue,ids:{labelId:labelId}};};
+var useRadioGroup=function useRadioGroup(_ref){var value=_ref.value,defaultValue=_ref.defaultValue,isDisabled=_ref.isDisabled,isRequired=_ref.isRequired,labelPosition=_ref.labelPosition,_onChange=_ref.onChange,validationState=_ref.validationState,necessityIndicator=_ref.necessityIndicator,name=_ref.name,size=_ref.size;var _useTheme=useTheme(),platform=_useTheme.platform;var idBase=useId('radio-group');var labelId=`${idBase}-label`;var fallbackName=name!=null?name:idBase;var _useControllableState=useControllableState({value:value,defaultValue:defaultValue,onChange:function onChange(v,event){_onChange==null?void 0:_onChange({value:v,name:fallbackName,event:event});}}),_useControllableState2=_slicedToArray(_useControllableState,2),checkedValue=_useControllableState2[0],setValue=_useControllableState2[1];var state=React__default.useMemo(function(){return {value:checkedValue,setValue:function(_setValue){function setValue(_x,_x2){return _setValue.apply(this,arguments);}setValue.toString=function(){return _setValue.toString();};return setValue;}(function(v,event){if(isDisabled){return;}setValue(function(){return v;},false,event);}),removeValue:function removeValue(){if(isDisabled){return;}setValue(undefined);},isChecked:function isChecked(v){if(isUndefined(v)||isUndefined(checkedValue))return false;return checkedValue===v;}};},[checkedValue,isDisabled,setValue]);var contextValue=React__default.useMemo(function(){return {necessityIndicator:necessityIndicator,validationState:validationState,isDisabled:isDisabled,isRequired:isRequired,labelPosition:platform==='onMobile'?'top':labelPosition,name:fallbackName,state:state,size:size};},[validationState,isDisabled,isRequired,platform,labelPosition,state,fallbackName,necessityIndicator,size]);return {state:state,contextValue:contextValue,ids:{labelId:labelId}};};
 
 export { useRadioGroup };
 //# sourceMappingURL=useRadioGroup.js.map

package/build/lib/native/components/Radio/RadioGroup/useRadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRadioGroup.js","sources":["../../../../../../src/components/Radio/RadioGroup/useRadioGroup.ts"],"sourcesContent":["import React from 'react';\nimport type { RadioGroupProps } from './RadioGroup';\nimport type { RadioGroupContextType } from './RadioContext';\nimport isUndefined from '~utils/lodashButBetter/isUndefined';\nimport { useControllableState } from '~utils/useControllable';\nimport { useTheme } from '~components/BladeProvider';\nimport { useId } from '~utils/useId';\n\ntype UseRadioGroupProps = Pick<\n  RadioGroupProps,\n  | 'isDisabled'\n  | 'isRequired'\n  | 'labelPosition'\n  | 'validationState'\n  | 'name'\n  | 'value'\n  | 'defaultValue'\n  | 'onChange'\n  | 'necessityIndicator'\n  | 'size'\n>;\n\nexport type State = {\n  value: string;\n  setValue(value: string): void;\n  removeValue(): void;\n  isChecked(value: string): boolean;\n};\n\ntype UseRadioGroupReturn = {\n  state: State;\n  contextValue: RadioGroupContextType;\n  ids: { labelId: string };\n};\n\nconst useRadioGroup = ({\n  value,\n  defaultValue,\n  isDisabled,\n  isRequired,\n  labelPosition,\n  onChange,\n  validationState,\n  necessityIndicator,\n  name,\n  size,\n}: UseRadioGroupProps): UseRadioGroupReturn => {\n  const { platform } = useTheme();\n  const idBase = useId('radio-group');\n  const labelId = `${idBase}-label`;\n  const fallbackName = name ?? idBase;\n  const [checkedValue, setValue] = useControllableState({\n    value,\n    defaultValue,\n    onChange: (v: string) => onChange?.({ value: v, name: fallbackName }),\n  });\n\n  const state = React.useMemo<State>(() => {\n    return {\n      value: checkedValue,\n      setValue(v: string): void {\n        if (isDisabled) {\n          return;\n        }\n\n        setValue(() => v);\n      },\n      removeValue(): void {\n        if (isDisabled) {\n          return;\n        }\n\n        setValue(undefined!);\n      },\n      isChecked(v: string): boolean {\n        if (isUndefined(v) || isUndefined(checkedValue)) return false;\n        return checkedValue === v;\n      },\n    };\n  }, [checkedValue, isDisabled, setValue]);\n\n  const contextValue = React.useMemo<RadioGroupContextType>(() => {\n    return {\n      necessityIndicator,\n      validationState,\n      isDisabled,\n      isRequired,\n      labelPosition: platform === 'onMobile' ? 'top' : labelPosition,\n      name: fallbackName,\n      state,\n      size,\n    };\n  }, [\n    validationState,\n    isDisabled,\n    isRequired,\n    platform,\n    labelPosition,\n    state,\n    fallbackName,\n    necessityIndicator,\n    size,\n  ]);\n\n  return { state, contextValue, ids: { labelId } };\n};\n\nexport { useRadioGroup };\n"],"names":["useRadioGroup","_ref","value","defaultValue","isDisabled","isRequired","labelPosition","onChange","validationState","necessityIndicator","name","size","_useTheme","useTheme","platform","idBase","useId","labelId","fallbackName","_useControllableState","useControllableState","v","_useControllableState2","_slicedToArray","checkedValue","setValue","state","React","useMemo","_setValue","_x","apply","arguments","toString","removeValue","undefined","isChecked","isUndefined","contextValue","ids"],"mappings":"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"}
+{"version":3,"file":"useRadioGroup.js","sources":["../../../../../../src/components/Radio/RadioGroup/useRadioGroup.ts"],"sourcesContent":["import React from 'react';\nimport type { RadioGroupProps } from './RadioGroup';\nimport type { RadioGroupContextType } from './RadioContext';\nimport isUndefined from '~utils/lodashButBetter/isUndefined';\nimport { useControllableState } from '~utils/useControllable';\nimport { useTheme } from '~components/BladeProvider';\nimport { useId } from '~utils/useId';\n\ntype UseRadioGroupProps = Pick<\n  RadioGroupProps,\n  | 'isDisabled'\n  | 'isRequired'\n  | 'labelPosition'\n  | 'validationState'\n  | 'name'\n  | 'value'\n  | 'defaultValue'\n  | 'onChange'\n  | 'necessityIndicator'\n  | 'size'\n>;\n\nexport type State = {\n  value: string;\n  setValue(value: string, event: React.ChangeEvent<Element>): void;\n  removeValue(): void;\n  isChecked(value: string): boolean;\n};\n\ntype UseRadioGroupReturn = {\n  state: State;\n  contextValue: RadioGroupContextType;\n  ids: { labelId: string };\n};\n\nconst useRadioGroup = ({\n  value,\n  defaultValue,\n  isDisabled,\n  isRequired,\n  labelPosition,\n  onChange,\n  validationState,\n  necessityIndicator,\n  name,\n  size,\n}: UseRadioGroupProps): UseRadioGroupReturn => {\n  const { platform } = useTheme();\n  const idBase = useId('radio-group');\n  const labelId = `${idBase}-label`;\n  const fallbackName = name ?? idBase;\n  const [checkedValue, setValue] = useControllableState({\n    value,\n    defaultValue,\n    onChange: (v, event) => {\n      onChange?.({ value: v, name: fallbackName, event });\n    },\n  });\n\n  const state = React.useMemo<State>(() => {\n    return {\n      value: checkedValue,\n      setValue(v, event): void {\n        if (isDisabled) {\n          return;\n        }\n\n        setValue(() => v, false, event);\n      },\n      removeValue(): void {\n        if (isDisabled) {\n          return;\n        }\n\n        setValue(undefined!);\n      },\n      isChecked(v: string): boolean {\n        if (isUndefined(v) || isUndefined(checkedValue)) return false;\n        return checkedValue === v;\n      },\n    };\n  }, [checkedValue, isDisabled, setValue]);\n\n  const contextValue = React.useMemo<RadioGroupContextType>(() => {\n    return {\n      necessityIndicator,\n      validationState,\n      isDisabled,\n      isRequired,\n      labelPosition: platform === 'onMobile' ? 'top' : labelPosition,\n      name: fallbackName,\n      state,\n      size,\n    };\n  }, [\n    validationState,\n    isDisabled,\n    isRequired,\n    platform,\n    labelPosition,\n    state,\n    fallbackName,\n    necessityIndicator,\n    size,\n  ]);\n\n  return { state, contextValue, ids: { labelId } };\n};\n\nexport { useRadioGroup };\n"],"names":["useRadioGroup","_ref","value","defaultValue","isDisabled","isRequired","labelPosition","onChange","validationState","necessityIndicator","name","size","_useTheme","useTheme","platform","idBase","useId","labelId","fallbackName","_useControllableState","useControllableState","v","event","_useControllableState2","_slicedToArray","checkedValue","setValue","state","React","useMemo","_setValue","_x","_x2","apply","arguments","toString","removeValue","undefined","isChecked","isUndefined","contextValue","ids"],"mappings":"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"}

package/build/lib/native/components/Radio/useRadio.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRadio.js","sources":["../../../../../src/components/Radio/useRadio.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\nimport React from 'react';\nimport type { GestureResponderEvent } from 'react-native';\nimport { useControllableState } from '~utils/useControllable';\nimport { useId } from '~utils/useId';\nimport { getPlatformType } from '~src/utils';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { throwBladeError } from '~utils/logger';\n\nexport type OnChange = ({\n  isChecked,\n  event,\n  value,\n}: {\n  isChecked: boolean;\n  event?: React.ChangeEvent;\n  value?: string;\n}) => void;\n\ntype UseRadioProps = {\n  hasError?: boolean;\n  /**\n   * If `true`, The Radio will be checked. This also makes the Radio controlled\n   * Use `onChange` to update its value\n   *\n   * @default false\n   */\n  isChecked?: boolean;\n  /**\n   * If `true`, the Radio will be initially checked. This also makes the Radio uncontrolled\n   *\n   * @default false\n   */\n  defaultChecked?: boolean;\n  /**\n   * The callback invoked when the checked state of the `Radio` changes.\n   */\n  onChange?: OnChange;\n  /**\n   * The name of the input field in a Radio\n   * (Useful for form submission).\n   */\n  name?: string;\n  /**\n   * The value to be used in the Radio input.\n   * This is the value that will be returned on form submission.\n   */\n  value?: string;\n  /**\n   * If `true`, the Radio will be disabled\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * If `true`, the Radio input is marked as required,\n   * and `required` attribute will be added\n   *\n   * @default false\n   */\n  isRequired?: boolean;\n};\n\nconst useRadio = ({\n  isChecked,\n  defaultChecked,\n  isDisabled,\n  isRequired,\n  hasError,\n  onChange,\n  name,\n  value,\n}: UseRadioProps) => {\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const isReactNative = getPlatformType() === 'react-native';\n  if (__DEV__) {\n    if (isChecked && defaultChecked) {\n      throwBladeError({\n        message: `Do not provide both 'isChecked' and 'defaultChecked' to useRadio. Consider if you want this component to be controlled or uncontrolled.`,\n        moduleName: 'Radio',\n      });\n    }\n  }\n\n  const [radioState, setRadioState] = useControllableState({\n    value: isChecked,\n    defaultValue: defaultChecked ?? false,\n  });\n\n  const handleOnChange = (event: React.ChangeEvent<HTMLInputElement> | GestureResponderEvent) => {\n    if (isDisabled) {\n      event.stopPropagation();\n      event.preventDefault();\n      return;\n    }\n\n    setRadioState((checked) => {\n      // Prevent radio to be unchecked when clicked again\n      // Once checked radios don't act as toggle buttons\n      if (checked === false) {\n        onChange?.({\n          isChecked: true,\n          event: event as React.ChangeEvent,\n          value,\n        });\n        return true;\n      }\n      return checked;\n    });\n  };\n\n  const state = {\n    isChecked: radioState,\n    setChecked: setRadioState,\n  };\n\n  const idBase = useId('radio');\n  const helpTextId = useId(`${idBase}-helptext`);\n\n  const accessibilityProps = makeAccessible({\n    role: 'radio',\n    required: Boolean(isRequired),\n    invalid: Boolean(hasError),\n    disabled: Boolean(isDisabled),\n    checked: radioState,\n    describedBy: helpTextId,\n  });\n\n  if (isReactNative) {\n    return {\n      state,\n      inputProps: {\n        onPress: handleOnChange,\n        name,\n        value,\n        ...accessibilityProps,\n      },\n    };\n  }\n\n  return {\n    state,\n    ids: { helpTextId },\n    inputProps: {\n      ref: inputRef,\n      onChange: handleOnChange,\n      type: 'radio',\n      name,\n      value,\n      checked: radioState,\n      disabled: isDisabled,\n      required: isRequired,\n      ...accessibilityProps,\n    },\n  };\n};\n\nexport type InputProps = ReturnType<typeof useRadio>['inputProps'];\n\nexport { useRadio };\n"],"names":["useRadio","_ref","isChecked","defaultChecked","isDisabled","isRequired","hasError","onChange","name","value","inputRef","React","useRef","isReactNative","getPlatformType","__DEV__","throwBladeError","message","moduleName","_useControllableState","useControllableState","defaultValue","_useControllableState2","_slicedToArray","radioState","setRadioState","handleOnChange","event","stopPropagation","preventDefault","checked","state","setChecked","idBase","useId","helpTextId","accessibilityProps","makeAccessible","role","required","Boolean","invalid","disabled","describedBy","inputProps","Object","assign","onPress","ids","ref","type"],"mappings":"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"}
+{"version":3,"file":"useRadio.js","sources":["../../../../../src/components/Radio/useRadio.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\nimport React from 'react';\nimport type { GestureResponderEvent } from 'react-native';\nimport { useControllableState } from '~utils/useControllable';\nimport { useId } from '~utils/useId';\nimport { getPlatformType } from '~src/utils';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { throwBladeError } from '~utils/logger';\n\nexport type OnChange = ({\n  isChecked,\n  event,\n  value,\n}: {\n  isChecked: boolean;\n  event: React.ChangeEvent;\n  value?: string;\n}) => void;\n\ntype UseRadioProps = {\n  hasError?: boolean;\n  /**\n   * If `true`, The Radio will be checked. This also makes the Radio controlled\n   * Use `onChange` to update its value\n   *\n   * @default false\n   */\n  isChecked?: boolean;\n  /**\n   * If `true`, the Radio will be initially checked. This also makes the Radio uncontrolled\n   *\n   * @default false\n   */\n  defaultChecked?: boolean;\n  /**\n   * The callback invoked when the checked state of the `Radio` changes.\n   */\n  onChange?: OnChange;\n  /**\n   * The name of the input field in a Radio\n   * (Useful for form submission).\n   */\n  name?: string;\n  /**\n   * The value to be used in the Radio input.\n   * This is the value that will be returned on form submission.\n   */\n  value?: string;\n  /**\n   * If `true`, the Radio will be disabled\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * If `true`, the Radio input is marked as required,\n   * and `required` attribute will be added\n   *\n   * @default false\n   */\n  isRequired?: boolean;\n};\n\nconst useRadio = ({\n  isChecked,\n  defaultChecked,\n  isDisabled,\n  isRequired,\n  hasError,\n  onChange,\n  name,\n  value,\n}: UseRadioProps) => {\n  const inputRef = React.useRef<HTMLInputElement>(null);\n\n  const isReactNative = getPlatformType() === 'react-native';\n  if (__DEV__) {\n    if (isChecked && defaultChecked) {\n      throwBladeError({\n        message: `Do not provide both 'isChecked' and 'defaultChecked' to useRadio. Consider if you want this component to be controlled or uncontrolled.`,\n        moduleName: 'Radio',\n      });\n    }\n  }\n\n  const [radioState, setRadioState] = useControllableState({\n    value: isChecked,\n    defaultValue: defaultChecked ?? false,\n  });\n\n  const handleOnChange = (event: React.ChangeEvent<HTMLInputElement> | GestureResponderEvent) => {\n    if (isDisabled) {\n      event.stopPropagation();\n      event.preventDefault();\n      return;\n    }\n\n    setRadioState((checked) => {\n      // Prevent radio to be unchecked when clicked again\n      // Once checked radios don't act as toggle buttons\n      if (checked === false) {\n        onChange?.({\n          isChecked: true,\n          event: event as React.ChangeEvent,\n          value,\n        });\n        return true;\n      }\n      return checked;\n    });\n  };\n\n  const state = {\n    isChecked: radioState,\n    setChecked: setRadioState,\n  };\n\n  const idBase = useId('radio');\n  const helpTextId = useId(`${idBase}-helptext`);\n\n  const accessibilityProps = makeAccessible({\n    role: 'radio',\n    required: Boolean(isRequired),\n    invalid: Boolean(hasError),\n    disabled: Boolean(isDisabled),\n    checked: radioState,\n    describedBy: helpTextId,\n  });\n\n  if (isReactNative) {\n    return {\n      state,\n      inputProps: {\n        onPress: handleOnChange,\n        name,\n        value,\n        ...accessibilityProps,\n      },\n    };\n  }\n\n  return {\n    state,\n    ids: { helpTextId },\n    inputProps: {\n      ref: inputRef,\n      onChange: handleOnChange,\n      type: 'radio',\n      name,\n      value,\n      checked: radioState,\n      disabled: isDisabled,\n      required: isRequired,\n      ...accessibilityProps,\n    },\n  };\n};\n\nexport type InputProps = ReturnType<typeof useRadio>['inputProps'];\n\nexport { useRadio };\n"],"names":["useRadio","_ref","isChecked","defaultChecked","isDisabled","isRequired","hasError","onChange","name","value","inputRef","React","useRef","isReactNative","getPlatformType","__DEV__","throwBladeError","message","moduleName","_useControllableState","useControllableState","defaultValue","_useControllableState2","_slicedToArray","radioState","setRadioState","handleOnChange","event","stopPropagation","preventDefault","checked","state","setChecked","idBase","useId","helpTextId","accessibilityProps","makeAccessible","role","required","Boolean","invalid","disabled","describedBy","inputProps","Object","assign","onPress","ids","ref","type"],"mappings":"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"}

package/build/lib/native/utils/useControllable.js

@@ -2,7 +2,7 @@ import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import * as React from 'react';
 import { useCallbackRef } from './useCallbackRef.js';
 
-function useControllableState(props){var valueProp=props.value,defaultValue=props.defaultValue,onChange=props.onChange,_props$shouldUpdate=props.shouldUpdate,shouldUpdate=_props$shouldUpdate===void 0?function(prev,next){return prev!==next;}:_props$shouldUpdate;var onChangeProp=useCallbackRef(onChange);var shouldUpdateProp=useCallbackRef(shouldUpdate);var _React$useState=React.useState(defaultValue),_React$useState2=_slicedToArray(_React$useState,2),valueState=_React$useState2[0],setValue=_React$useState2[1];var _React$useRef=React.useRef(valueProp!==undefined),isControlled=_React$useRef.current;var value=isControlled&&typeof valueProp!=='undefined'?valueProp:valueState;var updateValue=useCallbackRef(function(next){var skipUpdate=arguments.length>1&&arguments[1]!==undefined?arguments[1]:false;var nextValue=next(value);if(!isControlled)setValue(nextValue);if(!shouldUpdateProp(value,nextValue))return;if(skipUpdate)return;onChangeProp==null?void 0:onChangeProp(nextValue);},[isControlled,onChangeProp,value,shouldUpdateProp]);return [value,updateValue];}
+function useControllableState(props){var valueProp=props.value,defaultValue=props.defaultValue,onChange=props.onChange,_props$shouldUpdate=props.shouldUpdate,shouldUpdate=_props$shouldUpdate===void 0?function(prev,next){return prev!==next;}:_props$shouldUpdate;var onChangeProp=useCallbackRef(onChange);var shouldUpdateProp=useCallbackRef(shouldUpdate);var _React$useState=React.useState(defaultValue),_React$useState2=_slicedToArray(_React$useState,2),valueState=_React$useState2[0],setValue=_React$useState2[1];var _React$useRef=React.useRef(valueProp!==undefined),isControlled=_React$useRef.current;var value=isControlled&&typeof valueProp!=='undefined'?valueProp:valueState;var updateValue=useCallbackRef(function(next){var skipUpdate=arguments.length>1&&arguments[1]!==undefined?arguments[1]:false;var extraData=arguments.length>2?arguments[2]:undefined;var nextValue=next(value);if(!isControlled)setValue(nextValue);if(!shouldUpdateProp(value,nextValue))return;if(skipUpdate)return;onChangeProp==null?void 0:onChangeProp(nextValue,extraData);},[isControlled,onChangeProp,value,shouldUpdateProp]);return [value,updateValue];}
 
 export { useControllableState };
 //# sourceMappingURL=useControllable.js.map

package/build/lib/native/utils/useControllable.js.map

@@ -1 +1 @@
-{"version":3,"file":"useControllable.js","sources":["../../../../src/utils/useControllable.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\n/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable react-hooks/exhaustive-deps */\nimport * as React from 'react';\nimport { useCallbackRef } from './useCallbackRef';\n\ntype ControllableStateSetter<T> = (\n  /**\n   * Sets the state to the given value\n   */\n  next: (prevState: T) => T,\n  /**\n   * If `true`, `onChange` won't be called\n   */\n  skipUpdate?: boolean,\n) => void;\n\ntype UseControllableStateProps<T> = {\n  /**\n   * The value to used in controlled mode\n   */\n  value?: T;\n  /**\n   * The initial value to be used, in uncontrolled mode\n   */\n  defaultValue?: T | (() => T);\n  /**\n   * The callback fired when the value changes\n   */\n  onChange?: (value: T) => void;\n  shouldUpdate?: (prev: T, next: T) => boolean;\n};\n\n/**\n * React hook for using controlling component state.\n *\n * It automatically handles controlled and uncontrolled state,\n * while internally giving us the state value so that we can react to the changes.\n *\n * @example\n * In checkbox we want to internally track the checked state to be able to render the correct Icon\n * but also want to provide controlled and uncontrolled behavior to user\n */\nfunction useControllableState<T>(props: UseControllableStateProps<T>) {\n  const {\n    value: valueProp,\n    defaultValue,\n    onChange,\n    shouldUpdate = (prev, next) => prev !== next,\n  } = props;\n\n  const onChangeProp = useCallbackRef(onChange);\n  const shouldUpdateProp = useCallbackRef(shouldUpdate);\n\n  const [valueState, setValue] = React.useState(defaultValue as T);\n  const { current: isControlled } = React.useRef(valueProp !== undefined);\n  const value = isControlled && typeof valueProp !== 'undefined' ? valueProp : valueState;\n\n  const updateValue: ControllableStateSetter<T> = useCallbackRef(\n    (next, skipUpdate = false) => {\n      const nextValue = next(value);\n      if (!isControlled) setValue(nextValue);\n      // We don't want to call onChange if skipUpdate is true or if the value is not changed\n      if (!shouldUpdateProp(value, nextValue)) return;\n      if (skipUpdate) return;\n      onChangeProp?.(nextValue);\n    },\n    [isControlled, onChangeProp, value, shouldUpdateProp],\n  );\n\n  return [value, updateValue] as [T, ControllableStateSetter<T>];\n}\n\nexport { useControllableState };\nexport type { ControllableStateSetter };\n"],"names":["useControllableState","props","valueProp","value","defaultValue","onChange","_props$shouldUpdate","shouldUpdate","prev","next","onChangeProp","useCallbackRef","shouldUpdateProp","_React$useState","React","useState","_React$useState2","_slicedToArray","valueState","setValue","_React$useRef","useRef","undefined","isControlled","current","updateValue","skipUpdate","arguments","length","nextValue"],"mappings":";;;;AA2CA,SAASA,oBAAoBA,CAAIC,KAAmC,CAAE,CACpE,IACSC,SAAS,CAIdD,KAAK,CAJPE,KAAK,CACLC,YAAY,CAGVH,KAAK,CAHPG,YAAY,CACZC,QAAQ,CAENJ,KAAK,CAFPI,QAAQ,CAAAC,mBAAA,CAENL,KAAK,CADPM,YAAY,CAAZA,YAAY,CAAAD,mBAAA,GAAG,KAAA,CAAA,CAAA,SAACE,IAAI,CAAEC,IAAI,CAAK,CAAA,OAAAD,IAAI,GAAKC,IAAI,CAAAH,CAAAA,CAAAA,mBAAA,CAG9C,IAAMI,YAAY,CAAGC,cAAc,CAACN,QAAQ,CAAC,CAC7C,IAAMO,gBAAgB,CAAGD,cAAc,CAACJ,YAAY,CAAC,CAErD,IAAAM,eAAA,CAA+BC,KAAK,CAACC,QAAQ,CAACX,YAAiB,CAAC,CAAAY,gBAAA,CAAAC,cAAA,CAAAJ,eAAA,CAAA,CAAA,CAAA,CAAzDK,UAAU,CAAAF,gBAAA,CAAA,CAAA,CAAA,CAAEG,QAAQ,CAAAH,gBAAA,CAC3B,CAAA,CAAA,CAAA,IAAAI,aAAA,CAAkCN,KAAK,CAACO,MAAM,CAACnB,SAAS,GAAKoB,SAAS,CAAC,CAAtDC,YAAY,CAAAH,aAAA,CAArBI,OAAO,CACf,IAAMrB,KAAK,CAAGoB,YAAY,EAAI,OAAOrB,SAAS,GAAK,WAAW,CAAGA,SAAS,CAAGgB,UAAU,CAEvF,IAAMO,WAAuC,CAAGd,cAAc,CAC5D,SAACF,IAAI,CAAyB,CAAvB,IAAAiB,UAAU,CAAAC,SAAA,CAAAC,MAAA,CAAAD,CAAAA,EAAAA,SAAA,MAAAL,SAAA,CAAAK,SAAA,CAAA,CAAA,CAAA,CAAG,KAAK,CACvB,IAAME,SAAS,CAAGpB,IAAI,CAACN,KAAK,CAAC,CAC7B,GAAI,CAACoB,YAAY,CAAEJ,QAAQ,CAACU,SAAS,CAAC,CAEtC,GAAI,CAACjB,gBAAgB,CAACT,KAAK,CAAE0B,SAAS,CAAC,CAAE,OACzC,GAAIH,UAAU,CAAE,OAChBhB,YAAY,EAAZA,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,YAAY,CAAGmB,SAAS,CAAC,CAC3B,CAAC,CACD,CAACN,YAAY,CAAEb,YAAY,CAAEP,KAAK,CAAES,gBAAgB,CACtD,CAAC,CAED,OAAO,CAACT,KAAK,CAAEsB,WAAW,CAAC,CAC7B;;;;"}
+{"version":3,"file":"useControllable.js","sources":["../../../../src/utils/useControllable.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\n/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable react-hooks/exhaustive-deps */\nimport * as React from 'react';\nimport { useCallbackRef } from './useCallbackRef';\n\ntype ControllableStateSetter<T> = (\n  /**\n   * Sets the state to the given value\n   */\n  next: (prevState: T) => T,\n  /**\n   * If `true`, `onChange` won't be called\n   */\n  skipUpdate?: boolean,\n  /**\n   * Extra data to be passed to `onChange` callback\n   * Example use case: passing event object to `onChange` callback\n   */\n  extraData?: any,\n) => void;\n\ntype UseControllableStateProps<T> = {\n  /**\n   * The value to used in controlled mode\n   */\n  value?: T;\n  /**\n   * The initial value to be used, in uncontrolled mode\n   */\n  defaultValue?: T | (() => T);\n  /**\n   * The callback fired when the value changes\n   */\n  onChange?: (value: T, extraData: any) => void;\n  shouldUpdate?: (prev: T, next: T) => boolean;\n};\n\n/**\n * React hook for using controlling component state.\n *\n * It automatically handles controlled and uncontrolled state,\n * while internally giving us the state value so that we can react to the changes.\n *\n * @example\n * In checkbox we want to internally track the checked state to be able to render the correct Icon\n * but also want to provide controlled and uncontrolled behavior to user\n */\nfunction useControllableState<T>(props: UseControllableStateProps<T>) {\n  const {\n    value: valueProp,\n    defaultValue,\n    onChange,\n    shouldUpdate = (prev, next) => prev !== next,\n  } = props;\n\n  const onChangeProp = useCallbackRef(onChange);\n  const shouldUpdateProp = useCallbackRef(shouldUpdate);\n\n  const [valueState, setValue] = React.useState(defaultValue as T);\n  const { current: isControlled } = React.useRef(valueProp !== undefined);\n  const value = isControlled && typeof valueProp !== 'undefined' ? valueProp : valueState;\n\n  const updateValue: ControllableStateSetter<T> = useCallbackRef(\n    (next, skipUpdate = false, extraData) => {\n      const nextValue = next(value);\n      if (!isControlled) setValue(nextValue);\n      // We don't want to call onChange if skipUpdate is true or if the value is not changed\n      if (!shouldUpdateProp(value, nextValue)) return;\n      if (skipUpdate) return;\n      onChangeProp?.(nextValue, extraData);\n    },\n    [isControlled, onChangeProp, value, shouldUpdateProp],\n  );\n\n  return [value, updateValue] as [T, ControllableStateSetter<T>];\n}\n\nexport { useControllableState };\nexport type { ControllableStateSetter };\n"],"names":["useControllableState","props","valueProp","value","defaultValue","onChange","_props$shouldUpdate","shouldUpdate","prev","next","onChangeProp","useCallbackRef","shouldUpdateProp","_React$useState","React","useState","_React$useState2","_slicedToArray","valueState","setValue","_React$useRef","useRef","undefined","isControlled","current","updateValue","skipUpdate","arguments","length","extraData","nextValue"],"mappings":";;;;AAiDA,SAASA,oBAAoBA,CAAIC,KAAmC,CAAE,CACpE,IACSC,SAAS,CAIdD,KAAK,CAJPE,KAAK,CACLC,YAAY,CAGVH,KAAK,CAHPG,YAAY,CACZC,QAAQ,CAENJ,KAAK,CAFPI,QAAQ,CAAAC,mBAAA,CAENL,KAAK,CADPM,YAAY,CAAZA,YAAY,CAAAD,mBAAA,GAAG,KAAA,CAAA,CAAA,SAACE,IAAI,CAAEC,IAAI,CAAA,CAAA,OAAKD,IAAI,GAAKC,IAAI,CAAAH,CAAAA,CAAAA,mBAAA,CAG9C,IAAMI,YAAY,CAAGC,cAAc,CAACN,QAAQ,CAAC,CAC7C,IAAMO,gBAAgB,CAAGD,cAAc,CAACJ,YAAY,CAAC,CAErD,IAAAM,eAAA,CAA+BC,KAAK,CAACC,QAAQ,CAACX,YAAiB,CAAC,CAAAY,gBAAA,CAAAC,cAAA,CAAAJ,eAAA,CAAzDK,CAAAA,CAAAA,CAAAA,UAAU,CAAAF,gBAAA,CAAEG,CAAAA,CAAAA,CAAAA,QAAQ,CAAAH,gBAAA,CAC3B,CAAA,CAAA,CAAA,IAAAI,aAAA,CAAkCN,KAAK,CAACO,MAAM,CAACnB,SAAS,GAAKoB,SAAS,CAAC,CAAtDC,YAAY,CAAAH,aAAA,CAArBI,OAAO,CACf,IAAMrB,KAAK,CAAGoB,YAAY,EAAI,OAAOrB,SAAS,GAAK,WAAW,CAAGA,SAAS,CAAGgB,UAAU,CAEvF,IAAMO,WAAuC,CAAGd,cAAc,CAC5D,SAACF,IAAI,CAAoC,CAAlC,IAAAiB,UAAU,CAAAC,SAAA,CAAAC,MAAA,CAAAD,CAAAA,EAAAA,SAAA,CAAAL,CAAAA,CAAAA,GAAAA,SAAA,CAAAK,SAAA,CAAG,CAAA,CAAA,CAAA,KAAK,CAAE,IAAAE,SAAS,CAAAF,SAAA,CAAAC,MAAA,CAAAD,CAAAA,CAAAA,SAAA,CAAAL,CAAAA,CAAAA,CAAAA,SAAA,CAClC,IAAMQ,SAAS,CAAGrB,IAAI,CAACN,KAAK,CAAC,CAC7B,GAAI,CAACoB,YAAY,CAAEJ,QAAQ,CAACW,SAAS,CAAC,CAEtC,GAAI,CAAClB,gBAAgB,CAACT,KAAK,CAAE2B,SAAS,CAAC,CAAE,OACzC,GAAIJ,UAAU,CAAE,OAChBhB,YAAY,EAAZA,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,YAAY,CAAGoB,SAAS,CAAED,SAAS,CAAC,CACtC,CAAC,CACD,CAACN,YAAY,CAAEb,YAAY,CAAEP,KAAK,CAAES,gBAAgB,CACtD,CAAC,CAED,OAAO,CAACT,KAAK,CAAEsB,WAAW,CAAC,CAC7B;;;;"}

package/build/lib/web/development/components/BottomSheet/BottomSheet.web.js

@@ -5,7 +5,7 @@ import React__default from 'react';
 import styled from 'styled-components';
 import { useDrag, rubberbandIfOutOfBounds } from '@use-gesture/react';
 import usePresence from 'use-presence';
-import { clearAllBodyScrollLocks } from 'body-scroll-lock-upgrade';
+import { clearAllBodyScrollLocks, enableBodyScroll } from 'body-scroll-lock-upgrade';
 export { BottomSheetHeader } from './BottomSheetHeader.web.js';
 export { BottomSheetFooter } from './BottomSheetFooter.web.js';
 export { BottomSheetBody } from './BottomSheetBody.web.js';
@@ -429,6 +429,22 @@ var _BottomSheet = function _BottomSheet(_ref2) {
     }
   }, [addBottomSheetToStack, id, isMounted, removeBottomSheetFromStack]);
 
+  // Remove the bottomsheet from the stack, if it's unmounted forcefully
+  React__default.useEffect(function () {
+    return function () {
+      if (id === undefined) return;
+      removeBottomSheetFromStack(id);
+    };
+  }, [id, removeBottomSheetFromStack]);
+
+  // Disable body scroll lock when the component is unmounted forcefully
+  React__default.useEffect(function () {
+    var lockTarget = scrollRef.current;
+    return function () {
+      enableBodyScroll(lockTarget);
+    };
+  }, []);
+
   // We will need to reset these values otherwise the next time the bottomsheet opens
   // this will be populated and the animations won't run
   // why?: because how the usePresence hook works, we actually just unmount the