@hero-design/rn-work-uikit 1.2.0 → 1.2.2

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @hero-design/rn-work-uikit
 
+## 1.2.2
+
+### Patch Changes
+
+- [#4020](https://github.com/Thinkei/hero-design/pull/4020) [`23b0c7f7744bb4972504237b57cce57da9da5a73`](https://github.com/Thinkei/hero-design/commit/23b0c7f7744bb4972504237b57cce57da9da5a73) Thanks [@cuongnguyeneh](https://github.com/cuongnguyeneh)! - [TextInput] Update testId for label of input
+
+- Updated dependencies [[`23b0c7f7744bb4972504237b57cce57da9da5a73`](https://github.com/Thinkei/hero-design/commit/23b0c7f7744bb4972504237b57cce57da9da5a73)]:
+  - @hero-design/rn@8.103.1
+
+## 1.2.1
+
+### Patch Changes
+
+- [#4007](https://github.com/Thinkei/hero-design/pull/4007) [`be4d27a22908e6e5b9dfd429f21dfbdfadaf4949`](https://github.com/Thinkei/hero-design/commit/be4d27a22908e6e5b9dfd429f21dfbdfadaf4949) Thanks [@cuongnguyeneh](https://github.com/cuongnguyeneh)! - [TextInput] Update testId of native input
+
+- [#4011](https://github.com/Thinkei/hero-design/pull/4011) [`ea8f4a15e1bc9a08c266d939e3aed2e98797b783`](https://github.com/Thinkei/hero-design/commit/ea8f4a15e1bc9a08c266d939e3aed2e98797b783) Thanks [@cuongnguyeneh](https://github.com/cuongnguyeneh)! - [TextInput] Update migration.md
+
+- Updated dependencies [[`8ba84012be721c8a18a2ba9453b6cde66f8b3e49`](https://github.com/Thinkei/hero-design/commit/8ba84012be721c8a18a2ba9453b6cde66f8b3e49), [`7e0859459ea48c43c9edcc01a64c80ab715b4d15`](https://github.com/Thinkei/hero-design/commit/7e0859459ea48c43c9edcc01a64c80ab715b4d15)]:
+  - @hero-design/rn@8.103.0
+
 ## 1.2.0
 
 ### Minor Changes
@@ -13,7 +33,7 @@
 - [#3998](https://github.com/Thinkei/hero-design/pull/3998) [`7d043a147897938f2c6d59b7716be72dfc40d168`](https://github.com/Thinkei/hero-design/commit/7d043a147897938f2c6d59b7716be72dfc40d168) Thanks [@ttkien](https://github.com/ttkien)! - [TextInput]
   - Fix issue when label is empty, should show TextInput placeholder
   - Remove un-neccessary animation of TextInput row
-- Updated dependencies [[`7d043a147897938f2c6d59b7716be72dfc40d168`](https://github.com/Thinkei/hero-design/commit/7d043a147897938f2c6d59b7716be72dfc40d168), [`28a6ab3090ec7d2a596de5c5838072b12f5c6104`](https://github.com/Thinkei/hero-design/commit/28a6ab3090ec7d2a596de5c5838072b12f5c6104), [`849b412c2d217b636342dcd42ce0f4553c446762`](https://github.com/Thinkei/hero-design/commit/849b412c2d217b636342dcd42ce0f4553c446762)]:
+- Updated dependencies [[`7d043a147897938f2c6d59b7716be72dfc40d168`](https://github.com/Thinkei/hero-design/commit/7d043a147897938f2c6d59b7716be72dfc40d168), [`28a6ab3090ec7d2a596de5c5838072b12f5c6104`](https://github.com/Thinkei/hero-design/commit/28a6ab3090ec7d2a596de5c5838072b12f5c6104), [`849b412c2d217b636342dcd42ce0f4553c446762`](https://github.com/Thinkei/hero-design/commit/849b412c2d217b636342dcd42ce0f4553c446762), [`ffaa510e9dec7177e29a3afe1b2d07c012d14fd8`](https://github.com/Thinkei/hero-design/commit/ffaa510e9dec7177e29a3afe1b2d07c012d14fd8)]:
   - @hero-design/rn@8.102.0
 
 ## 1.1.0

package/lib/index.js

@@ -1682,9 +1682,9 @@ data.forEach(function(series){series.data.forEach(function(value,idx){if(typeof
 var yMax=React__default.useMemo(function(){return Math.max.apply(Math,_toConsumableArray(xLabels.map(function(_,xIdx){return data.reduce(function(sum,series){var _series$data$xIdx;return sum+((_series$data$xIdx=series.data[xIdx])!==null&&_series$data$xIdx!==void 0?_series$data$xIdx:0);},0);})));},[data,xLabels]);var niceValues=React__default.useMemo(function(){var maxDataValue=yMax;var minDataValue=0;return createNiceScale(minDataValue,maxDataValue);},[data]);var yAxisStep=(_yAxisConfig$step=yAxisConfig===null||yAxisConfig===void 0?void 0:yAxisConfig.step)!==null&&_yAxisConfig$step!==void 0?_yAxisConfig$step:niceValues.tickSpacing;var yAxisInterval=(_yAxisConfig$tick$int=yAxisConfig===null||yAxisConfig===void 0||(_yAxisConfig$tick=yAxisConfig.tick)===null||_yAxisConfig$tick===void 0?void 0:_yAxisConfig$tick.interval)!==null&&_yAxisConfig$tick$int!==void 0?_yAxisConfig$tick$int:yAxisStep;var calculatedYAxisConfig=React__default.useMemo(function(){var _yAxisConfig$maxValue,_yAxisConfig$step2;return _objectSpread2(_objectSpread2({},yAxisConfig),{},{maxValue:(_yAxisConfig$maxValue=yAxisConfig===null||yAxisConfig===void 0?void 0:yAxisConfig.maxValue)!==null&&_yAxisConfig$maxValue!==void 0?_yAxisConfig$maxValue:niceValues.niceMax,minValue:0,step:(_yAxisConfig$step2=yAxisConfig===null||yAxisConfig===void 0?void 0:yAxisConfig.step)!==null&&_yAxisConfig$step2!==void 0?_yAxisConfig$step2:niceValues.tickSpacing,tick:{interval:yAxisInterval}});},[yAxisConfig,niceValues,yAxisInterval]);var calculatedXAxisConfig=React__default.useMemo(function(){return _objectSpread2(_objectSpread2({},xAxisConfig),{},{labels:xLabels});},[xAxisConfig,xLabels]);return/*#__PURE__*/React__default__namespace.default.createElement(StyledColumnChartWrapper,{style:style,testID:testID,onLayout:onLayout},dimensions&&/*#__PURE__*/React__default__namespace.default.createElement(ChartFrame,{isEmpty:data.length===0,xAxisConfig:calculatedXAxisConfig,yAxisConfig:calculatedYAxisConfig,headerConfig:headerConfig,width:dimensions.width,height:dimensions.height,hideXAxisGrid:true,emptyText:emptyText,renderContent:function renderContent(_ref2){var coordinates=_ref2.coordinates;return/*#__PURE__*/React__default__namespace.default.createElement(ColumnChartContent$1,{coordinates:coordinates,data:data,xAxisConfig:calculatedXAxisConfig,yAxisConfig:calculatedYAxisConfig,onBarPress:onBarPress,colorScale:colorScale});}}));};var Chart={Column:ColumnChart,Line:LineChart,SelectAction:SingleSelect$1};var StyledChipWrapper=index$b(reactNative.TouchableOpacity)(function(_ref){var themeVariant=_ref.themeVariant,themeSelected=_ref.themeSelected,theme=_ref.theme;var getShadowStyles=function getShadowStyles(){switch(themeVariant){case'compact':case'filter':return _objectSpread2({},theme.__hd__.chip.shadows.filledWrapper);case'selection':case'compact-outlined':return undefined;}};var getBorderStyles=function getBorderStyles(){switch(themeVariant){case'selection':case'compact-outlined':{return {borderColor:themeSelected?theme.__hd__.chip.colors.outlinedSelectedBorder:theme.__hd__.chip.colors.outlinedDefaultBorder,borderWidth:theme.__hd__.chip.borderWidths.outlinedDefaultBorder};}case'compact':case'filter':{return {borderColor:theme.__hd__.chip.colors.wrapperSelectedBorder};}}};var getBackgroundStyles=function getBackgroundStyles(){if(themeSelected){switch(themeVariant){case'selection':case'compact-outlined':{return {backgroundColor:themeSelected?theme.__hd__.chip.colors.outlinedSelectedBackground:theme.__hd__.chip.colors.outlinedDefaultBackground};}case'filter':case'compact':{return {backgroundColor:theme.__hd__.chip.colors.secondaryBackground};}}}else {switch(themeVariant){case'selection':case'compact-outlined':{return {backgroundColor:theme.__hd__.chip.colors.outlinedDefaultBackground};}case'filter':case'compact':{return {backgroundColor:theme.__hd__.chip.colors.filledBackground};}}}};var getPaddingStyles=function getPaddingStyles(){switch(themeVariant){case'compact':case'compact-outlined':{return {paddingHorizontal:theme.__hd__.chip.space.compactWrapperHorizontalPadding,paddingVertical:theme.__hd__.chip.space.compactWrapperVerticalPadding};}default:{return {paddingHorizontal:theme.__hd__.chip.space.wrapperHorizontalPadding,paddingVertical:theme.__hd__.chip.space.wrapperVerticalPadding};}}};return _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({alignSelf:'flex-start',flexDirection:'row',alignItems:'center',justifyContent:'center',borderRadius:theme.__hd__.chip.radii.wrapper},getShadowStyles()),getBorderStyles()),getPaddingStyles()),getBackgroundStyles());});var StyledChipIcon=index$b(Icon)(function(_ref2){var theme=_ref2.theme;return {fontSize:theme.__hd__.chip.fontSizes.icon};});var _excluded$s=["label","variant","selected","icon","onPress","showSelectedIcon"];var getChipLabel=function getChipLabel(label){if(typeof label==='string'){return/*#__PURE__*/React__default__namespace.default.createElement(Typography.Body,{variant:"small"},label);}return label;};var getChipVariant=function getChipVariant(){var variant=arguments.length>0&&arguments[0]!==undefined?arguments[0]:'selection';switch(variant){case'selection':case'filter':case'compact':case'compact-outlined':return variant;case'outlined':return 'selection';case'filled':return 'filter';}};var Chip=function Chip(_ref){var label=_ref.label,_ref$variant=_ref.variant,variant=_ref$variant===void 0?'selection':_ref$variant,_ref$selected=_ref.selected,selected=_ref$selected===void 0?false:_ref$selected,icon=_ref.icon,onPress=_ref.onPress,_ref$showSelectedIcon=_ref.showSelectedIcon,showSelectedIcon=_ref$showSelectedIcon===void 0?true:_ref$showSelectedIcon,otherProps=_objectWithoutProperties(_ref,_excluded$s);useDeprecation('Chip variant `outlined` and `filled` are deprecated.',variant==='outlined'||variant==='filled');var renamedVariant=getChipVariant(variant);var shouldShowSelectedIcon=(renamedVariant==='selection'||renamedVariant==='compact-outlined')&&selected&&showSelectedIcon;var chipLabel=React__default.useMemo(function(){return getChipLabel(label);},[label]);return/*#__PURE__*/React__default__namespace.default.createElement(StyledChipWrapper,_extends$1({onPress:onPress,themeVariant:renamedVariant,themeSelected:selected},otherProps),icon&&/*#__PURE__*/React__default__namespace.default.createElement(Box,{marginRight:"small"},/*#__PURE__*/React__default__namespace.default.createElement(StyledChipIcon,{icon:icon,testID:"chip-icon-".concat(icon)})),chipLabel,shouldShowSelectedIcon&&/*#__PURE__*/React__default__namespace.default.createElement(Box,{marginLeft:"small"},/*#__PURE__*/React__default__namespace.default.createElement(StyledChipIcon,{icon:"cancel",testID:"selected-chip-icon-cancel"})));};var StyledWrapper$8=index$b(reactNative.TouchableOpacity)(function(_ref){var theme=_ref.theme,themeState=_ref.themeState;return {flexDirection:'row',borderRadius:theme.__hd__.checkbox.radii.wrapper,borderWidth:theme.__hd__.checkbox.borderWidths.wrapper,padding:theme.__hd__.checkbox.space.wrapperPadding,borderColor:theme.__hd__.checkbox.colors.borders[themeState]};});var StyledDescription$1=index$b(Typography.Body)(function(_ref2){var theme=_ref2.theme;return {paddingRight:theme.__hd__.checkbox.space.iconDescriptionPadding,flex:1};});var StyledCheckboxContainer=index$b(reactNative.View)(function(_ref3){var theme=_ref3.theme;return {height:theme.__hd__.checkbox.sizes.icon,width:theme.__hd__.checkbox.sizes.icon,overflow:'hidden'};});var StyledCheckbox=index$b(reactNative.View)(function(_ref4){var theme=_ref4.theme,themeState=_ref4.themeState;return {flex:1,borderRadius:theme.__hd__.checkbox.radii.icon,borderWidth:theme.__hd__.checkbox.borderWidths.icon,borderColor:theme.__hd__.checkbox.colors.checkboxBorder[themeState]};});var StyledCheckMark=index$b(Icon)(function(_ref5){var theme=_ref5.theme,themeState=_ref5.themeState;return {position:'absolute',top:theme.__hd__.checkbox.space.iconTop,color:theme.__hd__.checkbox.colors.checkboxBorder[themeState]};});var getThemeState=function getThemeState(_ref){var disabled=_ref.disabled,readonly=_ref.readonly,checked=_ref.checked;if(disabled){return 'disabled';}if(readonly){return 'readonly';}if(checked){return 'checked';}return 'default';};var Checkbox=function Checkbox(_ref2){var checked=_ref2.checked,description=_ref2.description,_ref2$withBorder=_ref2.withBorder,withBorder=_ref2$withBorder===void 0?false:_ref2$withBorder,_ref2$disabled=_ref2.disabled,disabled=_ref2$disabled===void 0?false:_ref2$disabled,onPress=_ref2.onPress,style=_ref2.style,testID=_ref2.testID,_ref2$readonly=_ref2.readonly,readonly=_ref2$readonly===void 0?false:_ref2$readonly;useDeprecation("Checkbox's withBorder prop will be removed in the next major release, all checkboxes will have border by default. Please remove it.",withBorder===true);var themeState=getThemeState({disabled:disabled,readonly:readonly,checked:checked});return/*#__PURE__*/React__default__namespace.default.createElement(StyledWrapper$8,{onPress:onPress,disabled:disabled||readonly,themeState:themeState,style:style,testID:testID},!!description&&/*#__PURE__*/React__default__namespace.default.createElement(StyledDescription$1,{intent:disabled?'subdued':'body',variant:"small"},description),/*#__PURE__*/React__default__namespace.default.createElement(StyledCheckboxContainer,null,checked&&/*#__PURE__*/React__default__namespace.default.createElement(StyledCheckMark,{icon:"box-check",testID:"check-mark",themeState:themeState}),/*#__PURE__*/React__default__namespace.default.createElement(StyledCheckbox,{themeState:themeState})));};var StyledContainer$6=index$b(reactNative.View)(function(_ref){var theme=_ref.theme;return {width:'100%',marginTop:theme.__hd__.textInput.space.containerMarginTop};});var StyledLabelContainerInsideTextInput=index$b(reactNative.Animated.View)(function(_ref2){var themeVariant=_ref2.themeVariant,themeHasPrefix=_ref2.themeHasPrefix,theme=_ref2.theme;return {flexDirection:'row',alignItems:themeVariant==='text'?'center':'flex-start',position:'absolute',zIndex:1,left:themeHasPrefix?theme.space.xxlarge:theme.space.medium+theme.space.small,right:theme.space.medium,top:-theme.__hd__.textInput.space.labelTop};});var StyledLabelInsideTextInput=index$b(reactNative.View)(function(_ref3){var theme=_ref3.theme,themeState=_ref3.themeState;return {textAlignVertical:'center',alignContent:'center',alignItems:'center',color:theme.__hd__.textInput.colors.labelsInsideTextInput[themeState],marginTop:theme.__hd__.textInput.space.labelInsideTextInputMarginTop,flexDirection:'row'};});var StyledAsteriskLabelInsideTextInput=index$b(Typography.Body)(function(_ref4){var theme=_ref4.theme,themeState=_ref4.themeState;return {color:theme.__hd__.textInput.colors.asterisks[themeState]};});var StyledErrorContainer$2=index$b(reactNative.View)(function(_ref5){var theme=_ref5.theme;return {marginRight:theme.__hd__.textInput.space.errorContainerMarginRight,flexDirection:'row',alignItems:'center',flex:1,flexGrow:4};});var StyledError$1=index$b(Typography.Caption)(function(_ref6){var theme=_ref6.theme;return {color:theme.__hd__.textInput.colors.error,marginLeft:theme.__hd__.textInput.space.errorMarginLeft};});var StyledMaxLengthMessage=index$b(Typography.Caption)(function(_ref7){var theme=_ref7.theme,themeState=_ref7.themeState;return {color:theme.__hd__.textInput.colors.maxLengthLabels[themeState],flex:1,flexGrow:1,textAlign:'right'};});var StyledHelperText$1=Typography.Caption;var StyledTextInput$1=index$b(reactNative.TextInput)(function(_ref8){var theme=_ref8.theme,themeVariant=_ref8.themeVariant;return {textAlignVertical:themeVariant==='text'?'center':'top',fontSize:theme.__hd__.textInput.fontSizes.text,alignSelf:'stretch',flexGrow:2,marginHorizontal:theme.__hd__.textInput.space.inputHorizontalMargin,paddingVertical:0,maxHeight:theme.__hd__.textInput.sizes.textInputMaxHeight,height:themeVariant==='text'?undefined:theme.__hd__.textInput.sizes.textareaHeight,fontFamily:theme.__hd__.textInput.fonts.text};});var StyledBorderBackDrop=index$b(reactNative.View)(function(_ref9){var _theme$__hd__$textInp;var theme=_ref9.theme,themeFocused=_ref9.themeFocused,themeState=_ref9.themeState;return _objectSpread2(_objectSpread2({},reactNative.StyleSheet.absoluteFillObject),{},{borderWidth:themeFocused?theme.__hd__.textInput.borderWidths.container.focused:theme.__hd__.textInput.borderWidths.container.normal,borderRadius:theme.__hd__.textInput.radii.container,borderColor:(_theme$__hd__$textInp=theme.__hd__.textInput.colors.borders[themeState])!==null&&_theme$__hd__$textInp!==void 0?_theme$__hd__$textInp:theme.__hd__.textInput.colors.borders["default"]});});var StyledTextInputContainer=index$b(reactNative.View)(function(_ref10){var theme=_ref10.theme;return {flexDirection:'row',alignItems:'center',padding:theme.__hd__.textInput.space.containerPadding,backgroundColor:theme.__hd__.textInput.colors.containerBackground,borderRadius:theme.__hd__.textInput.radii.container};});var StyledTextInputAndLabelContainer=index$b(reactNative.View)(function(){return {flexDirection:'row',alignItems:'center',alignSelf:'stretch',flexGrow:2,flexShrink:1};});var StyledErrorAndHelpTextContainer=index$b(reactNative.View)(function(_ref11){var theme=_ref11.theme;return {paddingHorizontal:theme.__hd__.textInput.space.errorAndHelpTextContainerHorizontalPadding,minHeight:theme.__hd__.textInput.sizes.errorAndHelpTextContainerHeight,paddingTop:theme.__hd__.textInput.space.errorAndHelpTextContainerPaddingTop};});var StyledErrorAndMaxLengthContainer=index$b(reactNative.View)(function(){return {flexDirection:'row',justifyContent:'space-between',alignItems:'flex-start'};});var _excluded$r=["label","prefix","suffix","style","textStyle","testID","accessibilityLabelledBy","error","required","editable","disabled","loading","maxLength","hideCharacterCount","helpText","value","defaultValue","renderInputValue","allowFontScaling","variant"];var getState$3=function getState(_ref){var disabled=_ref.disabled,error=_ref.error,editable=_ref.editable,loading=_ref.loading,isEmptyValue=_ref.isEmptyValue;if(disabled){return 'disabled';}if(error){return 'error';}if(!editable||loading){return 'readonly';}if(!isEmptyValue){return 'filled';}return 'default';};// Fix issue: Placeholder is not shown on iOS when multiline is true
 // https://github.com/callstack/react-native-paper/pull/3331
 var EMPTY_PLACEHOLDER_VALUE$1=' ';var LABEL_ANIMATION_DURATION$1=150;var renderErrorOrHelpText=function renderErrorOrHelpText(_ref2){var error=_ref2.error,helpText=_ref2.helpText;return error?/*#__PURE__*/React__default__namespace.default.createElement(StyledErrorContainer$2,null,/*#__PURE__*/React__default__namespace.default.createElement(Icon,{testID:"input-error-icon",icon:"circle-info",size:"xsmall",intent:"danger"}),/*#__PURE__*/React__default__namespace.default.createElement(StyledError$1,{testID:"input-error-message"},error)):!!helpText&&/*#__PURE__*/React__default__namespace.default.createElement(StyledHelperText$1,null,helpText);};var renderInput$1=function renderInput(_ref3){var variant=_ref3.variant,nativeInputProps=_ref3.nativeInputProps,renderInputValue=_ref3.renderInputValue,ref=_ref3.ref,theme=_ref3.theme;return renderInputValue?renderInputValue(nativeInputProps):/*#__PURE__*/React__default__namespace.default.createElement(StyledTextInput$1,_extends$1({},nativeInputProps,{themeVariant:variant,multiline:variant==='textarea'||nativeInputProps.multiline,ref:ref,placeholderTextColor:theme.__hd__.textInput.colors.placeholder}));};var renderSuffix$1=function renderSuffix(_ref4){var state=_ref4.state,loading=_ref4.loading,suffix=_ref4.suffix;var actualSuffix=loading?'loading':suffix;return typeof actualSuffix==='string'?/*#__PURE__*/React__default__namespace.default.createElement(Icon,{intent:state==='disabled'?'disabled-text':'text',testID:"input-suffix",icon:actualSuffix,spin:actualSuffix==='loading',size:"medium"}):suffix;};var renderPrefix$1=function renderPrefix(_ref5){var state=_ref5.state,prefix=_ref5.prefix;return typeof prefix==='string'?/*#__PURE__*/React__default__namespace.default.createElement(Icon,{intent:state==='disabled'?'disabled-text':'text',testID:"input-prefix",icon:prefix,size:"xsmall"}):prefix;};var renderMaxLengthMessage=function renderMaxLengthMessage(_ref6){var maxLength=_ref6.maxLength,state=_ref6.state,currentLength=_ref6.currentLength,hideCharacterCount=_ref6.hideCharacterCount;var shouldShowMaxLength=maxLength!==undefined&&!hideCharacterCount;return shouldShowMaxLength&&/*#__PURE__*/React__default__namespace.default.createElement(StyledMaxLengthMessage,{themeState:state},currentLength,"/",maxLength);};var getDisplayText=function getDisplayText(value,defaultValue){var _ref7;return (_ref7=value!==undefined?value:defaultValue)!==null&&_ref7!==void 0?_ref7:'';};var TextInput$1=/*#__PURE__*/React__default.forwardRef(function(_ref8,ref){var label=_ref8.label,prefix=_ref8.prefix,suffix=_ref8.suffix,style=_ref8.style,textStyle=_ref8.textStyle,testID=_ref8.testID,accessibilityLabelledBy=_ref8.accessibilityLabelledBy,error=_ref8.error,required=_ref8.required,_ref8$editable=_ref8.editable,editable=_ref8$editable===void 0?true:_ref8$editable,_ref8$disabled=_ref8.disabled,disabled=_ref8$disabled===void 0?false:_ref8$disabled,_ref8$loading=_ref8.loading,loading=_ref8$loading===void 0?false:_ref8$loading,maxLength=_ref8.maxLength,_ref8$hideCharacterCo=_ref8.hideCharacterCount,hideCharacterCount=_ref8$hideCharacterCo===void 0?false:_ref8$hideCharacterCo,helpText=_ref8.helpText,value=_ref8.value,defaultValue=_ref8.defaultValue,renderInputValue=_ref8.renderInputValue,_ref8$allowFontScalin=_ref8.allowFontScaling,allowFontScaling=_ref8$allowFontScalin===void 0?false:_ref8$allowFontScalin,_ref8$variant=_ref8.variant,variant=_ref8$variant===void 0?'text':_ref8$variant,nativeProps=_objectWithoutProperties(_ref8,_excluded$r);var displayText=getDisplayText(value,defaultValue);var isEmptyValue=displayText.length===0;var _React$useState=React__default__namespace.default.useState({height:0,width:0}),_React$useState2=_slicedToArray(_React$useState,2),inputSize=_React$useState2[0],setInputSize=_React$useState2[1];var _React$useState3=React__default__namespace.default.useState(false),_React$useState4=_slicedToArray(_React$useState3,2),isFocused=_React$useState4[0],setIsFocused=_React$useState4[1];var state=getState$3({disabled:disabled,error:error,editable:editable,loading:loading,isFocused:isFocused,isEmptyValue:isEmptyValue});var theme=useTheme();var focusAnimation=React__default.useRef(new reactNative.Animated.Value(0)).current;React__default.useEffect(function(){reactNative.Animated.timing(focusAnimation,{toValue:isFocused||!isEmptyValue?1:0,duration:LABEL_ANIMATION_DURATION$1,easing:reactNative.Easing.bezier(0.4,0,0.2,1),useNativeDriver:true}).start();},[focusAnimation,isEmptyValue,isFocused]);var onLayout=React__default.useCallback(function(event){var _event$nativeEvent$la=event.nativeEvent.layout,height=_event$nativeEvent$la.height,width=_event$nativeEvent$la.width;setInputSize(function(prev){return _objectSpread2(_objectSpread2({},prev),{},{height:height,width:width});});},[]);var innerTextInput=React__default__namespace.default.useRef();React__default__namespace.default.useImperativeHandle(ref,function(){return {// we don't expose this method, it's for testing https://medium.com/developer-rants/how-to-test-useref-without-mocking-useref-699165f4994e
-getNativeTextInputRef:function getNativeTextInputRef(){return innerTextInput.current;},focus:function focus(){var _innerTextInput$curre;(_innerTextInput$curre=innerTextInput.current)===null||_innerTextInput$curre===void 0||_innerTextInput$curre.focus();},clear:function clear(){var _innerTextInput$curre2;return (_innerTextInput$curre2=innerTextInput.current)===null||_innerTextInput$curre2===void 0?void 0:_innerTextInput$curre2.clear();},setNativeProps:function setNativeProps(args){var _innerTextInput$curre3;return (_innerTextInput$curre3=innerTextInput.current)===null||_innerTextInput$curre3===void 0?void 0:_innerTextInput$curre3.setNativeProps(args);},isFocused:function isFocused(){var _innerTextInput$curre4;return ((_innerTextInput$curre4=innerTextInput.current)===null||_innerTextInput$curre4===void 0?void 0:_innerTextInput$curre4.isFocused())||false;},blur:function blur(){var _innerTextInput$curre5;return (_innerTextInput$curre5=innerTextInput.current)===null||_innerTextInput$curre5===void 0?void 0:_innerTextInput$curre5.blur();}};},[innerTextInput]);var _useMemo=React__default.useMemo(function(){if(!textStyle){return {};}var flattenTextStyle=reactNative.StyleSheet.flatten(textStyle);var borderKeys=Object.keys(flattenTextStyle).filter(function(key){return key.startsWith('border');});return {borderStyle:pick(borderKeys,flattenTextStyle),textStyleWithoutBorderStyle:omit(borderKeys,flattenTextStyle)};},[textStyle]),borderStyle=_useMemo.borderStyle,textStyleWithoutBorderStyle=_useMemo.textStyleWithoutBorderStyle;var _useMemo2=React__default.useMemo(function(){var _flattenTextStyle$bac;if(!style){return {backgroundColor:theme.__hd__.textInput.colors.containerBackground};}var flattenTextStyle=reactNative.StyleSheet.flatten(style);return {backgroundColor:(_flattenTextStyle$bac=flattenTextStyle.backgroundColor)!==null&&_flattenTextStyle$bac!==void 0?_flattenTextStyle$bac:theme.__hd__.textInput.colors.containerBackground,styleWithoutBackgroundColor:omit(['backgroundColor'],flattenTextStyle)};},[style,theme]),backgroundColor=_useMemo2.backgroundColor,styleWithoutBackgroundColor=_useMemo2.styleWithoutBackgroundColor;var nativeInputProps=_objectSpread2(_objectSpread2({style:reactNative.StyleSheet.flatten([{backgroundColor:backgroundColor,color:theme.__hd__.textInput.colors.text},textStyleWithoutBorderStyle]),testID:'text-input',accessibilityState:{disabled:state==='disabled'||state==='readonly'},// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+getNativeTextInputRef:function getNativeTextInputRef(){return innerTextInput.current;},focus:function focus(){var _innerTextInput$curre;(_innerTextInput$curre=innerTextInput.current)===null||_innerTextInput$curre===void 0||_innerTextInput$curre.focus();},clear:function clear(){var _innerTextInput$curre2;return (_innerTextInput$curre2=innerTextInput.current)===null||_innerTextInput$curre2===void 0?void 0:_innerTextInput$curre2.clear();},setNativeProps:function setNativeProps(args){var _innerTextInput$curre3;return (_innerTextInput$curre3=innerTextInput.current)===null||_innerTextInput$curre3===void 0?void 0:_innerTextInput$curre3.setNativeProps(args);},isFocused:function isFocused(){var _innerTextInput$curre4;return ((_innerTextInput$curre4=innerTextInput.current)===null||_innerTextInput$curre4===void 0?void 0:_innerTextInput$curre4.isFocused())||false;},blur:function blur(){var _innerTextInput$curre5;return (_innerTextInput$curre5=innerTextInput.current)===null||_innerTextInput$curre5===void 0?void 0:_innerTextInput$curre5.blur();}};},[innerTextInput]);var _useMemo=React__default.useMemo(function(){if(!textStyle){return {};}var flattenTextStyle=reactNative.StyleSheet.flatten(textStyle);var borderKeys=Object.keys(flattenTextStyle).filter(function(key){return key.startsWith('border');});return {borderStyle:pick(borderKeys,flattenTextStyle),textStyleWithoutBorderStyle:omit(borderKeys,flattenTextStyle)};},[textStyle]),borderStyle=_useMemo.borderStyle,textStyleWithoutBorderStyle=_useMemo.textStyleWithoutBorderStyle;var _useMemo2=React__default.useMemo(function(){var _flattenTextStyle$bac;if(!style){return {backgroundColor:theme.__hd__.textInput.colors.containerBackground};}var flattenTextStyle=reactNative.StyleSheet.flatten(style);return {backgroundColor:(_flattenTextStyle$bac=flattenTextStyle.backgroundColor)!==null&&_flattenTextStyle$bac!==void 0?_flattenTextStyle$bac:theme.__hd__.textInput.colors.containerBackground,styleWithoutBackgroundColor:omit(['backgroundColor'],flattenTextStyle)};},[style,theme]),backgroundColor=_useMemo2.backgroundColor,styleWithoutBackgroundColor=_useMemo2.styleWithoutBackgroundColor;var nativeInputTestIDSuffix=testID?"-".concat(testID):'';var nativeInputProps=_objectSpread2(_objectSpread2({style:reactNative.StyleSheet.flatten([{backgroundColor:backgroundColor,color:theme.__hd__.textInput.colors.text},textStyleWithoutBorderStyle]),testID:"text-input".concat(nativeInputTestIDSuffix),accessibilityState:{disabled:state==='disabled'||state==='readonly'},// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore
-accessibilityLabelledBy:accessibilityLabelledBy,allowFontScaling:allowFontScaling},nativeProps),{},{onFocus:function onFocus(event){var _nativeProps$onFocus;setIsFocused(true);(_nativeProps$onFocus=nativeProps.onFocus)===null||_nativeProps$onFocus===void 0||_nativeProps$onFocus.call(nativeProps,event);},onBlur:function onBlur(event){var _nativeProps$onBlur;setIsFocused(false);(_nativeProps$onBlur=nativeProps.onBlur)===null||_nativeProps$onBlur===void 0||_nativeProps$onBlur.call(nativeProps,event);},editable:editable,maxLength:maxLength,value:value,onChangeText:function onChangeText(text){var _nativeProps$onChange;(_nativeProps$onChange=nativeProps.onChangeText)===null||_nativeProps$onChange===void 0||_nativeProps$onChange.call(nativeProps,text);},defaultValue:defaultValue,placeholder:isFocused||label===undefined?nativeProps.placeholder:EMPTY_PLACEHOLDER_VALUE$1});return/*#__PURE__*/React__default__namespace.default.createElement(StyledContainer$6,{style:styleWithoutBackgroundColor,pointerEvents:state==='disabled'||state==='readonly'?'none':'auto',testID:testID},/*#__PURE__*/React__default__namespace.default.createElement(StyledTextInputContainer,{onLayout:onLayout},/*#__PURE__*/React__default__namespace.default.createElement(StyledBorderBackDrop,{themeFocused:isFocused,themeState:state,testID:"text-input-border",style:[{backgroundColor:backgroundColor},borderStyle]}),/*#__PURE__*/React__default__namespace.default.createElement(reactNative.View,null,renderPrefix$1({state:state,prefix:prefix})),/*#__PURE__*/React__default__namespace.default.createElement(StyledLabelContainerInsideTextInput,{themeHasPrefix:!!prefix,themeVariant:variant,pointerEvents:"none",style:[{transformOrigin:'left top'},{transform:[{translateY:focusAnimation.interpolate({inputRange:[0,1],outputRange:[variant!=='textarea'?inputSize.height/2:theme.space.large,theme.space.xsmall]})},{scale:focusAnimation.interpolate({inputRange:[0,1],outputRange:[1,0.75]})}]}]},!!label&&/*#__PURE__*/React__default__namespace.default.createElement(StyledLabelInsideTextInput,{style:{backgroundColor:backgroundColor},nativeID:accessibilityLabelledBy,testID:"input-label",themeState:state},required&&/*#__PURE__*/React__default__namespace.default.createElement(StyledAsteriskLabelInsideTextInput,{style:{backgroundColor:backgroundColor},themeState:state,testID:"input-label-asterisk"},"*"),/*#__PURE__*/React__default__namespace.default.createElement(Typography.Body,{numberOfLines:1},label))),/*#__PURE__*/React__default__namespace.default.createElement(StyledTextInputAndLabelContainer,null,renderInput$1({variant:variant,nativeInputProps:nativeInputProps,renderInputValue:renderInputValue,ref:function ref(rnTextInputRef){innerTextInput.current=rnTextInputRef;},theme:theme})),renderSuffix$1({state:state,loading:loading,suffix:suffix})),/*#__PURE__*/React__default__namespace.default.createElement(StyledErrorAndHelpTextContainer,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledErrorAndMaxLengthContainer,null,renderErrorOrHelpText({error:error,helpText:helpText}),renderMaxLengthMessage({state:state,currentLength:displayText.length,maxLength:maxLength,hideCharacterCount:hideCharacterCount}))));});var AndroidDatePickerDialog=function AndroidDatePickerDialog(_ref){var open=_ref.open,onClose=_ref.onClose,value=_ref.value,minDate=_ref.minDate,maxDate=_ref.maxDate,_onChange=_ref.onChange,testID=_ref.testID,_ref$variant=_ref.variant,variant=_ref$variant===void 0?'default':_ref$variant;var theme=useTheme();if(!open)return null;var pickerInitValue=value||new Date();return/*#__PURE__*/React__default__namespace.default.createElement(Box,{testID:testID},open&&variant==='month-year'?/*#__PURE__*/React__default__namespace.default.createElement(Box,{testID:testID},/*#__PURE__*/React__default__namespace.default.createElement(reactNativeMonthYearPicker.MonthYearPickerDialogueAndroid,{themeVariant:theme.themeMode==='dark'?'dark':'light',value:value,minimumDate:minDate,maximumDate:maxDate,onChange:function onChange(action,date){onClose();if(action==='dateSetAction'&&!!date){_onChange(date);}}})):null,open&&variant==='default'?/*#__PURE__*/React__default__namespace.default.createElement(DateTimePicker__default.default,{testID:"datePickerAndroid",mode:"date",value:pickerInitValue,minimumDate:minDate,maximumDate:maxDate,display:"default",onChange:function onChange(_,date){onClose();if(date){_onChange(date);}}}):null);};var getDateValue=function getDateValue(value,minDate,maxDate){if(minDate&&value<minDate){return minDate;}if(maxDate&&value>maxDate){return maxDate;}return value;};var useCalculateDate=function useCalculateDate(_ref){var maxDate=_ref.maxDate,minDate=_ref.minDate,onChange=_ref.onChange,value=_ref.value;React__default.useEffect(function(){var newDate=getDateValue(value||new Date(),minDate,maxDate);if(value&&newDate.toDateString()!==value.toDateString()){onChange(newDate);}},[maxDate,minDate,value]);};var locale$3={lang:'en-AU',dateTimeFormats:{fullDate:'dd/MM/yyyy'}};var LocaleContext=/*#__PURE__*/React__default.createContext(locale$3);var useLocale=function useLocale(){var context=React__default.useContext(LocaleContext);if(!context)return locale$3;return context;};var useDateTimeFormat=function useDateTimeFormat(){var _useLocale=useLocale(),dateTimeFormats=_useLocale.dateTimeFormats;var localizeDateTime=React__default.useCallback(function(key){return dateTimeFormats===null||dateTimeFormats===void 0?void 0:dateTimeFormats[key];},[dateTimeFormats]);return {localizeDateTime:localizeDateTime};};var locale$2={lang:'en-CA',dateTimeFormats:{fullDate:'MMM dd, yyyy'}};var locales={'en-AU':locale$3,'en-CA':locale$2};// Function to get the date format based on the displayFormat and locale,
+accessibilityLabelledBy:accessibilityLabelledBy,allowFontScaling:allowFontScaling},nativeProps),{},{onFocus:function onFocus(event){var _nativeProps$onFocus;setIsFocused(true);(_nativeProps$onFocus=nativeProps.onFocus)===null||_nativeProps$onFocus===void 0||_nativeProps$onFocus.call(nativeProps,event);},onBlur:function onBlur(event){var _nativeProps$onBlur;setIsFocused(false);(_nativeProps$onBlur=nativeProps.onBlur)===null||_nativeProps$onBlur===void 0||_nativeProps$onBlur.call(nativeProps,event);},editable:editable,maxLength:maxLength,value:value,onChangeText:function onChangeText(text){var _nativeProps$onChange;(_nativeProps$onChange=nativeProps.onChangeText)===null||_nativeProps$onChange===void 0||_nativeProps$onChange.call(nativeProps,text);},defaultValue:defaultValue,placeholder:isFocused||label===undefined?nativeProps.placeholder:EMPTY_PLACEHOLDER_VALUE$1});return/*#__PURE__*/React__default__namespace.default.createElement(StyledContainer$6,{style:styleWithoutBackgroundColor,pointerEvents:state==='disabled'||state==='readonly'?'none':'auto',testID:testID},/*#__PURE__*/React__default__namespace.default.createElement(StyledTextInputContainer,{onLayout:onLayout},/*#__PURE__*/React__default__namespace.default.createElement(StyledBorderBackDrop,{themeFocused:isFocused,themeState:state,testID:"text-input-border",style:[{backgroundColor:backgroundColor},borderStyle]}),/*#__PURE__*/React__default__namespace.default.createElement(reactNative.View,null,renderPrefix$1({state:state,prefix:prefix})),/*#__PURE__*/React__default__namespace.default.createElement(StyledLabelContainerInsideTextInput,{themeHasPrefix:!!prefix,themeVariant:variant,pointerEvents:"none",style:[{transformOrigin:'left top'},{transform:[{translateY:focusAnimation.interpolate({inputRange:[0,1],outputRange:[variant!=='textarea'?inputSize.height/2:theme.space.large,theme.space.xsmall]})},{scale:focusAnimation.interpolate({inputRange:[0,1],outputRange:[1,0.75]})}]}]},!!label&&/*#__PURE__*/React__default__namespace.default.createElement(StyledLabelInsideTextInput,{style:{backgroundColor:backgroundColor},nativeID:accessibilityLabelledBy,testID:"input-label".concat(nativeInputTestIDSuffix),themeState:state},required&&/*#__PURE__*/React__default__namespace.default.createElement(StyledAsteriskLabelInsideTextInput,{style:{backgroundColor:backgroundColor},themeState:state,testID:"input-label-asterisk"},"*"),/*#__PURE__*/React__default__namespace.default.createElement(Typography.Body,{testID:"input-label-text".concat(nativeInputTestIDSuffix),numberOfLines:1},label))),/*#__PURE__*/React__default__namespace.default.createElement(StyledTextInputAndLabelContainer,null,renderInput$1({variant:variant,nativeInputProps:nativeInputProps,renderInputValue:renderInputValue,ref:function ref(rnTextInputRef){innerTextInput.current=rnTextInputRef;},theme:theme})),renderSuffix$1({state:state,loading:loading,suffix:suffix})),/*#__PURE__*/React__default__namespace.default.createElement(StyledErrorAndHelpTextContainer,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledErrorAndMaxLengthContainer,null,renderErrorOrHelpText({error:error,helpText:helpText}),renderMaxLengthMessage({state:state,currentLength:displayText.length,maxLength:maxLength,hideCharacterCount:hideCharacterCount}))));});var AndroidDatePickerDialog=function AndroidDatePickerDialog(_ref){var open=_ref.open,onClose=_ref.onClose,value=_ref.value,minDate=_ref.minDate,maxDate=_ref.maxDate,_onChange=_ref.onChange,testID=_ref.testID,_ref$variant=_ref.variant,variant=_ref$variant===void 0?'default':_ref$variant;var theme=useTheme();if(!open)return null;var pickerInitValue=value||new Date();return/*#__PURE__*/React__default__namespace.default.createElement(Box,{testID:testID},open&&variant==='month-year'?/*#__PURE__*/React__default__namespace.default.createElement(Box,{testID:testID},/*#__PURE__*/React__default__namespace.default.createElement(reactNativeMonthYearPicker.MonthYearPickerDialogueAndroid,{themeVariant:theme.themeMode==='dark'?'dark':'light',value:value,minimumDate:minDate,maximumDate:maxDate,onChange:function onChange(action,date){onClose();if(action==='dateSetAction'&&!!date){_onChange(date);}}})):null,open&&variant==='default'?/*#__PURE__*/React__default__namespace.default.createElement(DateTimePicker__default.default,{testID:"datePickerAndroid",mode:"date",value:pickerInitValue,minimumDate:minDate,maximumDate:maxDate,display:"default",onChange:function onChange(_,date){onClose();if(date){_onChange(date);}}}):null);};var getDateValue=function getDateValue(value,minDate,maxDate){if(minDate&&value<minDate){return minDate;}if(maxDate&&value>maxDate){return maxDate;}return value;};var useCalculateDate=function useCalculateDate(_ref){var maxDate=_ref.maxDate,minDate=_ref.minDate,onChange=_ref.onChange,value=_ref.value;React__default.useEffect(function(){var newDate=getDateValue(value||new Date(),minDate,maxDate);if(value&&newDate.toDateString()!==value.toDateString()){onChange(newDate);}},[maxDate,minDate,value]);};var locale$3={lang:'en-AU',dateTimeFormats:{fullDate:'dd/MM/yyyy'}};var LocaleContext=/*#__PURE__*/React__default.createContext(locale$3);var useLocale=function useLocale(){var context=React__default.useContext(LocaleContext);if(!context)return locale$3;return context;};var useDateTimeFormat=function useDateTimeFormat(){var _useLocale=useLocale(),dateTimeFormats=_useLocale.dateTimeFormats;var localizeDateTime=React__default.useCallback(function(key){return dateTimeFormats===null||dateTimeFormats===void 0?void 0:dateTimeFormats[key];},[dateTimeFormats]);return {localizeDateTime:localizeDateTime};};var locale$2={lang:'en-CA',dateTimeFormats:{fullDate:'MMM dd, yyyy'}};var locales={'en-AU':locale$3,'en-CA':locale$2};// Function to get the date format based on the displayFormat and locale,
 // if no displayFormat or locale is provided, use the default fullDate format
 var getDateFormat=function getDateFormat(_ref){var displayFormat=_ref.displayFormat,locale=_ref.locale,localizeDateTime=_ref.localizeDateTime;// Prioritise displayFormat
 if(displayFormat){return displayFormat;}// If locale is provided, find the corresponding locale in the locales object
@@ -1707,7 +1707,7 @@ React__default.useEffect(function(){var backHandler=reactNative.BackHandler.addE
  * @param {ErrorProps}
  * @return {*}  {ReactElement}
  */var ErrorComponent=function ErrorComponent(_ref3){var _ref3$visible=_ref3.visible,visible=_ref3$visible===void 0?true:_ref3$visible,_ref3$variant=_ref3.variant,variant=_ref3$variant===void 0?'in-page':_ref3$variant,title=_ref3.title,description=_ref3.description,image=_ref3.image,testID=_ref3.testID,ctaText=_ref3.ctaText,onCtaPress=_ref3.onCtaPress,secondaryCtaText=_ref3.secondaryCtaText,onSecondaryCtaPress=_ref3.onSecondaryCtaPress,nativeProps=_objectWithoutProperties(_ref3,_excluded2$1);useDeprecation("Visible prop is deprecated. Use conditional rendering instead",visible);var _useState=React__default.useState(visible),_useState2=_slicedToArray(_useState,2),isVisible=_useState2[0],setIsVisible=_useState2[1];var _useState3=React__default.useState(null),_useState4=_slicedToArray(_useState3,2),ctaPressed=_useState4[0],setCtaPressed=_useState4[1];var onCloseModal=React__default.useCallback(function(){if(ctaPressed==='cta'&&onCtaPress){onCtaPress();}if(ctaPressed==='secondaryCta'&&onSecondaryCtaPress){onSecondaryCtaPress();}setCtaPressed(null);},[ctaPressed,onCtaPress,onSecondaryCtaPress]);React__default.useEffect(function(){setIsVisible(visible);},[visible]);// These useEffect lines prevents race condition error when callback contains navigation logic
-React__default.useEffect(function(){if(ctaPressed){setIsVisible(false);}},[ctaPressed]);React__default.useEffect(function(){if(!isVisible){onCloseModal();}},[isVisible,onCloseModal]);if(variant==='full-screen'){return/*#__PURE__*/React__default__namespace.default.createElement(StyledErrorModal,{visible:isVisible,onRequestClose:function onRequestClose(){return setIsVisible(false);},onDismiss:function onDismiss(){return setIsVisible(false);},animationType:"slide"},/*#__PURE__*/React__default__namespace.default.createElement(ErrorPage,_extends$1({variant:variant,title:title,description:description,image:image,testID:testID,ctaText:ctaText,onCtaPress:onCtaPress&&function(){setCtaPressed('cta');},secondaryCtaText:secondaryCtaText,onSecondaryCtaPress:onSecondaryCtaPress&&function(){setCtaPressed('secondaryCta');}},nativeProps)));}return/*#__PURE__*/React__default__namespace.default.createElement(ErrorPage,_extends$1({variant:variant,title:title,description:description,image:image,testID:testID,ctaText:ctaText,onCtaPress:onCtaPress,secondaryCtaText:secondaryCtaText,onSecondaryCtaPress:onSecondaryCtaPress},nativeProps));};var StyledActionItem=index$b(reactNative.TouchableOpacity)(function(_ref){var theme=_ref.theme;return {padding:theme.__hd__.fab.space.actionItemPadding,margin:theme.__hd__.fab.space.actionItemMargin,marginRight:theme.__hd__.fab.space.actionItemMarginRight,backgroundColor:theme.__hd__.fab.colors.actionItemBackground,borderRadius:theme.__hd__.fab.radii.actionItem,flexDirection:'row',alignItems:'center',alignSelf:'flex-end',overflow:'hidden'};});var StyledActionItemText=index$b(Typography.Body)(function(_ref2){var theme=_ref2.theme;return {color:theme.__hd__.fab.colors.actionItemText};});var StyledIcon$3=index$b(Icon)(function(_ref3){var theme=_ref3.theme;return {color:theme.__hd__.fab.colors.actionItemText};});var AnimatedTouchableHighlight=reactNative.Animated.createAnimatedComponent(reactNative.TouchableOpacity);var StyledFAB$2=index$b(AnimatedTouchableHighlight)(function(_ref){var theme=_ref.theme,themeActive=_ref.themeActive;return _objectSpread2({backgroundColor:themeActive?theme.__hd__.fab.colors.buttonActiveBackground:theme.__hd__.fab.colors.buttonBackground,borderRadius:theme.radii.rounded,alignItems:'center',justifyContent:'center',alignSelf:'flex-start',padding:theme.__hd__.fab.space.containerPadding,flexDirection:'row',height:theme.__hd__.fab.sizes.height},theme.__hd__.fab.shadows["default"]);});var StyledFABIcon=index$b(Icon)(function(_ref2){var theme=_ref2.theme;return {color:theme.__hd__.fab.colors.icon,lineHeight:theme.__hd__.fab.lineHeights.icon,textAlignVertical:'center',textAlign:'center'};});var StyledFABText=index$b(Typography.Body)(function(_ref3){var theme=_ref3.theme;return {color:theme.__hd__.fab.colors.titleText,textAlignVertical:'center',textAlign:'center',marginHorizontal:theme.__hd__.fab.space.titleMarginHorizontal};});var StyledIconContainer=index$b(Box)(function(_ref4){var theme=_ref4.theme;return {width:theme.__hd__.fab.sizes.iconContainerWidth,height:theme.__hd__.fab.sizes.iconContainerHeight,justifyContent:'center',alignItems:'center'};});var ActionItem=function ActionItem(_ref){var icon=_ref.icon,title=_ref.title,onPress=_ref.onPress,style=_ref.style,testID=_ref.testID,index=_ref.index,_ref$active=_ref.active,active=_ref$active===void 0?false:_ref$active;var animatedValue=React__default__namespace.default.useRef(new reactNative.Animated.Value(0));var translateY=animatedValue.current.interpolate({inputRange:[0,1],outputRange:[50,0]});React__default__namespace.default.useEffect(function(){reactNative.Animated.spring(animatedValue.current,{toValue:active?1:0,useNativeDriver:reactNative.Platform.OS!=='web',delay:index*30,speed:10,bounciness:10}).start();},[active,index]);return/*#__PURE__*/React__default__namespace.default.createElement(reactNative.Animated.View,{style:{transform:[{translateY:translateY}]}},/*#__PURE__*/React__default__namespace.default.createElement(StyledActionItem,{activeOpacity:0.8,style:style,onPress:onPress,testID:testID},/*#__PURE__*/React__default__namespace.default.createElement(React__default__namespace.default.Fragment,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledIconContainer,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledIcon$3,{size:"xsmall",icon:icon})),/*#__PURE__*/React__default__namespace.default.createElement(StyledActionItemText,null,title))));};var _excluded$n=["active"];var AnimatedIcons=reactNative.Animated.createAnimatedComponent(StyledFABIcon);var AnimatedFABIcon=function AnimatedFABIcon(_ref){var active=_ref.active,iconProps=_objectWithoutProperties(_ref,_excluded$n);var rotateAnimation=React__default.useRef(new reactNative.Animated.Value(active?1:0));React__default.useEffect(function(){var animation=reactNative.Animated.spring(rotateAnimation.current,{toValue:active?1:0,useNativeDriver:reactNative.Platform.OS==='ios'||reactNative.Platform.OS==='android'});animation.start();return function(){animation.stop();};},[active]);var interpolatedRotateAnimation=rotateAnimation.current.interpolate({inputRange:[0,1],outputRange:['0deg','-45deg']});return/*#__PURE__*/React__default__namespace.default.createElement(reactNative.Animated.View,{style:reactNative.StyleSheet.flatten([{transform:[{rotate:interpolatedRotateAnimation}]}])},/*#__PURE__*/React__default__namespace.default.createElement(AnimatedIcons,_extends$1({size:"xsmall"},iconProps)));};if(reactNative.Platform.OS==='android'){if(reactNative.UIManager.setLayoutAnimationEnabledExperimental){reactNative.UIManager.setLayoutAnimationEnabledExperimental(true);}}var IconOnlyContent=function IconOnlyContent(_ref){var icon=_ref.icon,animated=_ref.animated,active=_ref.active;if(animated){return/*#__PURE__*/React__default__namespace.default.createElement(StyledIconContainer,null,/*#__PURE__*/React__default__namespace.default.createElement(AnimatedFABIcon,{active:active,icon:icon,testID:"animated-fab-icon",size:"xsmall"}));}return/*#__PURE__*/React__default__namespace.default.createElement(StyledIconContainer,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledFABIcon,{size:"xsmall",icon:icon,testID:"styled-fab-icon"}));};var IconWithTextContent=function IconWithTextContent(_ref2){var icon=_ref2.icon,title=_ref2.title;return/*#__PURE__*/React__default__namespace.default.createElement(React__default__namespace.default.Fragment,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledIconContainer,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledFABIcon,{size:"xsmall",icon:icon,testID:"styled-fab-icon"})),/*#__PURE__*/React__default__namespace.default.createElement(StyledFABText,null,title));};var animateWidth=function animateWidth(){reactNative.LayoutAnimation.configureNext({duration:reactNative.Platform.OS==='ios'?200:400,update:{type:'spring',springDamping:reactNative.Platform.OS==='ios'?1:1.5}});};var FAB$1=/*#__PURE__*/React__default.forwardRef(function(_ref3,ref){var _StyleSheet$flatten,_StyleSheet$flatten2;var onPress=_ref3.onPress,title=_ref3.title,icon=_ref3.icon,animated=_ref3.animated,testID=_ref3.testID,active=_ref3.active,style=_ref3.style;var theme=useTheme();var _React$useState=React__default__namespace.default.useState({hideTitle:false,hideButton:false}),_React$useState2=_slicedToArray(_React$useState,2),displayState=_React$useState2[0],setDisplayState=_React$useState2[1];var isIconOnly=displayState.hideTitle||active||!title;var animatedValues={opacity:React__default__namespace.default.useRef(new reactNative.Animated.Value(1)).current,width:React__default__namespace.default.useRef(new reactNative.Animated.Value(1)).current,translateY:React__default__namespace.default.useRef(new reactNative.Animated.Value(0)).current};var marginBottom=Number((_StyleSheet$flatten=reactNative.StyleSheet.flatten(style))===null||_StyleSheet$flatten===void 0?void 0:_StyleSheet$flatten.marginBottom)||0;var _React$useState3=React__default__namespace.default.useState(0),_React$useState4=_slicedToArray(_React$useState3,2),buttonWidth=_React$useState4[0],setButtonWidth=_React$useState4[1];var hasSetButtonWidth=buttonWidth>0;React__default__namespace.default.useImperativeHandle(ref,function(){return {show:function show(){reactNative.Animated.spring(animatedValues.translateY,{toValue:0,useNativeDriver:true}).start();setDisplayState({hideButton:false,hideTitle:false});animateWidth();reactNative.Animated.spring(animatedValues.opacity,{toValue:1,useNativeDriver:true}).start();},collapse:function collapse(){reactNative.Animated.parallel([reactNative.Animated.spring(animatedValues.opacity,{toValue:1,useNativeDriver:true}),reactNative.Animated.spring(animatedValues.translateY,{toValue:0,useNativeDriver:true})]).start();animateWidth();setDisplayState({hideButton:false,hideTitle:true});},hide:function hide(){reactNative.Animated.stagger(20,[reactNative.Animated.spring(animatedValues.opacity,{toValue:0,useNativeDriver:true}),reactNative.Animated.spring(animatedValues.translateY,{toValue:1,useNativeDriver:true})]).start(function(){animateWidth();setDisplayState(function(previousState){return _objectSpread2(_objectSpread2({},previousState),{},{hideButton:true});});});}};},[]);return/*#__PURE__*/React__default__namespace.default.createElement(StyledFAB$2,{onLayout:function onLayout(event){return !hasSetButtonWidth&&!active&&setButtonWidth(event.nativeEvent.layout.width);},activeOpacity:0.8,onPress:onPress,style:[style,{bottom:displayState.hideButton?-(marginBottom+theme.__hd__.fab.sizes.height*2):(_StyleSheet$flatten2=reactNative.StyleSheet.flatten(style))===null||_StyleSheet$flatten2===void 0?void 0:_StyleSheet$flatten2.bottom,transform:[{translateY:animatedValues.translateY.interpolate({inputRange:[0,1],outputRange:[0,marginBottom+theme.__hd__.fab.sizes.height*2]})}]}],testID:testID,themeActive:active},/*#__PURE__*/React__default__namespace.default.createElement(reactNative.Animated.View,{style:{flexDirection:'row',opacity:animatedValues.opacity.interpolate({inputRange:[0,1],outputRange:[0,1]})}},isIconOnly?/*#__PURE__*/React__default__namespace.default.createElement(IconOnlyContent,{animated:animated,active:active,icon:active?'add':icon}):/*#__PURE__*/React__default__namespace.default.createElement(IconWithTextContent,{icon:icon,title:title})));});FAB$1.displayName='FAB';var StyledContainer$4=index$b(reactNative.View)({position:'absolute',left:0,right:0,top:0,bottom:0,alignItems:'flex-end',justifyContent:'flex-end'});var StyledContainerInModal=index$b(reactNative.View)({position:'absolute',left:0,right:0,top:0,bottom:0,alignItems:'flex-end',justifyContent:'flex-end'});var StyledActionGroupContainer=index$b(reactNative.Animated.View)({alignItems:'flex-end',justifyContent:'flex-end',width:'70%'});var StyledFAB$1=index$b(FAB$1)(function(_ref){var theme=_ref.theme;return {marginRight:theme.__hd__.fab.space.buttonMarginRight,marginTop:theme.__hd__.fab.space.buttonMarginTop,alignSelf:'flex-end'};});var StyledBackdropPressable=index$b(reactNative.Pressable)(function(){return {position:'absolute',left:0,right:0,top:0,bottom:0,backgroundColor:'transparent'};});var StyledBackdrop=index$b(Box)(function(_ref2){var theme=_ref2.theme;return {position:'absolute',left:0,right:0,top:0,bottom:0,opacity:0.4,backgroundColor:theme.__hd__.fab.colors.backdropBackground};});var ActionGroup=/*#__PURE__*/React__default.forwardRef(function(_ref,ref){var headerTitle=_ref.headerTitle,onPress=_ref.onPress,active=_ref.active,style=_ref.style,items=_ref.items,testID=_ref.testID,fabTitle=_ref.fabTitle,onBackdropPress=_ref.onBackdropPress,_ref$fabIcon=_ref.fabIcon,fabIcon=_ref$fabIcon===void 0?'add':_ref$fabIcon,_ref$supportedOrienta=_ref.supportedOrientations,supportedOrientations=_ref$supportedOrienta===void 0?['portrait']:_ref$supportedOrienta;useDeprecation("FAB.ActionGroup's headerTitle prop will be removed in the next major release. Please remove it.",headerTitle!==undefined);var theme=useTheme();var fabRef=React__default.useRef(null);var animatedValue=React__default.useRef(new reactNative.Animated.Value(active?1:0));React__default__namespace.default.useImperativeHandle(ref,function(){return {showFAB:function showFAB(){var _fabRef$current;return (_fabRef$current=fabRef.current)===null||_fabRef$current===void 0?void 0:_fabRef$current.show();},collapseFAB:function collapseFAB(){var _fabRef$current2;return (_fabRef$current2=fabRef.current)===null||_fabRef$current2===void 0?void 0:_fabRef$current2.collapse();},hideFAB:function hideFAB(){var _fabRef$current3;return (_fabRef$current3=fabRef.current)===null||_fabRef$current3===void 0?void 0:_fabRef$current3.hide();}};},[fabRef]);React__default__namespace.default.useEffect(function(){reactNative.Animated.spring(animatedValue.current,{toValue:active?1:0,delay:100,useNativeDriver:reactNative.Platform.OS!=='web'}).start();if(active){var _fabRef$current4;(_fabRef$current4=fabRef.current)===null||_fabRef$current4===void 0||_fabRef$current4.collapse();}else {var _fabRef$current5;(_fabRef$current5=fabRef.current)===null||_fabRef$current5===void 0||_fabRef$current5.show();}},[active]);var actionGroupOpacity=animatedValue.current.interpolate({inputRange:[0,1],outputRange:[0,1]});return/*#__PURE__*/React__default__namespace.default.createElement(StyledContainer$4,{testID:testID,pointerEvents:"box-none",style:style},/*#__PURE__*/React__default__namespace.default.createElement(reactNative.Animated.View,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledFAB$1,{key:"fab",testID:"fab",icon:fabIcon,onPress:onPress,animated:true,active:active,title:fabTitle,ref:fabRef})),/*#__PURE__*/React__default__namespace.default.createElement(reactNative.Modal,{visible:active,animationType:"fade",transparent:true,statusBarTranslucent:true,supportedOrientations:supportedOrientations},/*#__PURE__*/React__default__namespace.default.createElement(StyledContainerInModal,{testID:testID,style:[style]},/*#__PURE__*/React__default__namespace.default.createElement(StyledBackdropPressable,{testID:"back-drop",onPress:onBackdropPress},active&&/*#__PURE__*/React__default__namespace.default.createElement(Portal$1,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledBackdrop,null))),/*#__PURE__*/React__default__namespace.default.createElement(StyledActionGroupContainer,{testID:"action-group",pointerEvents:"box-none",style:{opacity:actionGroupOpacity}},/*#__PURE__*/React__default__namespace.default.createElement(Box,{style:{paddingBottom:0}},items===null||items===void 0?void 0:items.map(function(itemProp,index){return/*#__PURE__*/React__default__namespace.default.createElement(ActionItem,_extends$1({key:itemProp.key||"".concat(itemProp.icon,"_").concat(itemProp.title)},itemProp,{index:active?index:items.length-index,active:active}));}))),active&&/*#__PURE__*/React__default__namespace.default.createElement(StyledFAB$1// This FAB is moved up a bit compared to the original FAB,
+React__default.useEffect(function(){if(ctaPressed){setIsVisible(false);}},[ctaPressed]);React__default.useEffect(function(){if(!isVisible){onCloseModal();}},[isVisible,onCloseModal]);if(variant==='full-screen'){return/*#__PURE__*/React__default__namespace.default.createElement(StyledErrorModal,{visible:isVisible,onRequestClose:function onRequestClose(){return setIsVisible(false);},onDismiss:function onDismiss(){return setIsVisible(false);},animationType:"slide"},/*#__PURE__*/React__default__namespace.default.createElement(ErrorPage,_extends$1({variant:variant,title:title,description:description,image:image,testID:testID,ctaText:ctaText,onCtaPress:onCtaPress&&function(){setCtaPressed('cta');},secondaryCtaText:secondaryCtaText,onSecondaryCtaPress:onSecondaryCtaPress&&function(){setCtaPressed('secondaryCta');}},nativeProps)));}return/*#__PURE__*/React__default__namespace.default.createElement(ErrorPage,_extends$1({variant:variant,title:title,description:description,image:image,testID:testID,ctaText:ctaText,onCtaPress:onCtaPress,secondaryCtaText:secondaryCtaText,onSecondaryCtaPress:onSecondaryCtaPress},nativeProps));};var StyledActionItem=index$b(reactNative.TouchableOpacity)(function(_ref){var theme=_ref.theme;return {padding:theme.__hd__.fab.space.actionItemPadding,margin:theme.__hd__.fab.space.actionItemMargin,marginRight:theme.__hd__.fab.space.actionItemMarginRight,backgroundColor:theme.__hd__.fab.colors.actionItemBackground,borderRadius:theme.__hd__.fab.radii.actionItem,flexDirection:'row',alignItems:'center',alignSelf:'flex-end',overflow:'hidden'};});var StyledActionItemText=index$b(Typography.Body)(function(_ref2){var theme=_ref2.theme;return {color:theme.__hd__.fab.colors.actionItemText};});var StyledIcon$3=index$b(Icon)(function(_ref3){var theme=_ref3.theme;return {color:theme.__hd__.fab.colors.actionItemText};});var AnimatedTouchableHighlight=reactNative.Animated.createAnimatedComponent(reactNative.TouchableOpacity);var StyledFAB$2=index$b(AnimatedTouchableHighlight)(function(_ref){var theme=_ref.theme,themeActive=_ref.themeActive;return _objectSpread2({backgroundColor:themeActive?theme.__hd__.fab.colors.buttonActiveBackground:theme.__hd__.fab.colors.buttonBackground,borderRadius:theme.radii.rounded,alignItems:'center',justifyContent:'center',alignSelf:'flex-start',padding:theme.__hd__.fab.space.containerPadding,flexDirection:'row',height:theme.__hd__.fab.sizes.height},theme.__hd__.fab.shadows["default"]);});var StyledFABIcon=index$b(Icon)(function(_ref2){var theme=_ref2.theme;return {color:theme.__hd__.fab.colors.icon,lineHeight:theme.__hd__.fab.lineHeights.icon,textAlignVertical:'center',textAlign:'center'};});var StyledFABText=index$b(Typography.Body)(function(_ref3){var theme=_ref3.theme;return {color:theme.__hd__.fab.colors.titleText,textAlignVertical:'center',textAlign:'center',marginHorizontal:theme.__hd__.fab.space.titleMarginHorizontal};});var StyledIconContainer=index$b(Box)(function(_ref4){var theme=_ref4.theme;return {width:theme.__hd__.fab.sizes.iconContainerWidth,height:theme.__hd__.fab.sizes.iconContainerHeight,justifyContent:'center',alignItems:'center'};});var ActionItem=function ActionItem(_ref){var icon=_ref.icon,title=_ref.title,onPress=_ref.onPress,style=_ref.style,testID=_ref.testID,index=_ref.index,_ref$active=_ref.active,active=_ref$active===void 0?false:_ref$active;var animatedValue=React__default__namespace.default.useRef(new reactNative.Animated.Value(0));var translateY=animatedValue.current.interpolate({inputRange:[0,1],outputRange:[50,0]});React__default__namespace.default.useEffect(function(){reactNative.Animated.spring(animatedValue.current,{toValue:active?1:0,useNativeDriver:reactNative.Platform.OS!=='web',delay:index*30,speed:10,bounciness:10}).start();},[active,index]);return/*#__PURE__*/React__default__namespace.default.createElement(reactNative.Animated.View,{style:{transform:[{translateY:translateY}]}},/*#__PURE__*/React__default__namespace.default.createElement(StyledActionItem,{activeOpacity:0.8,style:style,onPress:onPress,testID:testID},/*#__PURE__*/React__default__namespace.default.createElement(React__default__namespace.default.Fragment,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledIconContainer,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledIcon$3,{size:"xsmall",icon:icon})),/*#__PURE__*/React__default__namespace.default.createElement(StyledActionItemText,null,title))));};var _excluded$n=["active"];var AnimatedIcons=reactNative.Animated.createAnimatedComponent(/*#__PURE__*/React__default__namespace.default.forwardRef(function(props,_){return/*#__PURE__*/React__default__namespace.default.createElement(StyledFABIcon,props);}));var AnimatedFABIcon=function AnimatedFABIcon(_ref){var active=_ref.active,iconProps=_objectWithoutProperties(_ref,_excluded$n);var rotateAnimation=React__default.useRef(new reactNative.Animated.Value(active?1:0));React__default.useEffect(function(){var animation=reactNative.Animated.spring(rotateAnimation.current,{toValue:active?1:0,useNativeDriver:reactNative.Platform.OS==='ios'||reactNative.Platform.OS==='android'});animation.start();return function(){animation.stop();};},[active]);var interpolatedRotateAnimation=rotateAnimation.current.interpolate({inputRange:[0,1],outputRange:['0deg','-45deg']});return/*#__PURE__*/React__default__namespace.default.createElement(reactNative.Animated.View,{style:reactNative.StyleSheet.flatten([{transform:[{rotate:interpolatedRotateAnimation}]}])},/*#__PURE__*/React__default__namespace.default.createElement(AnimatedIcons,_extends$1({size:"xsmall"},iconProps)));};if(reactNative.Platform.OS==='android'){if(reactNative.UIManager.setLayoutAnimationEnabledExperimental){reactNative.UIManager.setLayoutAnimationEnabledExperimental(true);}}var IconOnlyContent=function IconOnlyContent(_ref){var icon=_ref.icon,animated=_ref.animated,active=_ref.active;if(animated){return/*#__PURE__*/React__default__namespace.default.createElement(StyledIconContainer,null,/*#__PURE__*/React__default__namespace.default.createElement(AnimatedFABIcon,{active:active,icon:icon,testID:"animated-fab-icon",size:"xsmall"}));}return/*#__PURE__*/React__default__namespace.default.createElement(StyledIconContainer,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledFABIcon,{size:"xsmall",icon:icon,testID:"styled-fab-icon"}));};var IconWithTextContent=function IconWithTextContent(_ref2){var icon=_ref2.icon,title=_ref2.title;return/*#__PURE__*/React__default__namespace.default.createElement(React__default__namespace.default.Fragment,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledIconContainer,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledFABIcon,{size:"xsmall",icon:icon,testID:"styled-fab-icon"})),/*#__PURE__*/React__default__namespace.default.createElement(StyledFABText,null,title));};var animateWidth=function animateWidth(){reactNative.LayoutAnimation.configureNext({duration:reactNative.Platform.OS==='ios'?200:400,update:{type:'spring',springDamping:reactNative.Platform.OS==='ios'?1:1.5}});};var FAB$1=/*#__PURE__*/React__default.forwardRef(function(_ref3,ref){var _StyleSheet$flatten,_StyleSheet$flatten2;var onPress=_ref3.onPress,title=_ref3.title,icon=_ref3.icon,animated=_ref3.animated,testID=_ref3.testID,active=_ref3.active,style=_ref3.style;var theme=useTheme();var _React$useState=React__default__namespace.default.useState({hideTitle:false,hideButton:false}),_React$useState2=_slicedToArray(_React$useState,2),displayState=_React$useState2[0],setDisplayState=_React$useState2[1];var isIconOnly=displayState.hideTitle||active||!title;var animatedValues={opacity:React__default__namespace.default.useRef(new reactNative.Animated.Value(1)).current,width:React__default__namespace.default.useRef(new reactNative.Animated.Value(1)).current,translateY:React__default__namespace.default.useRef(new reactNative.Animated.Value(0)).current};var marginBottom=Number((_StyleSheet$flatten=reactNative.StyleSheet.flatten(style))===null||_StyleSheet$flatten===void 0?void 0:_StyleSheet$flatten.marginBottom)||0;var _React$useState3=React__default__namespace.default.useState(0),_React$useState4=_slicedToArray(_React$useState3,2),buttonWidth=_React$useState4[0],setButtonWidth=_React$useState4[1];var hasSetButtonWidth=buttonWidth>0;React__default__namespace.default.useImperativeHandle(ref,function(){return {show:function show(){reactNative.Animated.spring(animatedValues.translateY,{toValue:0,useNativeDriver:true}).start();setDisplayState({hideButton:false,hideTitle:false});animateWidth();reactNative.Animated.spring(animatedValues.opacity,{toValue:1,useNativeDriver:true}).start();},collapse:function collapse(){reactNative.Animated.parallel([reactNative.Animated.spring(animatedValues.opacity,{toValue:1,useNativeDriver:true}),reactNative.Animated.spring(animatedValues.translateY,{toValue:0,useNativeDriver:true})]).start();animateWidth();setDisplayState({hideButton:false,hideTitle:true});},hide:function hide(){reactNative.Animated.stagger(20,[reactNative.Animated.spring(animatedValues.opacity,{toValue:0,useNativeDriver:true}),reactNative.Animated.spring(animatedValues.translateY,{toValue:1,useNativeDriver:true})]).start(function(){animateWidth();setDisplayState(function(previousState){return _objectSpread2(_objectSpread2({},previousState),{},{hideButton:true});});});}};},[]);return/*#__PURE__*/React__default__namespace.default.createElement(StyledFAB$2,{onLayout:function onLayout(event){return !hasSetButtonWidth&&!active&&setButtonWidth(event.nativeEvent.layout.width);},activeOpacity:0.8,onPress:onPress,style:[style,{bottom:displayState.hideButton?-(marginBottom+theme.__hd__.fab.sizes.height*2):(_StyleSheet$flatten2=reactNative.StyleSheet.flatten(style))===null||_StyleSheet$flatten2===void 0?void 0:_StyleSheet$flatten2.bottom,transform:[{translateY:animatedValues.translateY.interpolate({inputRange:[0,1],outputRange:[0,marginBottom+theme.__hd__.fab.sizes.height*2]})}]}],testID:testID,themeActive:active},/*#__PURE__*/React__default__namespace.default.createElement(reactNative.Animated.View,{style:{flexDirection:'row',opacity:animatedValues.opacity.interpolate({inputRange:[0,1],outputRange:[0,1]})}},isIconOnly?/*#__PURE__*/React__default__namespace.default.createElement(IconOnlyContent,{animated:animated,active:active,icon:active?'add':icon}):/*#__PURE__*/React__default__namespace.default.createElement(IconWithTextContent,{icon:icon,title:title})));});FAB$1.displayName='FAB';var StyledContainer$4=index$b(reactNative.View)({position:'absolute',left:0,right:0,top:0,bottom:0,alignItems:'flex-end',justifyContent:'flex-end'});var StyledContainerInModal=index$b(reactNative.View)({position:'absolute',left:0,right:0,top:0,bottom:0,alignItems:'flex-end',justifyContent:'flex-end'});var StyledActionGroupContainer=index$b(reactNative.Animated.View)({alignItems:'flex-end',justifyContent:'flex-end',width:'70%'});var StyledFAB$1=index$b(FAB$1)(function(_ref){var theme=_ref.theme;return {marginRight:theme.__hd__.fab.space.buttonMarginRight,marginTop:theme.__hd__.fab.space.buttonMarginTop,alignSelf:'flex-end'};});var StyledBackdropPressable=index$b(reactNative.Pressable)(function(){return {position:'absolute',left:0,right:0,top:0,bottom:0,backgroundColor:'transparent'};});var StyledBackdrop=index$b(Box)(function(_ref2){var theme=_ref2.theme;return {position:'absolute',left:0,right:0,top:0,bottom:0,opacity:0.4,backgroundColor:theme.__hd__.fab.colors.backdropBackground};});var ActionGroup=/*#__PURE__*/React__default.forwardRef(function(_ref,ref){var headerTitle=_ref.headerTitle,onPress=_ref.onPress,active=_ref.active,style=_ref.style,items=_ref.items,testID=_ref.testID,fabTitle=_ref.fabTitle,onBackdropPress=_ref.onBackdropPress,_ref$fabIcon=_ref.fabIcon,fabIcon=_ref$fabIcon===void 0?'add':_ref$fabIcon,_ref$supportedOrienta=_ref.supportedOrientations,supportedOrientations=_ref$supportedOrienta===void 0?['portrait']:_ref$supportedOrienta;useDeprecation("FAB.ActionGroup's headerTitle prop will be removed in the next major release. Please remove it.",headerTitle!==undefined);var theme=useTheme();var fabRef=React__default.useRef(null);var animatedValue=React__default.useRef(new reactNative.Animated.Value(active?1:0));React__default__namespace.default.useImperativeHandle(ref,function(){return {showFAB:function showFAB(){var _fabRef$current;return (_fabRef$current=fabRef.current)===null||_fabRef$current===void 0?void 0:_fabRef$current.show();},collapseFAB:function collapseFAB(){var _fabRef$current2;return (_fabRef$current2=fabRef.current)===null||_fabRef$current2===void 0?void 0:_fabRef$current2.collapse();},hideFAB:function hideFAB(){var _fabRef$current3;return (_fabRef$current3=fabRef.current)===null||_fabRef$current3===void 0?void 0:_fabRef$current3.hide();}};},[fabRef]);React__default__namespace.default.useEffect(function(){reactNative.Animated.spring(animatedValue.current,{toValue:active?1:0,delay:100,useNativeDriver:reactNative.Platform.OS!=='web'}).start();if(active){var _fabRef$current4;(_fabRef$current4=fabRef.current)===null||_fabRef$current4===void 0||_fabRef$current4.collapse();}else {var _fabRef$current5;(_fabRef$current5=fabRef.current)===null||_fabRef$current5===void 0||_fabRef$current5.show();}},[active]);var actionGroupOpacity=animatedValue.current.interpolate({inputRange:[0,1],outputRange:[0,1]});return/*#__PURE__*/React__default__namespace.default.createElement(StyledContainer$4,{testID:testID,pointerEvents:"box-none",style:style},/*#__PURE__*/React__default__namespace.default.createElement(reactNative.Animated.View,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledFAB$1,{key:"fab",testID:"fab",icon:fabIcon,onPress:onPress,animated:true,active:active,title:fabTitle,ref:fabRef})),/*#__PURE__*/React__default__namespace.default.createElement(reactNative.Modal,{visible:active,animationType:"fade",transparent:true,statusBarTranslucent:true,supportedOrientations:supportedOrientations},/*#__PURE__*/React__default__namespace.default.createElement(StyledContainerInModal,{testID:testID,style:[style]},/*#__PURE__*/React__default__namespace.default.createElement(StyledBackdropPressable,{testID:"back-drop",onPress:onBackdropPress},active&&/*#__PURE__*/React__default__namespace.default.createElement(Portal$1,null,/*#__PURE__*/React__default__namespace.default.createElement(StyledBackdrop,null))),/*#__PURE__*/React__default__namespace.default.createElement(StyledActionGroupContainer,{testID:"action-group",pointerEvents:"box-none",style:{opacity:actionGroupOpacity}},/*#__PURE__*/React__default__namespace.default.createElement(Box,{style:{paddingBottom:0}},items===null||items===void 0?void 0:items.map(function(itemProp,index){return/*#__PURE__*/React__default__namespace.default.createElement(ActionItem,_extends$1({key:itemProp.key||"".concat(itemProp.icon,"_").concat(itemProp.title)},itemProp,{index:active?index:items.length-index,active:active}));}))),active&&/*#__PURE__*/React__default__namespace.default.createElement(StyledFAB$1// This FAB is moved up a bit compared to the original FAB,
 // set marginBottom to negative value to compensate for it
 ,{style:{marginBottom:-theme.space.xxsmall},key:"fab-in-portal",testID:"fab-in-portal",icon:fabIcon,onPress:onPress,animated:true,active:active,title:fabTitle}))));});ActionGroup.displayName='FAB.ActionGroup';var StyledFABPairWrapper=index$b(Box)({flexDirection:'row',justifyContent:'center',alignItems:'center'});var StyledFAB=index$b(FAB$1)(function(_ref){var theme=_ref.theme,_ref$iconOnly=_ref.iconOnly,iconOnly=_ref$iconOnly===void 0?false:_ref$iconOnly,_ref$isLast=_ref.isLast,isLast=_ref$isLast===void 0?false:_ref$isLast;return {height:theme.__hd__.fab.sizes.fabPairHeight,width:iconOnly?theme.__hd__.fab.sizes.fabPairIconOnlyWidth:undefined,marginRight:isLast?undefined:theme.__hd__.fab.space.fabPairMarginRight};});var _excluded$m=["fabConfig","onCancel"];var Pair=function Pair(_ref){var fabConfig=_ref.fabConfig,onCancel=_ref.onCancel,props=_objectWithoutProperties(_ref,_excluded$m);var icon=fabConfig.icon,title=fabConfig.title,onPress=fabConfig.onPress,testID=fabConfig.testID;return/*#__PURE__*/React__default__namespace.default.createElement(StyledFABPairWrapper,props,/*#__PURE__*/React__default__namespace.default.createElement(StyledFAB,{icon:"cancel",onPress:onCancel,testID:"fab-pair-cancel",iconOnly:true}),/*#__PURE__*/React__default__namespace.default.createElement(StyledFAB,{icon:icon,title:title,onPress:onPress,testID:testID,iconOnly:!title,isLast:true}));};var FAB=Object.assign(FAB$1,{ActionGroup:ActionGroup,Pair:Pair});var ToastContainerWrapper=index$b(reactNative.View)(function(_ref){var theme=_ref.theme,position=_ref.position;return _objectSpread2(_objectSpread2({},reactNative.StyleSheet.absoluteFillObject),{},{paddingHorizontal:theme.__hd__.toast.space.wrapperVerticalPadding,paddingVertical:theme.__hd__.toast.space.wrapperHorizontalPadding,flexDirection:position==='bottom'?'column-reverse':'column',elevation:9999});});var Container=index$b(reactNative.Animated.View)(function(_ref2){var theme=_ref2.theme,themeVariant=_ref2.themeVariant,themeIntent=_ref2.themeIntent;return _objectSpread2({borderRadius:themeVariant==='round'?theme.__hd__.toast.radii["default"]:0,backgroundColor:theme.__hd__.toast.colors.backgrounds[themeIntent],minHeight:theme.__hd__.toast.sizes.height,flexDirection:'row'},theme.__hd__.toast.shadows.wrapper);});var IconContainer=index$b(reactNative.View)(function(_ref3){var theme=_ref3.theme;return {alignItems:'center',paddingLeft:theme.__hd__.toast.space.iconLeftPadding};});var TextContainer=index$b(reactNative.View)(function(_ref4){var theme=_ref4.theme;return {paddingHorizontal:theme.__hd__.toast.space.textHorizontalPadding,flex:1};});var ContentContainer=index$b(reactNative.View)(function(_ref5){var theme=_ref5.theme,showDivider=_ref5.showDivider;return {paddingVertical:theme.__hd__.toast.space.contentVerticalPadding,flex:1,borderRightWidth:showDivider?theme.__hd__.toast.borderWidths.base:0,borderColor:theme.__hd__.toast.colors.divider,flexDirection:'row'};});var CTAWrapper=index$b(reactNative.TouchableOpacity)(function(_ref6){var theme=_ref6.theme;return {paddingHorizontal:theme.__hd__.toast.space.ctaPadding,justifyContent:'center'};});var StyledBody=index$b(Typography.Body)(function(_ref7){var theme=_ref7.theme,themeIntent=_ref7.themeIntent;return {color:theme.__hd__.toast.colors.texts[themeIntent]};});var StyledIcon$2=index$b(Icon)(function(_ref8){var theme=_ref8.theme,themeIntent=_ref8.themeIntent;return {color:theme.__hd__.toast.colors.texts[themeIntent]};});var fallbackToastControlContext={show:function show(_){return '';},hide:function hide(_){// Fallback empty function
 },clearAll:function clearAll(){// Fallback empty function
@@ -2254,7 +2254,8 @@ var FloatingLabel = function FloatingLabel(_ref) {
     isFocused = _ref.isFocused,
     required = _ref.required,
     accessibilityLabelledBy = _ref.accessibilityLabelledBy,
-    isEmptyValue = _ref.isEmptyValue;
+    isEmptyValue = _ref.isEmptyValue,
+    testID = _ref.testID;
   var theme = useWorkTheme();
   var shouldFloat = isFocused || !isEmptyValue;
   var focusAnimation = React__default.useRef(new reactNative.Animated.Value(shouldFloat ? 1 : 0)).current;
@@ -2266,6 +2267,7 @@ var FloatingLabel = function FloatingLabel(_ref) {
       useNativeDriver: true
     }).start();
   }, [shouldFloat, focusAnimation]);
+  var testIDSuffix = testID ? "-".concat(testID) : '';
   return /*#__PURE__*/React__default__namespace.default.createElement(StyledFloatingLabelContainer, {
     themeVariant: variant,
     style: [{
@@ -2282,14 +2284,15 @@ var FloatingLabel = function FloatingLabel(_ref) {
           outputRange: [1.333, 1]
         })
       }]
-    }]
+    }],
+    testID: "input-label".concat(testIDSuffix)
   }, /*#__PURE__*/React__default__namespace.default.createElement(reactNative.Animated.View, {
     style: {
       flexDirection: 'row'
     }
   }, /*#__PURE__*/React__default__namespace.default.createElement(StyledLabel, {
     nativeID: accessibilityLabelledBy,
-    testID: "input-label",
+    testID: "input-label-text".concat(testIDSuffix),
     themeState: state,
     numberOfLines: 1,
     style: {
@@ -2756,12 +2759,13 @@ var InternalTextInput = /*#__PURE__*/React__default.forwardRef(function (_ref2,
   Object.keys(borderStyles).forEach(function (key) {
     delete textInputStyle[key];
   });
+  var nativeInputTestIDSuffix = testID ? "-".concat(testID) : '';
   var nativeInputProps = _objectSpread2$1(_objectSpread2$1({
     style: reactNative.StyleSheet.flatten([{
       backgroundColor: backgroundColor,
       color: theme.__hd__.textInput.colors.text
     }, textInputStyle]),
-    testID: 'text-input',
+    testID: "text-input".concat(nativeInputTestIDSuffix),
     accessibilityState: {
       disabled: state === 'disabled' || state === 'readonly'
     },
@@ -2810,7 +2814,8 @@ var InternalTextInput = /*#__PURE__*/React__default.forwardRef(function (_ref2,
     isFocused: isFocused,
     required: required,
     accessibilityLabelledBy: accessibilityLabelledBy,
-    isEmptyValue: isEmptyValue
+    isEmptyValue: isEmptyValue,
+    testID: testID
   }), /*#__PURE__*/React__default__namespace.default.createElement(InputRow, {
     ref: innerTextInput,
     state: state,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hero-design/rn-work-uikit",
-  "version": "1.2.0",
+  "version": "1.2.2",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -23,7 +23,7 @@
     "@emotion/native": "^11.9.3",
     "@emotion/primitives-core": "11.0.0",
     "@emotion/react": "^11.9.3",
-    "@hero-design/rn": "^8.102.0"
+    "@hero-design/rn": "^8.103.1"
   },
   "peerDependencies": {
     "@hero-design/react-native-month-year-picker": "^8.43.1",

package/src/__tests__/__snapshots__/index.spec.tsx.snap

@@ -133,7 +133,7 @@ exports[`first test to ensure configure correctly should render TextInput with p
               ],
             ]
           }
-          testID="text-input"
+          testID="text-input-text-input"
           themeVariant="text"
           value="test value"
         />

package/src/components/TextInput/FloatingLabel.tsx

@@ -21,6 +21,8 @@ export interface FloatingLabelProps {
   accessibilityLabelledBy?: string;
   /** Whether the input value is empty */
   isEmptyValue: boolean;
+  /** Testing id of the input component. */
+  testID?: string;
 }
 
 /**
@@ -53,6 +55,7 @@ const FloatingLabel: React.FC<FloatingLabelProps> = ({
   required,
   accessibilityLabelledBy,
   isEmptyValue,
+  testID,
 }) => {
   const theme = useTheme();
   const shouldFloat = isFocused || !isEmptyValue;
@@ -69,6 +72,8 @@ const FloatingLabel: React.FC<FloatingLabelProps> = ({
     }).start();
   }, [shouldFloat, focusAnimation]);
 
+  const testIDSuffix = testID ? `-${testID}` : '';
+
   return (
     <StyledFloatingLabelContainer
       themeVariant={variant}
@@ -96,6 +101,7 @@ const FloatingLabel: React.FC<FloatingLabelProps> = ({
           ],
         },
       ]}
+      testID={`input-label${testIDSuffix}`}
     >
       <Animated.View
         style={{
@@ -104,7 +110,7 @@ const FloatingLabel: React.FC<FloatingLabelProps> = ({
       >
         <StyledLabel
           nativeID={accessibilityLabelledBy}
-          testID="input-label"
+          testID={`input-label-text${testIDSuffix}`}
           themeState={state}
           numberOfLines={1}
           style={{

package/src/components/TextInput/Group/__tests__/__snapshots__/index.spec.tsx.snap

@@ -120,6 +120,7 @@ exports[`TextInputGroup should render: xxx 1`] = `
             ],
           ]
         }
+        testID="input-label"
         themeVariant="text"
       >
         <AnimatedView
@@ -155,7 +156,7 @@ exports[`TextInputGroup should render: xxx 1`] = `
                 ],
               ]
             }
-            testID="input-label"
+            testID="input-label-text"
             themeFontWeight="regular"
             themeIntent="body"
             themeState="filled"
@@ -373,6 +374,7 @@ exports[`TextInputGroup should render: xxx 1`] = `
             ],
           ]
         }
+        testID="input-label-text-input-2"
         themeVariant="text"
       >
         <AnimatedView
@@ -408,7 +410,7 @@ exports[`TextInputGroup should render: xxx 1`] = `
                 ],
               ]
             }
-            testID="input-label"
+            testID="input-label-text-text-input-2"
             themeFontWeight="regular"
             themeIntent="body"
             themeState="error"
@@ -510,7 +512,7 @@ exports[`TextInputGroup should render: xxx 1`] = `
                 ],
               ]
             }
-            testID="text-input"
+            testID="text-input-text-input-2"
             themeVariant="text"
             value="Text Input 2"
           />
@@ -735,6 +737,7 @@ exports[`TextInputGroup should render: xxx 1`] = `
             ],
           ]
         }
+        testID="input-label"
         themeVariant="text"
       >
         <AnimatedView
@@ -770,7 +773,7 @@ exports[`TextInputGroup should render: xxx 1`] = `
                 ],
               ]
             }
-            testID="input-label"
+            testID="input-label-text"
             themeFontWeight="regular"
             themeIntent="body"
             themeState="filled"

package/src/components/TextInput/MIGRATION.md

@@ -74,7 +74,7 @@ Here's what to look for in your unit tests:
     it('should display an asterisk for required fields', () => {
       const { getByText } = render(<TextInput label="My Field" required />);
       // This will now fail
-      expect(getByText('*')).toBeTruthy(); 
+      expect(getByText('*')).toBeTruthy();
     });
 
     // New test for optional field
@@ -82,7 +82,7 @@ Here's what to look for in your unit tests:
       const { queryByText } = render(<TextInput label="My Field" required={false} />);
       expect(queryByText(/\(Optional\)/)).toBeTruthy();
     });
-    
+
     // New test for required field
     it('should not display (Optional) for required fields', () => {
       const { queryByText } = render(<TextInput label="My Field" required={true} />);
@@ -96,38 +96,3 @@ Here's what to look for in your unit tests:
 
 *   **Interaction Tests:**
     *   If you have tests that simulate user input, the floating label will animate. This shouldn't affect most tests, but if you have complex tests that check for element positions, they might need adjustment.
-
-### 4.3. Breaking Change: `testID` Handling
-
-The way `testID` is applied to the underlying native `TextInput` component has changed, which will break existing tests that query for the input field.
-
-*   **Old Behavior (`@hero-design/rn`):** The `testID` for the native input was dynamically created by appending `-text-input` to the `testID` prop (e.g., `my-test-id-text-input`).
-*   **New Behavior (`@hero-design/rn-work-uikit`):** The `testID` for the native input is now **hardcoded to `'text-input'`.**
-
-Your tests must be updated to reflect this change.
-
-**Example Test Update:**
-
-```javascript
-// Old test query
-const input = getByTestId('my-form-field-text-input');
-
-// New test query
-const input = getByTestId('text-input');
-```
-
-Because the native input `testID` is now static, if you have multiple `TextInput` components on one screen, you must first scope your query to the correct component container.
-
-**Example with multiple `TextInput`s:**
-
-```javascript
-import { render, within } from '@testing-library/react-native';
-
-// Get the container for a specific TextInput using its unique testID
-const textInputContainer = getByTestId('my-unique-test-id');
-
-// Find the native input within that container
-const nativeInput = within(textInputContainer).getByTestId('text-input');
-```
-
-This plan should provide a good starting point for the migration. The key is to be aware of the visual changes and to thoroughly test all instances of the `TextInput` component. 

package/src/components/TextInput/__tests__/FloatingLabel.spec.tsx

@@ -133,7 +133,7 @@ describe('FloatingLabel', () => {
       );
 
       // User should have proper accessibility support
-      const label = getByTestId('input-label');
+      const label = getByTestId('input-label-text');
       expect(label).toHaveProp('nativeID', accessibilityId);
     });
   });
@@ -163,7 +163,7 @@ describe('FloatingLabel', () => {
           />
         );
 
-        const label = getByTestId('input-label');
+        const label = getByTestId('input-label-text');
         expect(label).toHaveProp('themeState', state);
       }
     );
@@ -183,7 +183,7 @@ describe('FloatingLabel', () => {
         );
 
         // User should see a fully rendered floating label
-        const label = getByTestId('input-label');
+        const label = getByTestId('input-label-text');
         expect(label).toBeTruthy();
         expect(label).toHaveProp('nativeID', 'fullname-label');
         expect(label).toHaveTextContent('Full Name');