npm - @razorpay/blade - Versions diffs - 11.11.0 → 11.12.0 - Mend

@razorpay/blade 11.11.0 → 11.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (998) hide show

package/build/lib/native/components/Input/BaseInput/BaseInputTagSlot.native.js CHANGED Viewed

@@ -14,7 +14,7 @@ import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { Text } from '../../Typography/Text/Text.js';
 import '../../Typography/Code/Code.js';
-var ScrollableTagSlotContainer=function ScrollableTagSlotContainer(_ref){var maxTagRows=_ref.maxTagRows,children=_ref.children,handleOnInputClick=_ref.handleOnInputClick;var scrollViewRef=React__default.useRef(null);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isScrolling=_React$useState2[0],setIsScrolling=_React$useState2[1];return jsxs(ScrollView,{ref:scrollViewRef,contentContainerStyle:{flexWrap:maxTagRows==='single'?'nowrap':'wrap',position:'relative',flexDirection:'row',flexGrow:1,alignItems:'center'},onScrollBeginDrag:function onScrollBeginDrag(){setIsScrolling(true);},onScrollEndDrag:function onScrollEndDrag(){setIsScrolling(false);},horizontal:maxTagRows==='single',showsHorizontalScrollIndicator:maxTagRows==='single',onContentSizeChange:function onContentSizeChange(){var _scrollViewRef$curren;(_scrollViewRef$curren=scrollViewRef.current)==null?void 0:_scrollViewRef$curren.scrollToEnd({animated:true});},children:[jsx(TouchableWithoutFeedback,{onPress:function onPress(){if(!isScrolling){handleOnInputClick();}},children:jsx(BaseBox,{position:"absolute",height:"100%",width:"100%"})}),children]});};var ClickableText=function ClickableText(_ref2){var children=_ref2.children,handleOnInputClick=_ref2.handleOnInputClick,isDisabled=_ref2.isDisabled;return jsx(TouchableWithoutFeedback,{onPress:function onPress(){handleOnInputClick();},children:jsx(BaseBox,{alignSelf:"center",marginRight:"spacing.4",children:jsx(Text,{size:"small",variant:"body",weight:"regular",color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.subtle',children:children})})});};var PLUS_X_MORE_TEXT_WIDTH=60;var BaseInputTagSlot=function BaseInputTagSlot(_ref3){var tags=_ref3.tags,maxTagRows=_ref3.maxTagRows,showAllTags=_ref3.showAllTags,handleOnInputClick=_ref3.handleOnInputClick,renderAs=_ref3.renderAs,children=_ref3.children,isDropdownTrigger=_ref3.isDropdownTrigger,labelPrefix=_ref3.labelPrefix,isDisabled=_ref3.isDisabled,size$1=_ref3.size;var hasTags=tags&&tags.length>0;var initialVisibleTags=maxTagRows==='multiple'?6:1;var _React$useState3=React__default.useState(labelPrefix?0:initialVisibleTags),_React$useState4=_slicedToArray(_React$useState3,2),visibleTags=_React$useState4[0],setVisibleTags=_React$useState4[1];var invisibleTagsCount=tags||tags&&labelPrefix?tags.length-visibleTags:0;if(!isDropdownTrigger){return children;}return jsxs(BaseBox,{justifyContent:"flex-start",paddingY:"spacing.1",paddingX:"spacing.4",minHeight:makeSize(baseInputHeight[size$1]),display:"flex",flexDirection:"row",position:"relative",flex:"1",onLayout:function onLayout(e){var _e$nativeEvent,_e$nativeEvent$layout;if(!hasTags)return;if(labelPrefix){setVisibleTags(0);return;}if(maxTagRows==='multiple'){return;}var containerWidth=(_e$nativeEvent=e.nativeEvent)==null?void 0:(_e$nativeEvent$layout=_e$nativeEvent.layout)==null?void 0:_e$nativeEvent$layout.width;if(!containerWidth){return;}var availableTagsSpace=containerWidth-PLUS_X_MORE_TEXT_WIDTH;var visibleTagsCount=Math.floor(availableTagsSpace/140);setVisibleTags(visibleTagsCount);},children:[jsxs(ScrollableTagSlotContainer,{maxTagRows:maxTagRows,showAllTags:showAllTags,handleOnInputClick:handleOnInputClick,children:[hasTags?jsxs(Fragment,{children:[showAllTags||maxTagRows==='multiple'?tags:tags.slice(0,visibleTags),invisibleTagsCount>0&&!showAllTags&&!labelPrefix&&maxTagRows!=='multiple'?jsxs(ClickableText,{isDisabled:isDisabled,handleOnInputClick:handleOnInputClick,children:["+ ",invisibleTagsCount," More"]}):null,!showAllTags&&invisibleTagsCount>0&&labelPrefix?jsxs(ClickableText,{isDisabled:isDisabled,handleOnInputClick:handleOnInputClick,children:[labelPrefix," (",invisibleTagsCount," Selected)"]}):null]}):null,jsx(BaseBox,{width:hasTags&&renderAs==='button'?makeSize(size['1']):'100%',children:children})]}),jsx(TouchableWithoutFeedback,{onPress:function onPress(){handleOnInputClick();},children:jsx(BaseBox,{flex:"1"})})]});};
+var ScrollableTagSlotContainer=function ScrollableTagSlotContainer(_ref){var maxTagRows=_ref.maxTagRows,children=_ref.children,handleOnInputClick=_ref.handleOnInputClick;var scrollViewRef=React__default.useRef(null);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isScrolling=_React$useState2[0],setIsScrolling=_React$useState2[1];return jsxs(ScrollView,{ref:scrollViewRef,contentContainerStyle:{flexWrap:maxTagRows==='single'?'nowrap':'wrap',position:'relative',flexDirection:'row',flexGrow:1,alignItems:'center'},onScrollBeginDrag:function onScrollBeginDrag(){setIsScrolling(true);},onScrollEndDrag:function onScrollEndDrag(){setIsScrolling(false);},horizontal:maxTagRows==='single',showsHorizontalScrollIndicator:maxTagRows==='single',onContentSizeChange:function onContentSizeChange(){var _scrollViewRef$curren;(_scrollViewRef$curren=scrollViewRef.current)==null?void 0:_scrollViewRef$curren.scrollToEnd({animated:true});},children:[jsx(TouchableWithoutFeedback,{onPress:function onPress(){if(!isScrolling){handleOnInputClick();}},children:jsx(BaseBox,{position:"absolute",height:"100%",width:"100%"})}),children]});};var ClickableText=function ClickableText(_ref2){var children=_ref2.children,handleOnInputClick=_ref2.handleOnInputClick,isDisabled=_ref2.isDisabled;return jsx(TouchableWithoutFeedback,{onPress:function onPress(){handleOnInputClick();},children:jsx(BaseBox,{alignSelf:"center",marginRight:"spacing.4",children:jsx(Text,{size:"small",variant:"body",weight:"regular",color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.subtle',children:children})})});};var PLUS_X_MORE_TEXT_WIDTH=60;var BaseInputTagSlot=function BaseInputTagSlot(_ref3){var tags=_ref3.tags,maxTagRows=_ref3.maxTagRows,showAllTags=_ref3.showAllTags,handleOnInputClick=_ref3.handleOnInputClick,renderAs=_ref3.renderAs,children=_ref3.children,isDropdownTrigger=_ref3.isDropdownTrigger,labelPrefix=_ref3.labelPrefix,isDisabled=_ref3.isDisabled,numberOfLines=_ref3.numberOfLines,isTextArea=_ref3.isTextArea,size$1=_ref3.size;var hasTags=tags&&tags.length>0;var initialVisibleTags=maxTagRows==='multiple'?6:1;var _React$useState3=React__default.useState(labelPrefix?0:initialVisibleTags),_React$useState4=_slicedToArray(_React$useState3,2),visibleTags=_React$useState4[0],setVisibleTags=_React$useState4[1];var invisibleTagsCount=tags||tags&&labelPrefix?tags.length-visibleTags:0;if(!isDropdownTrigger){return children;}return jsxs(BaseBox,{justifyContent:"flex-start",paddingY:"spacing.1",paddingX:"spacing.4",minHeight:makeSize(baseInputHeight[size$1]),height:isTextArea&&isDropdownTrigger?makeSize(baseInputHeight[size$1]*(numberOfLines!=null?numberOfLines:1)):undefined,display:"flex",flexDirection:"row",position:"relative",flex:"1",onLayout:function onLayout(e){var _e$nativeEvent,_e$nativeEvent$layout;if(!hasTags)return;if(labelPrefix){setVisibleTags(0);return;}if(maxTagRows==='multiple'){return;}var containerWidth=(_e$nativeEvent=e.nativeEvent)==null?void 0:(_e$nativeEvent$layout=_e$nativeEvent.layout)==null?void 0:_e$nativeEvent$layout.width;if(!containerWidth){return;}var availableTagsSpace=containerWidth-PLUS_X_MORE_TEXT_WIDTH;var visibleTagsCount=Math.floor(availableTagsSpace/140);setVisibleTags(visibleTagsCount);},children:[jsxs(ScrollableTagSlotContainer,{maxTagRows:maxTagRows,showAllTags:showAllTags,handleOnInputClick:handleOnInputClick,children:[hasTags?jsxs(Fragment,{children:[showAllTags||maxTagRows==='multiple'?tags:tags.slice(0,visibleTags),invisibleTagsCount>0&&!showAllTags&&!labelPrefix&&maxTagRows!=='multiple'?jsxs(ClickableText,{isDisabled:isDisabled,handleOnInputClick:handleOnInputClick,children:["+ ",invisibleTagsCount," More"]}):null,!showAllTags&&invisibleTagsCount>0&&labelPrefix?jsxs(ClickableText,{isDisabled:isDisabled,handleOnInputClick:handleOnInputClick,children:[labelPrefix," (",invisibleTagsCount," Selected)"]}):null]}):null,jsx(BaseBox,{width:hasTags&&renderAs==='button'?makeSize(size['1']):'100%',children:children})]}),jsx(TouchableWithoutFeedback,{onPress:function onPress(){handleOnInputClick();},children:jsx(BaseBox,{flex:"1"})})]});};
 export { BaseInputTagSlot };
 //# sourceMappingURL=BaseInputTagSlot.native.js.map

package/build/lib/native/components/Input/BaseInput/BaseInputTagSlot.native.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseInputTagSlot.native.js","sources":["../../../../../../src/components/Input/BaseInput/BaseInputTagSlot.native.tsx"],"sourcesContent":["import React from 'react';\nimport { ScrollView, TouchableWithoutFeedback } from 'react-native';\nimport type { BaseInputTagSlotProps } from './types';\nimport { baseInputHeight } from './baseInputTokens';\nimport BaseBox from '~components/Box/BaseBox';\nimport { makeSize } from '~utils';\nimport { size as sizeToken } from '~tokens/global';\nimport { Text } from '~components/Typography';\nimport type { StringChildrenType } from '~utils/types';\n\nconst ScrollableTagSlotContainer = ({\n maxTagRows,\n children,\n handleOnInputClick,\n}: Pick<BaseInputTagSlotProps, 'maxTagRows' \| 'showAllTags' \| 'handleOnInputClick'> & {\n children: (React.ReactNode \| null)[];\n}): React.ReactElement => {\n const scrollViewRef = React.useRef<ScrollView>(null);\n const [isScrolling, setIsScrolling] = React.useState(false);\n return (\n <ScrollView\n ref={scrollViewRef}\n contentContainerStyle={{\n flexWrap: maxTagRows === 'single' ? 'nowrap' : 'wrap',\n position: 'relative',\n flexDirection: 'row',\n flexGrow: 1,\n alignItems: 'center',\n }}\n onScrollBeginDrag={() => {\n setIsScrolling(true);\n }}\n onScrollEndDrag={() => {\n setIsScrolling(false);\n }}\n horizontal={maxTagRows === 'single'}\n showsHorizontalScrollIndicator={maxTagRows === 'single'}\n onContentSizeChange={() => {\n scrollViewRef.current?.scrollToEnd({ animated: true });\n }}\n >\n {/* This creates a clickable layer behind tags so if user clicks empty area between of tags, it handles opening of Dropdown */}\n <TouchableWithoutFeedback\n onPress={() => {\n if (!isScrolling) {\n handleOnInputClick();\n }\n }}\n >\n <BaseBox position=\"absolute\" height=\"100%\" width=\"100%\" />\n </TouchableWithoutFeedback>\n {children}\n </ScrollView>\n );\n};\n\nconst ClickableText = ({\n children,\n handleOnInputClick,\n isDisabled,\n}: {\n children: StringChildrenType;\n handleOnInputClick: BaseInputTagSlotProps['handleOnInputClick'];\n isDisabled: BaseInputTagSlotProps['isDisabled'];\n}): React.ReactElement => {\n return (\n <TouchableWithoutFeedback\n onPress={() => {\n handleOnInputClick();\n }}\n >\n <BaseBox alignSelf=\"center\" marginRight=\"spacing.4\">\n <Text\n size=\"small\"\n variant=\"body\"\n weight=\"regular\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.subtle'}\n >\n {children}\n </Text>\n </BaseBox>\n </TouchableWithoutFeedback>\n );\n};\n\nconst PLUS_X_MORE_TEXT_WIDTH = 60;\n\nconst BaseInputTagSlot = ({\n tags,\n maxTagRows,\n showAllTags,\n handleOnInputClick,\n renderAs,\n children,\n isDropdownTrigger,\n labelPrefix,\n isDisabled,\n size,\n}: BaseInputTagSlotProps): React.ReactElement \| null => {\n const hasTags = tags && tags.length > 0;\n const initialVisibleTags = maxTagRows === 'multiple' ? 6 : 1;\n const [visibleTags, setVisibleTags] = React.useState(labelPrefix ? 0 : initialVisibleTags);\n const invisibleTagsCount = tags \|\| (tags && labelPrefix) ? tags.length - visibleTags : 0;\n\n if (!isDropdownTrigger) {\n return children;\n }\n\n return (\n <BaseBox\n justifyContent=\"flex-start\"\n paddingY=\"spacing.1\"\n paddingX=\"spacing.4\"\n minHeight={makeSize(baseInputHeight[size])}\n display=\"flex\"\n flexDirection=\"row\"\n position=\"relative\"\n flex=\"1\"\n onLayout={(e) => {\n if (!hasTags) return;\n\n if (labelPrefix) {\n setVisibleTags(0);\n return;\n }\n\n if (maxTagRows === 'multiple') {\n // The calculation is for single-line versions.\n // In multiline, we have default 6 tags in RN\n return;\n }\n\n const containerWidth = e.nativeEvent?.layout?.width;\n if (!containerWidth) {\n return;\n }\n\n const availableTagsSpace = containerWidth - PLUS_X_MORE_TEXT_WIDTH;\n const visibleTagsCount = Math.floor(availableTagsSpace / 140);\n setVisibleTags(visibleTagsCount);\n }}\n >\n <ScrollableTagSlotContainer\n maxTagRows={maxTagRows}\n showAllTags={showAllTags}\n handleOnInputClick={handleOnInputClick}\n >\n {hasTags ? (\n <>\n {showAllTags \|\| maxTagRows === 'multiple' ? tags : tags.slice(0, visibleTags)}\n {invisibleTagsCount > 0 && !showAllTags && !labelPrefix && maxTagRows !== 'multiple' ? (\n <ClickableText isDisabled={isDisabled} handleOnInputClick={handleOnInputClick}>\n + {invisibleTagsCount} More\n </ClickableText>\n ) : null}\n {!showAllTags && invisibleTagsCount > 0 && labelPrefix ? (\n <ClickableText isDisabled={isDisabled} handleOnInputClick={handleOnInputClick}>\n {labelPrefix} ({invisibleTagsCount} Selected)\n </ClickableText>\n ) : null}\n </>\n ) : null}\n <BaseBox width={hasTags && renderAs === 'button' ? makeSize(sizeToken['1']) : '100%'}>\n {children}\n </BaseBox>\n </ScrollableTagSlotContainer>\n <TouchableWithoutFeedback\n onPress={() => {\n handleOnInputClick();\n }}\n >\n <BaseBox flex=\"1\" />\n </TouchableWithoutFeedback>\n </BaseBox>\n );\n};\n\nexport { BaseInputTagSlot };\n"],"names":["ScrollableTagSlotContainer","_ref","maxTagRows","children","handleOnInputClick","scrollViewRef","React","useRef","_React$useState","useState","_React$useState2","_slicedToArray","isScrolling","setIsScrolling","_jsxs","ScrollView","ref","contentContainerStyle","flexWrap","position","flexDirection","flexGrow","alignItems","onScrollBeginDrag","onScrollEndDrag","horizontal","showsHorizontalScrollIndicator","onContentSizeChange","_scrollViewRef$curren","current","scrollToEnd","animated","_jsx","TouchableWithoutFeedback","onPress","BaseBox","height","width","ClickableText","_ref2","isDisabled","alignSelf","marginRight","Text","size","variant","weight","color","PLUS_X_MORE_TEXT_WIDTH","BaseInputTagSlot","_ref3","tags","showAllTags","renderAs","isDropdownTrigger","labelPrefix","hasTags","length","initialVisibleTags","_React$useState3","_React$useState4","visibleTags","setVisibleTags","invisibleTagsCount","justifyContent","paddingY","paddingX","minHeight","makeSize","baseInputHeight","display","flex","onLayout","e","_e$nativeEvent","_e$nativeEvent$layout","containerWidth","nativeEvent","layout","availableTagsSpace","visibleTagsCount","Math","floor","_Fragment","slice","sizeToken"],"mappings":"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"}
1	+ {"version":3,"file":"BaseInputTagSlot.native.js","sources":["../../../../../../src/components/Input/BaseInput/BaseInputTagSlot.native.tsx"],"sourcesContent":["import React from 'react';\nimport { ScrollView, TouchableWithoutFeedback } from 'react-native';\nimport type { BaseInputTagSlotProps } from './types';\nimport { baseInputHeight } from './baseInputTokens';\nimport BaseBox from '~components/Box/BaseBox';\nimport { makeSize } from '~utils';\nimport { size as sizeToken } from '~tokens/global';\nimport { Text } from '~components/Typography';\nimport type { StringChildrenType } from '~utils/types';\n\nconst ScrollableTagSlotContainer = ({\n maxTagRows,\n children,\n handleOnInputClick,\n}: Pick<BaseInputTagSlotProps, 'maxTagRows' \| 'showAllTags' \| 'handleOnInputClick'> & {\n children: (React.ReactNode \| null)[];\n}): React.ReactElement => {\n const scrollViewRef = React.useRef<ScrollView>(null);\n const [isScrolling, setIsScrolling] = React.useState(false);\n return (\n <ScrollView\n ref={scrollViewRef}\n contentContainerStyle={{\n flexWrap: maxTagRows === 'single' ? 'nowrap' : 'wrap',\n position: 'relative',\n flexDirection: 'row',\n flexGrow: 1,\n alignItems: 'center',\n }}\n onScrollBeginDrag={() => {\n setIsScrolling(true);\n }}\n onScrollEndDrag={() => {\n setIsScrolling(false);\n }}\n horizontal={maxTagRows === 'single'}\n showsHorizontalScrollIndicator={maxTagRows === 'single'}\n onContentSizeChange={() => {\n scrollViewRef.current?.scrollToEnd({ animated: true });\n }}\n >\n {/* This creates a clickable layer behind tags so if user clicks empty area between of tags, it handles opening of Dropdown /}\n <TouchableWithoutFeedback\n onPress={() => {\n if (!isScrolling) {\n handleOnInputClick();\n }\n }}\n >\n <BaseBox position=\"absolute\" height=\"100%\" width=\"100%\" />\n </TouchableWithoutFeedback>\n {children}\n </ScrollView>\n );\n};\n\nconst ClickableText = ({\n children,\n handleOnInputClick,\n isDisabled,\n}: {\n children: StringChildrenType;\n handleOnInputClick: BaseInputTagSlotProps['handleOnInputClick'];\n isDisabled: BaseInputTagSlotProps['isDisabled'];\n}): React.ReactElement => {\n return (\n <TouchableWithoutFeedback\n onPress={() => {\n handleOnInputClick();\n }}\n >\n <BaseBox alignSelf=\"center\" marginRight=\"spacing.4\">\n <Text\n size=\"small\"\n variant=\"body\"\n weight=\"regular\"\n color={isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.subtle'}\n >\n {children}\n </Text>\n </BaseBox>\n </TouchableWithoutFeedback>\n );\n};\n\nconst PLUS_X_MORE_TEXT_WIDTH = 60;\n\nconst BaseInputTagSlot = ({\n tags,\n maxTagRows,\n showAllTags,\n handleOnInputClick,\n renderAs,\n children,\n isDropdownTrigger,\n labelPrefix,\n isDisabled,\n numberOfLines,\n isTextArea,\n size,\n}: BaseInputTagSlotProps): React.ReactElement \| null => {\n const hasTags = tags && tags.length > 0;\n const initialVisibleTags = maxTagRows === 'multiple' ? 6 : 1;\n const [visibleTags, setVisibleTags] = React.useState(labelPrefix ? 0 : initialVisibleTags);\n const invisibleTagsCount = tags \|\| (tags && labelPrefix) ? tags.length - visibleTags : 0;\n\n if (!isDropdownTrigger) {\n return children;\n }\n\n return (\n <BaseBox\n justifyContent=\"flex-start\"\n paddingY=\"spacing.1\"\n paddingX=\"spacing.4\"\n minHeight={makeSize(baseInputHeight[size])}\n height={\n isTextArea && isDropdownTrigger\n ? makeSize(baseInputHeight[size] (numberOfLines ?? 1))\n : undefined\n }\n display=\"flex\"\n flexDirection=\"row\"\n position=\"relative\"\n flex=\"1\"\n onLayout={(e) => {\n if (!hasTags) return;\n\n if (labelPrefix) {\n setVisibleTags(0);\n return;\n }\n\n if (maxTagRows === 'multiple') {\n // The calculation is for single-line versions.\n // In multiline, we have default 6 tags in RN\n return;\n }\n\n const containerWidth = e.nativeEvent?.layout?.width;\n if (!containerWidth) {\n return;\n }\n\n const availableTagsSpace = containerWidth - PLUS_X_MORE_TEXT_WIDTH;\n const visibleTagsCount = Math.floor(availableTagsSpace / 140);\n setVisibleTags(visibleTagsCount);\n }}\n >\n <ScrollableTagSlotContainer\n maxTagRows={maxTagRows}\n showAllTags={showAllTags}\n handleOnInputClick={handleOnInputClick}\n >\n {hasTags ? (\n <>\n {showAllTags \|\| maxTagRows === 'multiple' ? tags : tags.slice(0, visibleTags)}\n {invisibleTagsCount > 0 && !showAllTags && !labelPrefix && maxTagRows !== 'multiple' ? (\n <ClickableText isDisabled={isDisabled} handleOnInputClick={handleOnInputClick}>\n + {invisibleTagsCount} More\n </ClickableText>\n ) : null}\n {!showAllTags && invisibleTagsCount > 0 && labelPrefix ? (\n <ClickableText isDisabled={isDisabled} handleOnInputClick={handleOnInputClick}>\n {labelPrefix} ({invisibleTagsCount} Selected)\n </ClickableText>\n ) : null}\n </>\n ) : null}\n <BaseBox width={hasTags && renderAs === 'button' ? makeSize(sizeToken['1']) : '100%'}>\n {children}\n </BaseBox>\n </ScrollableTagSlotContainer>\n <TouchableWithoutFeedback\n onPress={() => {\n handleOnInputClick();\n }}\n >\n <BaseBox flex=\"1\" />\n </TouchableWithoutFeedback>\n </BaseBox>\n );\n};\n\nexport { BaseInputTagSlot };\n"],"names":["ScrollableTagSlotContainer","_ref","maxTagRows","children","handleOnInputClick","scrollViewRef","React","useRef","_React$useState","useState","_React$useState2","_slicedToArray","isScrolling","setIsScrolling","_jsxs","ScrollView","ref","contentContainerStyle","flexWrap","position","flexDirection","flexGrow","alignItems","onScrollBeginDrag","onScrollEndDrag","horizontal","showsHorizontalScrollIndicator","onContentSizeChange","_scrollViewRef$curren","current","scrollToEnd","animated","_jsx","TouchableWithoutFeedback","onPress","BaseBox","height","width","ClickableText","_ref2","isDisabled","alignSelf","marginRight","Text","size","variant","weight","color","PLUS_X_MORE_TEXT_WIDTH","BaseInputTagSlot","_ref3","tags","showAllTags","renderAs","isDropdownTrigger","labelPrefix","numberOfLines","isTextArea","hasTags","length","initialVisibleTags","_React$useState3","_React$useState4","visibleTags","setVisibleTags","invisibleTagsCount","justifyContent","paddingY","paddingX","minHeight","makeSize","baseInputHeight","undefined","display","flex","onLayout","e","_e$nativeEvent","_e$nativeEvent$layout","containerWidth","nativeEvent","layout","availableTagsSpace","visibleTagsCount","Math","floor","_Fragment","slice","sizeToken"],"mappings":"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"}

package/build/lib/native/components/Input/BaseInput/BaseInputWrapper.js CHANGED Viewed

@@ -3,7 +3,7 @@ import React__default from 'react';
 import { AnimatedBaseInputWrapper } from './AnimatedBaseInputWrapper.native.js';
 import { jsx } from 'react/jsx-runtime';
-var _excluded=["children","validationState","currentInteraction","isLabelLeftPositioned","isTextArea","showAllTags","setShowAllTagsWithAnimation","maxTagRows"];var _BaseInputWrapper=function _BaseInputWrapper(_ref,ref){var children=_ref.children,validationState=_ref.validationState,currentInteraction=_ref.currentInteraction;_ref.isLabelLeftPositioned;var isTextArea=_ref.isTextArea,showAllTags=_ref.showAllTags,setShowAllTagsWithAnimation=_ref.setShowAllTagsWithAnimation,maxTagRows=_ref.maxTagRows,props=_objectWithoutProperties(_ref,_excluded);return jsx(AnimatedBaseInputWrapper,Object.assign({ref:ref,isTextArea:isTextArea,validationState:validationState,currentInteraction:currentInteraction,showAllTags:showAllTags,maxTagRows:maxTagRows,setShowAllTagsWithAnimation:setShowAllTagsWithAnimation},props,{children:children}));};var BaseInputWrapper=React__default.forwardRef(_BaseInputWrapper);
+var _excluded=["children","validationState","currentInteraction","isLabelLeftPositioned","isTextArea","showAllTags","setShowAllTagsWithAnimation","maxTagRows","numberOfLines"];var _BaseInputWrapper=function _BaseInputWrapper(_ref,ref){var children=_ref.children,validationState=_ref.validationState,currentInteraction=_ref.currentInteraction;_ref.isLabelLeftPositioned;var isTextArea=_ref.isTextArea,showAllTags=_ref.showAllTags,setShowAllTagsWithAnimation=_ref.setShowAllTagsWithAnimation,maxTagRows=_ref.maxTagRows,numberOfLines=_ref.numberOfLines,props=_objectWithoutProperties(_ref,_excluded);return jsx(AnimatedBaseInputWrapper,Object.assign({ref:ref,isTextArea:isTextArea,validationState:validationState,currentInteraction:currentInteraction,showAllTags:showAllTags,maxTagRows:maxTagRows,setShowAllTagsWithAnimation:setShowAllTagsWithAnimation,numberOfLines:numberOfLines},props,{children:children}));};var BaseInputWrapper=React__default.forwardRef(_BaseInputWrapper);
 export { BaseInputWrapper };
 //# sourceMappingURL=BaseInputWrapper.js.map

package/build/lib/native/components/Input/BaseInput/BaseInputWrapper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseInputWrapper.js","sources":["../../../../../../src/components/Input/BaseInput/BaseInputWrapper.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport React from 'react';\nimport ~~type~~ { ~~BaseInputProps } from './BaseInput';\nimport {~~ AnimatedBaseInputWrapper } from './AnimatedBaseInputWrapper';\nimport type { ~~ContainerElementType~~ } from '~~~utils/~~types';\nimport type { ~~ActionStates~~ } from '~utils/~~useInteraction~~';\n\ntype BaseInputWrapperProps = Pick<\n BaseInputProps,\n \| 'isDisabled'\n \| 'validationState'\n \| 'showAllTags'\n \| 'maxTagRows'\n \| 'setInputWrapperRef'\n \| 'isDropdownTrigger'\n> & {\n isFocused?: boolean;\n isLabelLeftPositioned?: boolean;\n currentInteraction: ActionStates;\n isTextArea?: boolean;\n setShowAllTagsWithAnimation: (showAllTagsWithAnimation: boolean) => void;\n children: React.ReactNode;\n size: NonNullable<BaseInputProps['size']>;\n};\n\nconst _BaseInputWrapper: React.ForwardRefRenderFunction<\n ContainerElementType,\n BaseInputWrapperProps & {\n children: ReactNode;\n }\n> = (\n {\n children,\n validationState,\n currentInteraction,\n isLabelLeftPositioned,\n isTextArea,\n showAllTags,\n setShowAllTagsWithAnimation,\n maxTagRows,\n ...props\n },\n ref,\n): ReactElement => {\n return (\n <AnimatedBaseInputWrapper\n // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unnecessary-type-assertion\n ref={ref as any}\n isTextArea={isTextArea}\n validationState={validationState}\n currentInteraction={currentInteraction}\n showAllTags={showAllTags}\n maxTagRows={maxTagRows}\n setShowAllTagsWithAnimation={setShowAllTagsWithAnimation}\n {...props}\n >\n {children}\n </AnimatedBaseInputWrapper>\n );\n};\n\nexport const BaseInputWrapper = React.forwardRef(_BaseInputWrapper);\n"],"names":["_BaseInputWrapper","_ref","ref","children","validationState","currentInteraction","isLabelLeftPositioned","isTextArea","showAllTags","setShowAllTagsWithAnimation","maxTagRows","props","_objectWithoutProperties","_excluded","_jsx","AnimatedBaseInputWrapper","Object","assign","BaseInputWrapper","React","forwardRef"],"mappings":";;;;;AACA,IAAA,SAAA,CAAA,CAAA,UAAA,CAAA,iBAAA,CAAA,oBAAA,CAAA,uBAAA,CAAA,YAAA,CAAA,aAAA,CAAA,6BAAA,CAAA,YAAA,CAAA,~~CAwBA~~,IAAMA,iBAKL,CAAG,SALEA,iBAKLA,CAAAC,IAAA,~~CAYCC~~,GAAG,CACc,~~CAXf~~,IAAAC,QAAQ,CAAAF,IAAA,CAARE,QAAQ,CACRC,eAAe,CAAAH,IAAA,CAAfG,eAAe,CACfC,kBAAkB,CAAAJ,IAAA,CAAlBI,kBAAkB,CACGJ,IAAA,CAArBK,qBAAqB,KACrBC,UAAU,CAAAN,IAAA,CAAVM,UAAU,CACVC,WAAW,CAAAP,IAAA,CAAXO,WAAW,CACXC,2BAA2B,CAAAR,IAAA,CAA3BQ,2BAA2B,CAC3BC,UAAU,CAAAT,IAAA,CAAVS,UAAU,~~CACPC~~,KAAK,CAAAC,wBAAA,~~CAAAX~~,IAAA,~~CAAAY~~,SAAA,EAIV,OACEC,GAAA,CAACC,wBAAwB,CAAAC,MAAA,CAAAC,MAAA,~~CAEvBf~~,~~CAAAA~~,GAAG,CAAEA,GAAW,CAChBK,UAAU,CAAEA,UAAW,CACvBH,eAAe,CAAEA,eAAgB,CACjCC,kBAAkB,CAAEA,kBAAmB,CACvCG,WAAW,CAAEA,WAAY,CACzBE,UAAU,CAAEA,UAAW,CACvBD,2BAA2B,CAAEA,2BAA4B,~~CAAA~~,~~CACrDE~~,KAAK,~~CAAAR~~,~~CAAAA~~,QAAA,CAERA,QAAQ,CACe,CAAA,CAAC,CAE/B,CAAC,CAEY,~~IAAAe~~,gBAAgB,CAAGC,cAAK,CAACC,UAAU,~~CAACpB~~,iBAAiB;;;;"}
1	+ {"version":3,"file":"BaseInputWrapper.js","sources":["../../../../../../src/components/Input/BaseInput/BaseInputWrapper.tsx"],"sourcesContent":["import type { ReactElement, ReactNode } from 'react';\nimport React from 'react';\nimport { AnimatedBaseInputWrapper } from './AnimatedBaseInputWrapper';\nimport type { BaseInputWrapperProps } from './types';\nimport type { ContainerElementType } from '~utils/types';\n\nconst _BaseInputWrapper: React.ForwardRefRenderFunction<\n ContainerElementType,\n BaseInputWrapperProps & {\n children: ReactNode;\n }\n> = (\n {\n children,\n validationState,\n currentInteraction,\n isLabelLeftPositioned,\n isTextArea,\n showAllTags,\n setShowAllTagsWithAnimation,\n maxTagRows,\n numberOfLines,\n ...props\n },\n ref,\n): ReactElement => {\n return (\n <AnimatedBaseInputWrapper\n // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unnecessary-type-assertion\n ref={ref as any}\n isTextArea={isTextArea}\n validationState={validationState}\n currentInteraction={currentInteraction}\n showAllTags={showAllTags}\n maxTagRows={maxTagRows}\n setShowAllTagsWithAnimation={setShowAllTagsWithAnimation}\n numberOfLines={numberOfLines}\n {...props}\n >\n {children}\n </AnimatedBaseInputWrapper>\n );\n};\n\nexport const BaseInputWrapper = React.forwardRef(_BaseInputWrapper);\n"],"names":["_BaseInputWrapper","_ref","ref","children","validationState","currentInteraction","isLabelLeftPositioned","isTextArea","showAllTags","setShowAllTagsWithAnimation","maxTagRows","numberOfLines","props","_objectWithoutProperties","_excluded","_jsx","AnimatedBaseInputWrapper","Object","assign","BaseInputWrapper","React","forwardRef"],"mappings":";;;;;AACA,IAAA,SAAA,CAAA,CAAA,UAAA,CAAA,iBAAA,CAAA,oBAAA,CAAA,uBAAA,CAAA,YAAA,CAAA,aAAA,CAAA,6BAAA,CAAA,YAAA,CAAA,eAAA,CAAA,CAKA,IAAMA,iBAKL,CAAG,SALEA,iBAKLA,CAAAC,IAAA,CAaCC,GAAG,CACc,CAZf,IAAAC,QAAQ,CAAAF,IAAA,CAARE,QAAQ,CACRC,eAAe,CAAAH,IAAA,CAAfG,eAAe,CACfC,kBAAkB,CAAAJ,IAAA,CAAlBI,kBAAkB,CACGJ,IAAA,CAArBK,qBAAqB,KACrBC,UAAU,CAAAN,IAAA,CAAVM,UAAU,CACVC,WAAW,CAAAP,IAAA,CAAXO,WAAW,CACXC,2BAA2B,CAAAR,IAAA,CAA3BQ,2BAA2B,CAC3BC,UAAU,CAAAT,IAAA,CAAVS,UAAU,CACVC,aAAa,CAAAV,IAAA,CAAbU,aAAa,CACVC,KAAK,CAAAC,wBAAA,CAAAZ,IAAA,CAAAa,SAAA,EAIV,OACEC,GAAA,CAACC,wBAAwB,CAAAC,MAAA,CAAAC,MAAA,CAAA,CAEvBhB,GAAG,CAAEA,GAAW,CAChBK,UAAU,CAAEA,UAAW,CACvBH,eAAe,CAAEA,eAAgB,CACjCC,kBAAkB,CAAEA,kBAAmB,CACvCG,WAAW,CAAEA,WAAY,CACzBE,UAAU,CAAEA,UAAW,CACvBD,2BAA2B,CAAEA,2BAA4B,CACzDE,aAAa,CAAEA,aAAc,EACzBC,KAAK,CAAA,CAAAT,QAAA,CAERA,QAAQ,CACe,CAAA,CAAC,CAE/B,CAAC,CAEY,IAAAgB,gBAAgB,CAAGC,cAAK,CAACC,UAAU,CAACrB,iBAAiB;;;;"}

package/build/lib/native/components/Input/BaseInput/StyledBaseInput.native.js CHANGED Viewed

@@ -19,7 +19,7 @@ import 'react-native-gesture-handler';
 import '../../BottomSheet/BottomSheetStack.js';
 import { assignWithoutSideEffects } from '../../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
-var _excluded=["name","isRequired","isDisabled","maxCharacters","handleOnFocus","handleOnChange","handleOnBlur","handleOnSubmit","handleOnInput","handleOnKeyDown","handleOnClick","keyboardType","keyboardReturnKeyType","autoCompleteSuggestionType","accessibilityProps","currentInteraction","setCurrentInteraction","type","numberOfLines","isTextArea","hasPopup","shouldIgnoreBlurAnimation","autoCapitalize","as","$size"];var autoCompleteSuggestionTypeAndroid={none:'off',name:'name',email:'email',username:'username',password:'password',newPassword:'password-new',oneTimeCode:'sms-otp',telephone:'tel',postalCode:'postal-code',countryName:'postal-address-country',creditCardNumber:'cc-number',creditCardCSC:'cc-csc',creditCardExpiry:'cc-exp',creditCardExpiryMonth:'cc-exp-month',creditCardExpiryYear:'cc-exp-year'};var autoCompleteSuggestionTypeIOS={none:'none',name:'name',email:'emailAddress',username:'username',password:'password',newPassword:'newPassword',oneTimeCode:'oneTimeCode',telephone:'telephoneNumber',postalCode:'postalCode',countryName:'countryName',creditCardNumber:'creditCardNumber',creditCardCSC:'none',creditCardExpiry:'none',creditCardExpiryMonth:'none',creditCardExpiryYear:'none'};var KeyboardTypeToNativeValuesMap={text:'default',search:'default',telephone:'phone-pad',email:'email-address',url:'url',decimal:'decimal-pad'};var getInputHeight=function getInputHeight(_ref){var isTextArea=_ref.isTextArea,hasTags=_ref.hasTags,numberOfLines=_ref.numberOfLines,lineHeight=_ref.lineHeight,size$1=_ref.size;if(isTextArea){return `${lineHeight*(numberOfLines!=null?numberOfLines:0)}px`;}if(hasTags){return undefined;}return makeSize(size[baseInputHeight[size$1]]);};var getRNInputStyles=function getRNInputStyles(props){return Object.assign({},getBaseInputStyles({theme:props.theme,isFocused:props.isFocused,isDisabled:!props.editable,validationState:props.validationState,leadingIcon:props.leadingIcon,prefix:props.prefix,trailingInteractionElement:props.trailingInteractionElement,leadingInteractionElement:props.leadingInteractionElement,suffix:props.suffix,trailingIcon:props.trailingIcon,isTextArea:props.isTextArea,hasTags:props.hasTags,isDropdownTrigger:props.isDropdownTrigger,size:props.$size,valueComponentType:props.valueComponentType}),{lineHeight:Platform.select({android:makeSize(props.theme.typography.lineHeights[100]),ios:undefined}),textAlignVertical:'top',height:getInputHeight({isTextArea:props.isTextArea,hasTags:props.hasTags,numberOfLines:props.numberOfLines,lineHeight:props.theme.typography.lineHeights[300],size:props.$size})});};var StyledNativeBaseInput=styled.TextInput(function(_ref2){var id=_ref2.id,isFocused=_ref2.isFocused,theme=_ref2.theme,editable=_ref2.editable,validationState=_ref2.validationState,leadingIcon=_ref2.leadingIcon,prefix=_ref2.prefix,trailingInteractionElement=_ref2.trailingInteractionElement,leadingInteractionElement=_ref2.leadingInteractionElement,suffix=_ref2.suffix,trailingIcon=_ref2.trailingIcon,isTextArea=_ref2.isTextArea,numberOfLines=_ref2.numberOfLines,isDropdownTrigger=_ref2.isDropdownTrigger,hasTags=_ref2.hasTags,$size=_ref2.$size,valueComponentType=_ref2.valueComponentType;return getRNInputStyles({id:id,isFocused:isFocused,theme:theme,editable:editable,validationState:validationState,leadingIcon:leadingIcon,prefix:prefix,trailingInteractionElement:trailingInteractionElement,leadingInteractionElement:leadingInteractionElement,suffix:suffix,trailingIcon:trailingIcon,isTextArea:isTextArea,numberOfLines:numberOfLines,hasTags:hasTags,isDropdownTrigger:isDropdownTrigger,$size:$size,valueComponentType:valueComponentType});});var StyledNativeBaseButton=styled.TouchableOpacity(function(_ref3){var id=_ref3.id,isFocused=_ref3.isFocused,theme=_ref3.theme,editable=_ref3.editable,validationState=_ref3.validationState,leadingIcon=_ref3.leadingIcon,prefix=_ref3.prefix,trailingInteractionElement=_ref3.trailingInteractionElement,leadingInteractionElement=_ref3.leadingInteractionElement,suffix=_ref3.suffix,trailingIcon=_ref3.trailingIcon,isTextArea=_ref3.isTextArea,numberOfLines=_ref3.numberOfLines,isDropdownTrigger=_ref3.isDropdownTrigger,hasTags=_ref3.hasTags,$size=_ref3.$size,valueComponentType=_ref3.valueComponentType;return Object.assign({},getRNInputStyles({id:id,isFocused:isFocused,theme:theme,editable:editable,validationState:validationState,leadingIcon:leadingIcon,prefix:prefix,trailingInteractionElement:trailingInteractionElement,leadingInteractionElement:leadingInteractionElement,suffix:suffix,trailingIcon:trailingIcon,isTextArea:isTextArea,numberOfLines:numberOfLines,isDropdownTrigger:isDropdownTrigger,hasTags:hasTags,$size:$size,valueComponentType:valueComponentType}));});var _StyledBaseInput=function _StyledBaseInput(_ref4,ref){var name=_ref4.name;_ref4.isRequired;var isDisabled=_ref4.isDisabled,maxCharacters=_ref4.maxCharacters,handleOnFocus=_ref4.handleOnFocus,handleOnChange=_ref4.handleOnChange,handleOnBlur=_ref4.handleOnBlur,handleOnSubmit=_ref4.handleOnSubmit,handleOnInput=_ref4.handleOnInput,handleOnKeyDown=_ref4.handleOnKeyDown,handleOnClick=_ref4.handleOnClick,_ref4$keyboardType=_ref4.keyboardType,keyboardType=_ref4$keyboardType===void 0?'text':_ref4$keyboardType,keyboardReturnKeyType=_ref4.keyboardReturnKeyType,autoCompleteSuggestionType=_ref4.autoCompleteSuggestionType,accessibilityProps=_ref4.accessibilityProps,currentInteraction=_ref4.currentInteraction,setCurrentInteraction=_ref4.setCurrentInteraction,type=_ref4.type,numberOfLines=_ref4.numberOfLines,isTextArea=_ref4.isTextArea;_ref4.hasPopup;var shouldIgnoreBlurAnimation=_ref4.shouldIgnoreBlurAnimation,autoCapitalize=_ref4.autoCapitalize,renderAs=_ref4.as,$size=_ref4.$size,props=_objectWithoutProperties(_ref4,_excluded);var buttonValue=props.value?props.value:props.placeholder;var _useTheme=useTheme(),theme=_useTheme.theme;var commonProps={onBlur:function onBlur(){if(!shouldIgnoreBlurAnimation){setCurrentInteraction('default');}},isFocused:currentInteraction==='focus'};return renderAs==='button'?jsx(StyledNativeBaseButton,Object.assign({ref:ref,onPress:function onPress(){handleOnClick==null?void 0:handleOnClick({name:name,value:props.value});},onFocus:function onFocus(){handleOnFocus==null?void 0:handleOnFocus({name:name,value:props.value});setCurrentInteraction('focus');},as:undefined,$size:$size},commonProps,props,accessibilityProps,{children:jsx(Text,{color:props.value&&!isDisabled?'surface.text.gray.subtle':'surface.text.gray.disabled',truncateAfterLines:1,textAlign:props.textAlign,size:$size,children:buttonValue})})):jsx(StyledNativeBaseInput,Object.assign({ref:ref,multiline:isTextArea,numberOfLines:numberOfLines,editable:!isDisabled,maxLength:maxCharacters,placeholderTextColor:theme.colors.surface.text.gray.disabled,onFocus:function onFocus(event){handleOnFocus==null?void 0:handleOnFocus({name:name,value:event==null?void 0:event.nativeEvent.text});handleOnClick==null?void 0:handleOnClick({name:name,value:event==null?void 0:event.nativeEvent.text});setCurrentInteraction('focus');},onChangeText:function onChangeText(text){handleOnChange==null?void 0:handleOnChange({name:name,value:text});handleOnInput==null?void 0:handleOnInput({name:name,value:text});},onEndEditing:function onEndEditing(event){return handleOnBlur==null?void 0:handleOnBlur({name:name,value:event==null?void 0:event.nativeEvent.text});},onSubmitEditing:function onSubmitEditing(event){return handleOnSubmit==null?void 0:handleOnSubmit({name:name,value:event==null?void 0:event.nativeEvent.text});},onKeyPress:function onKeyPress(event){handleOnKeyDown==null?void 0:handleOnKeyDown({name:name,key:event==null?void 0:event.nativeEvent.key,event:event});},keyboardType:KeyboardTypeToNativeValuesMap[keyboardType],returnKeyType:keyboardReturnKeyType,autoCompleteType:autoCompleteSuggestionType?autoCompleteSuggestionTypeAndroid[autoCompleteSuggestionType]:undefined,secureTextEntry:type==='password',isTextArea:isTextArea,textContentType:autoCompleteSuggestionType?autoCompleteSuggestionTypeIOS[autoCompleteSuggestionType]:undefined,autoCapitalize:autoCapitalize,$size:$size},commonProps,props,accessibilityProps));};var StyledBaseInput=assignWithoutSideEffects(React__default.forwardRef(_StyledBaseInput),{displayName:'StyledBaseInput'});
+var _excluded=["name","isRequired","isDisabled","maxCharacters","handleOnFocus","handleOnChange","handleOnBlur","handleOnSubmit","handleOnInput","handleOnKeyDown","handleOnClick","keyboardType","keyboardReturnKeyType","autoCompleteSuggestionType","accessibilityProps","currentInteraction","setCurrentInteraction","type","numberOfLines","isTextArea","hasPopup","shouldIgnoreBlurAnimation","autoCapitalize","as","$size"];var autoCompleteSuggestionTypeAndroid={none:'off',name:'name',email:'email',username:'username',password:'password',newPassword:'password-new',oneTimeCode:'sms-otp',telephone:'tel',postalCode:'postal-code',countryName:'postal-address-country',creditCardNumber:'cc-number',creditCardCSC:'cc-csc',creditCardExpiry:'cc-exp',creditCardExpiryMonth:'cc-exp-month',creditCardExpiryYear:'cc-exp-year'};var autoCompleteSuggestionTypeIOS={none:'none',name:'name',email:'emailAddress',username:'username',password:'password',newPassword:'newPassword',oneTimeCode:'oneTimeCode',telephone:'telephoneNumber',postalCode:'postalCode',countryName:'countryName',creditCardNumber:'creditCardNumber',creditCardCSC:'none',creditCardExpiry:'none',creditCardExpiryMonth:'none',creditCardExpiryYear:'none'};var KeyboardTypeToNativeValuesMap={text:'default',search:'default',telephone:'phone-pad',email:'email-address',url:'url',decimal:'decimal-pad'};var getInputHeight=function getInputHeight(_ref){var isTextArea=_ref.isTextArea,hasTags=_ref.hasTags,numberOfLines=_ref.numberOfLines,isDropdownTrigger=_ref.isDropdownTrigger,size$1=_ref.size;if(isTextArea){var lines=isDropdownTrigger?1:numberOfLines!=null?numberOfLines:0;return `${baseInputHeight[size$1]*lines}px`;}if(hasTags){return undefined;}return makeSize(size[baseInputHeight[size$1]]);};var getRNInputStyles=function getRNInputStyles(props){return Object.assign({},getBaseInputStyles({theme:props.theme,isFocused:props.isFocused,isDisabled:!props.editable,validationState:props.validationState,leadingIcon:props.leadingIcon,prefix:props.prefix,trailingInteractionElement:props.trailingInteractionElement,leadingInteractionElement:props.leadingInteractionElement,suffix:props.suffix,trailingIcon:props.trailingIcon,isTextArea:props.isTextArea,hasTags:props.hasTags,isDropdownTrigger:props.isDropdownTrigger,size:props.$size,valueComponentType:props.valueComponentType}),{lineHeight:Platform.select({android:makeSize(props.theme.typography.lineHeights[100]),ios:undefined}),textAlignVertical:'top',height:getInputHeight({isTextArea:props.isTextArea,hasTags:props.hasTags,numberOfLines:props.numberOfLines,isDropdownTrigger:props.isDropdownTrigger,size:props.$size})});};var StyledNativeBaseInput=styled.TextInput(function(_ref2){var id=_ref2.id,isFocused=_ref2.isFocused,theme=_ref2.theme,editable=_ref2.editable,validationState=_ref2.validationState,leadingIcon=_ref2.leadingIcon,prefix=_ref2.prefix,trailingInteractionElement=_ref2.trailingInteractionElement,leadingInteractionElement=_ref2.leadingInteractionElement,suffix=_ref2.suffix,trailingIcon=_ref2.trailingIcon,isTextArea=_ref2.isTextArea,numberOfLines=_ref2.numberOfLines,isDropdownTrigger=_ref2.isDropdownTrigger,hasTags=_ref2.hasTags,$size=_ref2.$size,valueComponentType=_ref2.valueComponentType;return getRNInputStyles({id:id,isFocused:isFocused,theme:theme,editable:editable,validationState:validationState,leadingIcon:leadingIcon,prefix:prefix,trailingInteractionElement:trailingInteractionElement,leadingInteractionElement:leadingInteractionElement,suffix:suffix,trailingIcon:trailingIcon,isTextArea:isTextArea,numberOfLines:numberOfLines,hasTags:hasTags,isDropdownTrigger:isDropdownTrigger,$size:$size,valueComponentType:valueComponentType});});var StyledNativeBaseButton=styled.TouchableOpacity(function(_ref3){var id=_ref3.id,isFocused=_ref3.isFocused,theme=_ref3.theme,editable=_ref3.editable,validationState=_ref3.validationState,leadingIcon=_ref3.leadingIcon,prefix=_ref3.prefix,trailingInteractionElement=_ref3.trailingInteractionElement,leadingInteractionElement=_ref3.leadingInteractionElement,suffix=_ref3.suffix,trailingIcon=_ref3.trailingIcon,isTextArea=_ref3.isTextArea,numberOfLines=_ref3.numberOfLines,isDropdownTrigger=_ref3.isDropdownTrigger,hasTags=_ref3.hasTags,$size=_ref3.$size,valueComponentType=_ref3.valueComponentType;return Object.assign({},getRNInputStyles({id:id,isFocused:isFocused,theme:theme,editable:editable,validationState:validationState,leadingIcon:leadingIcon,prefix:prefix,trailingInteractionElement:trailingInteractionElement,leadingInteractionElement:leadingInteractionElement,suffix:suffix,trailingIcon:trailingIcon,isTextArea:isTextArea,numberOfLines:numberOfLines,isDropdownTrigger:isDropdownTrigger,hasTags:hasTags,$size:$size,valueComponentType:valueComponentType}));});var _StyledBaseInput=function _StyledBaseInput(_ref4,ref){var name=_ref4.name;_ref4.isRequired;var isDisabled=_ref4.isDisabled,maxCharacters=_ref4.maxCharacters,handleOnFocus=_ref4.handleOnFocus,handleOnChange=_ref4.handleOnChange,handleOnBlur=_ref4.handleOnBlur,handleOnSubmit=_ref4.handleOnSubmit,handleOnInput=_ref4.handleOnInput,handleOnKeyDown=_ref4.handleOnKeyDown,handleOnClick=_ref4.handleOnClick,_ref4$keyboardType=_ref4.keyboardType,keyboardType=_ref4$keyboardType===void 0?'text':_ref4$keyboardType,keyboardReturnKeyType=_ref4.keyboardReturnKeyType,autoCompleteSuggestionType=_ref4.autoCompleteSuggestionType,accessibilityProps=_ref4.accessibilityProps,currentInteraction=_ref4.currentInteraction,setCurrentInteraction=_ref4.setCurrentInteraction,type=_ref4.type,numberOfLines=_ref4.numberOfLines,isTextArea=_ref4.isTextArea;_ref4.hasPopup;var shouldIgnoreBlurAnimation=_ref4.shouldIgnoreBlurAnimation,autoCapitalize=_ref4.autoCapitalize,renderAs=_ref4.as,$size=_ref4.$size,props=_objectWithoutProperties(_ref4,_excluded);var buttonValue=props.value?props.value:props.placeholder;var _useTheme=useTheme(),theme=_useTheme.theme;var commonProps={onBlur:function onBlur(){if(!shouldIgnoreBlurAnimation){setCurrentInteraction('default');}},isFocused:currentInteraction==='focus'};return renderAs==='button'?jsx(StyledNativeBaseButton,Object.assign({ref:ref,onPress:function onPress(){handleOnClick==null?void 0:handleOnClick({name:name,value:props.value});},onFocus:function onFocus(){handleOnFocus==null?void 0:handleOnFocus({name:name,value:props.value});setCurrentInteraction('focus');},as:undefined,$size:$size},commonProps,props,accessibilityProps,{children:jsx(Text,{color:props.value&&!isDisabled?'surface.text.gray.subtle':'surface.text.gray.disabled',truncateAfterLines:1,textAlign:props.textAlign,size:$size,children:buttonValue})})):jsx(StyledNativeBaseInput,Object.assign({ref:ref,multiline:isTextArea,numberOfLines:numberOfLines,editable:!isDisabled,maxLength:maxCharacters,placeholderTextColor:theme.colors.surface.text.gray.disabled,onFocus:function onFocus(event){handleOnFocus==null?void 0:handleOnFocus({name:name,value:event==null?void 0:event.nativeEvent.text});handleOnClick==null?void 0:handleOnClick({name:name,value:event==null?void 0:event.nativeEvent.text});setCurrentInteraction('focus');},onChangeText:function onChangeText(text){handleOnChange==null?void 0:handleOnChange({name:name,value:text});handleOnInput==null?void 0:handleOnInput({name:name,value:text});},onEndEditing:function onEndEditing(event){return handleOnBlur==null?void 0:handleOnBlur({name:name,value:event==null?void 0:event.nativeEvent.text});},onSubmitEditing:function onSubmitEditing(event){return handleOnSubmit==null?void 0:handleOnSubmit({name:name,value:event==null?void 0:event.nativeEvent.text});},onKeyPress:function onKeyPress(event){handleOnKeyDown==null?void 0:handleOnKeyDown({name:name,key:event==null?void 0:event.nativeEvent.key,event:event});},keyboardType:KeyboardTypeToNativeValuesMap[keyboardType],returnKeyType:keyboardReturnKeyType,autoCompleteType:autoCompleteSuggestionType?autoCompleteSuggestionTypeAndroid[autoCompleteSuggestionType]:undefined,secureTextEntry:type==='password',isTextArea:isTextArea,textContentType:autoCompleteSuggestionType?autoCompleteSuggestionTypeIOS[autoCompleteSuggestionType]:undefined,autoCapitalize:autoCapitalize,$size:$size},commonProps,props,accessibilityProps));};var StyledBaseInput=assignWithoutSideEffects(React__default.forwardRef(_StyledBaseInput),{displayName:'StyledBaseInput'});
 export { StyledBaseInput };
 //# sourceMappingURL=StyledBaseInput.native.js.map

package/build/lib/native/components/Input/BaseInput/StyledBaseInput.native.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StyledBaseInput.native.js","sources":["../../../../../../src/components/Input/BaseInput/StyledBaseInput.native.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components/native';\nimport type { CSSObject, ThemeProps, DefaultTheme } from 'styled-components';\nimport type {\n TextInputProps,\n TouchableHighlight,\n TouchableHighlightProps,\n GestureResponderEvent,\n TextInput,\n} from 'react-native';\nimport { Platform as RNPlatform } from 'react-native';\nimport type { BaseInputProps } from './BaseInput';\nimport type { StyledBaseInputProps } from './types';\nimport { getBaseInputStyles } from './baseInputStyles';\nimport { baseInputHeight } from './baseInputTokens';\nimport { Text } from '~components/Typography';\nimport { useTheme } from '~components/BladeProvider';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { size as sizeToken } from '~tokens/global';\nimport { makeSize } from '~utils/makeSize';\nimport type { Platform } from '~utils';\n\ntype StyledComponentAutoCompleteAndroid =\n \| 'off'\n \| 'name'\n \| 'cc-csc'\n \| 'cc-exp'\n \| 'cc-exp-month'\n \| 'cc-exp-year'\n \| 'cc-number'\n \| 'email'\n \| 'username'\n \| 'password'\n \| 'postal-code'\n \| 'tel'\n \| undefined;\n\nconst autoCompleteSuggestionTypeAndroid = {\n none: 'off',\n name: 'name',\n email: 'email',\n username: 'username',\n password: 'password',\n newPassword: 'password-new',\n oneTimeCode: 'sms-otp',\n telephone: 'tel',\n postalCode: 'postal-code',\n countryName: 'postal-address-country',\n creditCardNumber: 'cc-number',\n creditCardCSC: 'cc-csc',\n creditCardExpiry: 'cc-exp',\n creditCardExpiryMonth: 'cc-exp-month',\n creditCardExpiryYear: 'cc-exp-year',\n} as const;\n\nconst autoCompleteSuggestionTypeIOS = {\n none: 'none',\n name: 'name',\n email: 'emailAddress',\n username: 'username',\n password: 'password',\n newPassword: 'newPassword',\n oneTimeCode: 'oneTimeCode',\n telephone: 'telephoneNumber',\n postalCode: 'postalCode',\n countryName: 'countryName',\n creditCardNumber: 'creditCardNumber',\n creditCardCSC: 'none',\n creditCardExpiry: 'none',\n creditCardExpiryMonth: 'none',\n creditCardExpiryYear: 'none',\n} as const;\n\nconst KeyboardTypeToNativeValuesMap = {\n text: 'default',\n search: 'default',\n telephone: 'phone-pad',\n email: 'email-address',\n url: 'url',\n decimal: 'decimal-pad',\n};\n\ntype StyledComponentInputProps = Omit<\n StyledBaseInputProps,\n 'accessibilityProps' \| 'setCurrentInteraction' \| 'currentInteraction'\n> & {\n isTextArea?: boolean;\n isFocused: boolean;\n autoCompleteType?: typeof autoCompleteSuggestionTypeAndroid[keyof typeof autoCompleteSuggestionTypeAndroid];\n editable?: boolean;\n onPress?: (event: GestureResponderEvent) => void;\n $size: NonNullable<BaseInputProps['size']>;\n};\n\nconst getInputHeight = ({\n isTextArea,\n hasTags,\n numberOfLines,\n lineHeight,\n size,\n}: Pick<StyledBaseInputProps, 'hasTags' \| 'isTextArea' \| 'numberOfLines'> & {\n lineHeight: number;\n size: NonNullable<BaseInputProps['size']>;\n}): string \| undefined => {\n if (isTextArea) {\n return `${lineHeight * (numberOfLines ?? 0)}px`;\n }\n\n if (hasTags) {\n return undefined; // we don't set height on input. We set it on wrapper to properly include tags in overall height\n }\n\n return makeSize(sizeToken[baseInputHeight[size]]);\n};\n\nconst getRNInputStyles = (\n props: StyledComponentInputProps &\n ThemeProps<DefaultTheme> &\n (TextInputProps \| TouchableHighlightProps),\n): CSSObject => {\n return {\n ...getBaseInputStyles({\n theme: props.theme,\n isFocused: props.isFocused,\n isDisabled: !props.editable,\n validationState: props.validationState,\n leadingIcon: props.leadingIcon,\n prefix: props.prefix,\n trailingInteractionElement: props.trailingInteractionElement,\n leadingInteractionElement: props.leadingInteractionElement,\n suffix: props.suffix,\n trailingIcon: props.trailingIcon,\n isTextArea: props.isTextArea,\n hasTags: props.hasTags,\n isDropdownTrigger: props.isDropdownTrigger,\n size: props.$size,\n valueComponentType: props.valueComponentType,\n }),\n lineHeight: RNPlatform.select({\n android: makeSize(props.theme.typography.lineHeights[100]),\n ios: undefined,\n }),\n textAlignVertical: 'top',\n height: getInputHeight({\n isTextArea: props.isTextArea,\n hasTags: props.hasTags,\n numberOfLines: props.numberOfLines,\n lineHeight: props.theme.typography.lineHeights[300],\n size: props.$size,\n }),\n };\n};\nconst StyledNativeBaseInput = styled.TextInput<StyledComponentInputProps>(\n ({\n id,\n isFocused,\n theme,\n editable,\n validationState,\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n isTextArea,\n numberOfLines,\n isDropdownTrigger,\n hasTags,\n $size,\n valueComponentType,\n }) =>\n getRNInputStyles({\n id,\n isFocused,\n theme,\n editable,\n validationState,\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n isTextArea,\n numberOfLines,\n hasTags,\n isDropdownTrigger,\n $size,\n valueComponentType,\n }),\n);\nconst StyledNativeBaseButton = styled.TouchableOpacity<StyledComponentInputProps>(\n ({\n id,\n isFocused,\n theme,\n editable,\n validationState,\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n isTextArea,\n numberOfLines,\n isDropdownTrigger,\n hasTags,\n $size,\n valueComponentType,\n }) => ({\n ...getRNInputStyles({\n id,\n isFocused,\n theme,\n editable,\n validationState,\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n isTextArea,\n numberOfLines,\n isDropdownTrigger,\n hasTags,\n $size,\n valueComponentType,\n }),\n }),\n);\n\nconst _StyledBaseInput: React.ForwardRefRenderFunction<\n TextInput \| TouchableHighlight,\n StyledBaseInputProps\n> = (\n {\n name,\n isRequired,\n isDisabled,\n maxCharacters,\n handleOnFocus,\n handleOnChange,\n handleOnBlur,\n handleOnSubmit,\n handleOnInput,\n handleOnKeyDown,\n handleOnClick,\n keyboardType = 'text',\n keyboardReturnKeyType,\n autoCompleteSuggestionType,\n accessibilityProps,\n currentInteraction,\n setCurrentInteraction,\n type,\n numberOfLines,\n isTextArea,\n hasPopup,\n shouldIgnoreBlurAnimation,\n autoCapitalize,\n as: renderAs,\n $size,\n ...props\n },\n ref,\n) => {\n const buttonValue = props.value ? props.value : props.placeholder;\n const { theme } = useTheme();\n const commonProps = {\n onBlur: (): void => {\n // In certain cases like SelectInput, we want to ignore the blur animation when option item is clicked.\n // The selectinput should always look like it is in focus otherwise it triggers blur + focus again which can cause flicker\n if (!shouldIgnoreBlurAnimation) {\n setCurrentInteraction('default');\n }\n },\n isFocused: currentInteraction === 'focus',\n };\n\n return renderAs === 'button' ? (\n <StyledNativeBaseButton\n // the types of styled-components for react-native is creating a mess, so there's no other option but to type `ref` as any\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref={ref as any}\n onPress={(): void => {\n handleOnClick?.({ name, value: props.value });\n }}\n onFocus={(): void => {\n handleOnFocus?.({ name, value: props.value });\n setCurrentInteraction('focus');\n }}\n as={undefined}\n $size={$size}\n {...commonProps}\n {...props}\n {...accessibilityProps}\n >\n <Text\n color={\n props.value && !isDisabled ? 'surface.text.gray.subtle' : 'surface.text.gray.disabled'\n }\n truncateAfterLines={1}\n textAlign={props.textAlign}\n size={$size}\n >\n {buttonValue}\n </Text>\n </StyledNativeBaseButton>\n ) : (\n <StyledNativeBaseInput\n // the types of styled-components for react-native is creating a mess, so there's no other option but to type `ref` as any\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref={ref as any}\n multiline={isTextArea}\n numberOfLines={numberOfLines}\n editable={!isDisabled}\n maxLength={maxCharacters}\n placeholderTextColor={theme.colors.surface.text.gray.disabled}\n onFocus={(event): void => {\n handleOnFocus?.({ name, value: event?.nativeEvent.text });\n // React Native does not have native onPress event on Input elements so for consistency of API we call it on onFocus which also gets triggered on clicks\n handleOnClick?.({ name, value: event?.nativeEvent.text });\n setCurrentInteraction('focus');\n }}\n onChangeText={(text): void => {\n handleOnChange?.({ name, value: text });\n handleOnInput?.({ name, value: text });\n }}\n onEndEditing={(event): void => handleOnBlur?.({ name, value: event?.nativeEvent.text })}\n onSubmitEditing={(event): void => handleOnSubmit?.({ name, value: event?.nativeEvent.text })}\n onKeyPress={(event): void => {\n handleOnKeyDown?.({\n name,\n key: event?.nativeEvent.key,\n event: (event as unknown) as React.KeyboardEvent<HTMLInputElement>, // TODO: handle platform specific type\n });\n }}\n // @ts-expect-error styled-components have limited keyboard types('default' \| 'email-address' \| 'numeric' \| 'phone-pad' \| 'number-pad' \| 'decimal-pad') compared to the actual supported types so ignoring the error.\n // source: https://reactnative.dev/docs/textinput/#keyboardtype\n keyboardType={KeyboardTypeToNativeValuesMap[keyboardType]}\n returnKeyType={keyboardReturnKeyType}\n autoCompleteType={\n autoCompleteSuggestionType\n ? (autoCompleteSuggestionTypeAndroid[\n autoCompleteSuggestionType as Platform.CastNative<\n BaseInputProps['autoCompleteSuggestionType']\n >\n ] as StyledComponentAutoCompleteAndroid)\n : undefined\n }\n secureTextEntry={type === 'password'}\n isTextArea={isTextArea}\n textContentType={\n autoCompleteSuggestionType\n ? autoCompleteSuggestionTypeIOS[\n autoCompleteSuggestionType as Platform.CastNative<\n BaseInputProps['autoCompleteSuggestionType']\n >\n ]\n : undefined\n }\n autoCapitalize={autoCapitalize}\n $size={$size}\n {...commonProps}\n {...props}\n {...accessibilityProps}\n />\n );\n};\n\nconst StyledBaseInput = assignWithoutSideEffects(React.forwardRef(_StyledBaseInput), {\n displayName: 'StyledBaseInput',\n});\n\nexport { StyledBaseInput };\n"],"names":["autoCompleteSuggestionTypeAndroid","none","name","email","username","password","newPassword","oneTimeCode","telephone","postalCode","countryName","creditCardNumber","creditCardCSC","creditCardExpiry","creditCardExpiryMonth","creditCardExpiryYear","autoCompleteSuggestionTypeIOS","KeyboardTypeToNativeValuesMap","text","search","url","decimal","getInputHeight","_ref","isTextArea","hasTags","numberOfLines","lineHeight","size","undefined","makeSize","sizeToken","baseInputHeight","getRNInputStyles","props","Object","assign","getBaseInputStyles","theme","isFocused","isDisabled","editable","validationState","leadingIcon","prefix","trailingInteractionElement","leadingInteractionElement","suffix","trailingIcon","isDropdownTrigger","$size","valueComponentType","RNPlatform","select","android","typography","lineHeights","ios","textAlignVertical","height","StyledNativeBaseInput","styled","TextInput","_ref2","id","StyledNativeBaseButton","TouchableOpacity","_ref3","_StyledBaseInput","_ref4","ref","isRequired","maxCharacters","handleOnFocus","handleOnChange","handleOnBlur","handleOnSubmit","handleOnInput","handleOnKeyDown","handleOnClick","_ref4$keyboardType","keyboardType","keyboardReturnKeyType","autoCompleteSuggestionType","accessibilityProps","currentInteraction","setCurrentInteraction","type","hasPopup","shouldIgnoreBlurAnimation","autoCapitalize","renderAs","as","_objectWithoutProperties","_excluded","buttonValue","value","placeholder","_useTheme","useTheme","commonProps","onBlur","_jsx","onPress","onFocus","children","Text","color","truncateAfterLines","textAlign","multiline","maxLength","placeholderTextColor","colors","surface","gray","disabled","event","nativeEvent","onChangeText","onEndEditing","onSubmitEditing","onKeyPress","key","returnKeyType","autoCompleteType","secureTextEntry","textContentType","StyledBaseInput","assignWithoutSideEffects","React","forwardRef","displayName"],"mappings":"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"}
1	+ {"version":3,"file":"StyledBaseInput.native.js","sources":["../../../../../../src/components/Input/BaseInput/StyledBaseInput.native.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components/native';\nimport type { CSSObject, ThemeProps, DefaultTheme } from 'styled-components';\nimport type {\n TextInputProps,\n TouchableHighlight,\n TouchableHighlightProps,\n GestureResponderEvent,\n TextInput,\n} from 'react-native';\nimport { Platform as RNPlatform } from 'react-native';\nimport type { BaseInputProps } from './BaseInput';\nimport type { StyledBaseInputProps } from './types';\nimport { getBaseInputStyles } from './baseInputStyles';\nimport { baseInputHeight } from './baseInputTokens';\nimport { Text } from '~components/Typography';\nimport { useTheme } from '~components/BladeProvider';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { size as sizeToken } from '~tokens/global';\nimport { makeSize } from '~utils/makeSize';\nimport type { Platform } from '~utils';\n\ntype StyledComponentAutoCompleteAndroid =\n \| 'off'\n \| 'name'\n \| 'cc-csc'\n \| 'cc-exp'\n \| 'cc-exp-month'\n \| 'cc-exp-year'\n \| 'cc-number'\n \| 'email'\n \| 'username'\n \| 'password'\n \| 'postal-code'\n \| 'tel'\n \| undefined;\n\nconst autoCompleteSuggestionTypeAndroid = {\n none: 'off',\n name: 'name',\n email: 'email',\n username: 'username',\n password: 'password',\n newPassword: 'password-new',\n oneTimeCode: 'sms-otp',\n telephone: 'tel',\n postalCode: 'postal-code',\n countryName: 'postal-address-country',\n creditCardNumber: 'cc-number',\n creditCardCSC: 'cc-csc',\n creditCardExpiry: 'cc-exp',\n creditCardExpiryMonth: 'cc-exp-month',\n creditCardExpiryYear: 'cc-exp-year',\n} as const;\n\nconst autoCompleteSuggestionTypeIOS = {\n none: 'none',\n name: 'name',\n email: 'emailAddress',\n username: 'username',\n password: 'password',\n newPassword: 'newPassword',\n oneTimeCode: 'oneTimeCode',\n telephone: 'telephoneNumber',\n postalCode: 'postalCode',\n countryName: 'countryName',\n creditCardNumber: 'creditCardNumber',\n creditCardCSC: 'none',\n creditCardExpiry: 'none',\n creditCardExpiryMonth: 'none',\n creditCardExpiryYear: 'none',\n} as const;\n\nconst KeyboardTypeToNativeValuesMap = {\n text: 'default',\n search: 'default',\n telephone: 'phone-pad',\n email: 'email-address',\n url: 'url',\n decimal: 'decimal-pad',\n};\n\ntype StyledComponentInputProps = Omit<\n StyledBaseInputProps,\n 'accessibilityProps' \| 'setCurrentInteraction' \| 'currentInteraction'\n> & {\n isTextArea?: boolean;\n isFocused: boolean;\n autoCompleteType?: typeof autoCompleteSuggestionTypeAndroid[keyof typeof autoCompleteSuggestionTypeAndroid];\n editable?: boolean;\n onPress?: (event: GestureResponderEvent) => void;\n $size: NonNullable<BaseInputProps['size']>;\n};\n\nconst getInputHeight = ({\n isTextArea,\n hasTags,\n numberOfLines,\n isDropdownTrigger,\n size,\n}: Pick<StyledBaseInputProps, 'hasTags' \| 'isTextArea' \| 'numberOfLines' \| 'isDropdownTrigger'> & {\n size: NonNullable<BaseInputProps['size']>;\n}): string \| undefined => {\n if (isTextArea) {\n const lines = isDropdownTrigger ? 1 : numberOfLines ?? 0;\n return `${baseInputHeight[size] * lines}px`;\n }\n\n if (hasTags) {\n return undefined; // we don't set height on input. We set it on wrapper to properly include tags in overall height\n }\n\n return makeSize(sizeToken[baseInputHeight[size]]);\n};\n\nconst getRNInputStyles = (\n props: StyledComponentInputProps &\n ThemeProps<DefaultTheme> &\n (TextInputProps \| TouchableHighlightProps),\n): CSSObject => {\n return {\n ...getBaseInputStyles({\n theme: props.theme,\n isFocused: props.isFocused,\n isDisabled: !props.editable,\n validationState: props.validationState,\n leadingIcon: props.leadingIcon,\n prefix: props.prefix,\n trailingInteractionElement: props.trailingInteractionElement,\n leadingInteractionElement: props.leadingInteractionElement,\n suffix: props.suffix,\n trailingIcon: props.trailingIcon,\n isTextArea: props.isTextArea,\n hasTags: props.hasTags,\n isDropdownTrigger: props.isDropdownTrigger,\n size: props.$size,\n valueComponentType: props.valueComponentType,\n }),\n lineHeight: RNPlatform.select({\n android: makeSize(props.theme.typography.lineHeights[100]),\n ios: undefined,\n }),\n textAlignVertical: 'top',\n height: getInputHeight({\n isTextArea: props.isTextArea,\n hasTags: props.hasTags,\n numberOfLines: props.numberOfLines,\n isDropdownTrigger: props.isDropdownTrigger,\n size: props.$size,\n }),\n };\n};\nconst StyledNativeBaseInput = styled.TextInput<StyledComponentInputProps>(\n ({\n id,\n isFocused,\n theme,\n editable,\n validationState,\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n isTextArea,\n numberOfLines,\n isDropdownTrigger,\n hasTags,\n $size,\n valueComponentType,\n }) =>\n getRNInputStyles({\n id,\n isFocused,\n theme,\n editable,\n validationState,\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n isTextArea,\n numberOfLines,\n hasTags,\n isDropdownTrigger,\n $size,\n valueComponentType,\n }),\n);\nconst StyledNativeBaseButton = styled.TouchableOpacity<StyledComponentInputProps>(\n ({\n id,\n isFocused,\n theme,\n editable,\n validationState,\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n isTextArea,\n numberOfLines,\n isDropdownTrigger,\n hasTags,\n $size,\n valueComponentType,\n }) => ({\n ...getRNInputStyles({\n id,\n isFocused,\n theme,\n editable,\n validationState,\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n isTextArea,\n numberOfLines,\n isDropdownTrigger,\n hasTags,\n $size,\n valueComponentType,\n }),\n }),\n);\n\nconst _StyledBaseInput: React.ForwardRefRenderFunction<\n TextInput \| TouchableHighlight,\n StyledBaseInputProps\n> = (\n {\n name,\n isRequired,\n isDisabled,\n maxCharacters,\n handleOnFocus,\n handleOnChange,\n handleOnBlur,\n handleOnSubmit,\n handleOnInput,\n handleOnKeyDown,\n handleOnClick,\n keyboardType = 'text',\n keyboardReturnKeyType,\n autoCompleteSuggestionType,\n accessibilityProps,\n currentInteraction,\n setCurrentInteraction,\n type,\n numberOfLines,\n isTextArea,\n hasPopup,\n shouldIgnoreBlurAnimation,\n autoCapitalize,\n as: renderAs,\n $size,\n ...props\n },\n ref,\n) => {\n const buttonValue = props.value ? props.value : props.placeholder;\n const { theme } = useTheme();\n const commonProps = {\n onBlur: (): void => {\n // In certain cases like SelectInput, we want to ignore the blur animation when option item is clicked.\n // The selectinput should always look like it is in focus otherwise it triggers blur + focus again which can cause flicker\n if (!shouldIgnoreBlurAnimation) {\n setCurrentInteraction('default');\n }\n },\n isFocused: currentInteraction === 'focus',\n };\n\n return renderAs === 'button' ? (\n <StyledNativeBaseButton\n // the types of styled-components for react-native is creating a mess, so there's no other option but to type `ref` as any\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref={ref as any}\n onPress={(): void => {\n handleOnClick?.({ name, value: props.value });\n }}\n onFocus={(): void => {\n handleOnFocus?.({ name, value: props.value });\n setCurrentInteraction('focus');\n }}\n as={undefined}\n $size={$size}\n {...commonProps}\n {...props}\n {...accessibilityProps}\n >\n <Text\n color={\n props.value && !isDisabled ? 'surface.text.gray.subtle' : 'surface.text.gray.disabled'\n }\n truncateAfterLines={1}\n textAlign={props.textAlign}\n size={$size}\n >\n {buttonValue}\n </Text>\n </StyledNativeBaseButton>\n ) : (\n <StyledNativeBaseInput\n // the types of styled-components for react-native is creating a mess, so there's no other option but to type `ref` as any\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n ref={ref as any}\n multiline={isTextArea}\n numberOfLines={numberOfLines}\n editable={!isDisabled}\n maxLength={maxCharacters}\n placeholderTextColor={theme.colors.surface.text.gray.disabled}\n onFocus={(event): void => {\n handleOnFocus?.({ name, value: event?.nativeEvent.text });\n // React Native does not have native onPress event on Input elements so for consistency of API we call it on onFocus which also gets triggered on clicks\n handleOnClick?.({ name, value: event?.nativeEvent.text });\n setCurrentInteraction('focus');\n }}\n onChangeText={(text): void => {\n handleOnChange?.({ name, value: text });\n handleOnInput?.({ name, value: text });\n }}\n onEndEditing={(event): void => handleOnBlur?.({ name, value: event?.nativeEvent.text })}\n onSubmitEditing={(event): void => handleOnSubmit?.({ name, value: event?.nativeEvent.text })}\n onKeyPress={(event): void => {\n handleOnKeyDown?.({\n name,\n key: event?.nativeEvent.key,\n event: (event as unknown) as React.KeyboardEvent<HTMLInputElement>, // TODO: handle platform specific type\n });\n }}\n // @ts-expect-error styled-components have limited keyboard types('default' \| 'email-address' \| 'numeric' \| 'phone-pad' \| 'number-pad' \| 'decimal-pad') compared to the actual supported types so ignoring the error.\n // source: https://reactnative.dev/docs/textinput/#keyboardtype\n keyboardType={KeyboardTypeToNativeValuesMap[keyboardType]}\n returnKeyType={keyboardReturnKeyType}\n autoCompleteType={\n autoCompleteSuggestionType\n ? (autoCompleteSuggestionTypeAndroid[\n autoCompleteSuggestionType as Platform.CastNative<\n BaseInputProps['autoCompleteSuggestionType']\n >\n ] as StyledComponentAutoCompleteAndroid)\n : undefined\n }\n secureTextEntry={type === 'password'}\n isTextArea={isTextArea}\n textContentType={\n autoCompleteSuggestionType\n ? autoCompleteSuggestionTypeIOS[\n autoCompleteSuggestionType as Platform.CastNative<\n BaseInputProps['autoCompleteSuggestionType']\n >\n ]\n : undefined\n }\n autoCapitalize={autoCapitalize}\n $size={$size}\n {...commonProps}\n {...props}\n {...accessibilityProps}\n />\n );\n};\n\nconst StyledBaseInput = assignWithoutSideEffects(React.forwardRef(_StyledBaseInput), {\n displayName: 'StyledBaseInput',\n});\n\nexport { StyledBaseInput };\n"],"names":["autoCompleteSuggestionTypeAndroid","none","name","email","username","password","newPassword","oneTimeCode","telephone","postalCode","countryName","creditCardNumber","creditCardCSC","creditCardExpiry","creditCardExpiryMonth","creditCardExpiryYear","autoCompleteSuggestionTypeIOS","KeyboardTypeToNativeValuesMap","text","search","url","decimal","getInputHeight","_ref","isTextArea","hasTags","numberOfLines","isDropdownTrigger","size","lines","baseInputHeight","undefined","makeSize","sizeToken","getRNInputStyles","props","Object","assign","getBaseInputStyles","theme","isFocused","isDisabled","editable","validationState","leadingIcon","prefix","trailingInteractionElement","leadingInteractionElement","suffix","trailingIcon","$size","valueComponentType","lineHeight","RNPlatform","select","android","typography","lineHeights","ios","textAlignVertical","height","StyledNativeBaseInput","styled","TextInput","_ref2","id","StyledNativeBaseButton","TouchableOpacity","_ref3","_StyledBaseInput","_ref4","ref","isRequired","maxCharacters","handleOnFocus","handleOnChange","handleOnBlur","handleOnSubmit","handleOnInput","handleOnKeyDown","handleOnClick","_ref4$keyboardType","keyboardType","keyboardReturnKeyType","autoCompleteSuggestionType","accessibilityProps","currentInteraction","setCurrentInteraction","type","hasPopup","shouldIgnoreBlurAnimation","autoCapitalize","renderAs","as","_objectWithoutProperties","_excluded","buttonValue","value","placeholder","_useTheme","useTheme","commonProps","onBlur","_jsx","onPress","onFocus","children","Text","color","truncateAfterLines","textAlign","multiline","maxLength","placeholderTextColor","colors","surface","gray","disabled","event","nativeEvent","onChangeText","onEndEditing","onSubmitEditing","onKeyPress","key","returnKeyType","autoCompleteType","secureTextEntry","textContentType","StyledBaseInput","assignWithoutSideEffects","React","forwardRef","displayName"],"mappings":"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"}

package/build/lib/native/components/Input/BaseInput/baseInputStyles.js CHANGED Viewed

@@ -12,7 +12,7 @@ import '../../BladeProvider/useTheme.js';
 import getIn from '../../../utils/lodashButBetter/get.js';
 import getHeadingStyles from '../../Typography/Heading/getHeadingStyles.js';
-var getBaseInputState=function getBaseInputState(_ref){var isFocused=_ref.isFocused,isHovered=_ref.isHovered,isDisabled=_ref.isDisabled;if(isDisabled){return 'disabled';}else if(isFocused){return 'focused';}else if(isHovered){return 'hovered';}else {return 'default';}};var getInputBackgroundAndBorderStyles=function getInputBackgroundAndBorderStyles(_ref2){var theme=_ref2.theme,isHovered=_ref2.isHovered,isFocused=_ref2.isFocused,isDisabled=_ref2.isDisabled,validationState=_ref2.validationState,isTextArea=_ref2.isTextArea,isDropdownTrigger=_ref2.isDropdownTrigger;var backgroundColor=getIn(theme.colors,baseInputBackgroundColor.default);var borderColor=getIn(theme.colors,baseInputBorderColor.default);var borderWidth=getIn(theme.border.width,baseInputBorderWidth.default);var baseInputState=getBaseInputState({isFocused:isFocused,isHovered:isHovered,isDisabled:isDisabled});backgroundColor=getIn(theme.colors,baseInputBackgroundColor[baseInputState]);borderColor=getIn(theme.colors,baseInputBorderColor[baseInputState]);borderWidth=getIn(theme.border.width,baseInputBorderWidth[baseInputState]);if(validationState==='error'){borderColor=getIn(theme.colors,baseInputBorderColor.error);borderWidth=getIn(theme.border.width,baseInputBorderWidth.error);}else if(validationState==='success'){borderColor=getIn(theme.colors,baseInputBorderColor.success);borderWidth=getIn(theme.border.width,baseInputBorderWidth.success);}return Object.assign({backgroundColor:backgroundColor,borderRadius:makeBorderSize(theme.border.radius.medium),borderStyle:'solid',display:'flex',flexDirection:'row',width:'100%',alignItems:isTextArea?'flex-start':undefined,position:'relative',height:isDropdownTrigger?'auto':undefined,border:'none'},getBaseInputBorderStyles({theme:theme,borderColor:borderColor,borderWidth:borderWidth,isFocused:isFocused}));};var getLeftPadding=function getLeftPadding(_ref3){var theme=_ref3.theme,isDropdownTrigger=_ref3.isDropdownTrigger,hasLeadingIcon=_ref3.hasLeadingIcon,hasPrefix=_ref3.hasPrefix,size=_ref3.size;if(isDropdownTrigger){return theme.spacing[0];}if(hasLeadingIcon||hasPrefix){return theme.spacing[3];}return theme.spacing[baseInputPaddingTokens.left[size]];};var getRightPadding=function getRightPadding(_ref4){var theme=_ref4.theme,hasTrailingInteractionElement=_ref4.hasTrailingInteractionElement,hasSuffix=_ref4.hasSuffix,hasTrailingIcon=_ref4.hasTrailingIcon,size=_ref4.size;if(hasTrailingInteractionElement||hasSuffix||hasTrailingIcon){return theme.spacing[3];}return theme.spacing[baseInputPaddingTokens.right[size]];};var getBaseInputStyles=function getBaseInputStyles(_ref5){var theme=_ref5.theme,isDisabled=_ref5.isDisabled,leadingIcon=_ref5.leadingIcon,prefix=_ref5.prefix,trailingInteractionElement=_ref5.trailingInteractionElement,leadingInteractionElement=_ref5.leadingInteractionElement,suffix=_ref5.suffix,trailingIcon=_ref5.trailingIcon,textAlign=_ref5.textAlign,isTextArea=_ref5.isTextArea,hasTags=_ref5.hasTags,isDropdownTrigger=_ref5.isDropdownTrigger,size=_ref5.size,valueComponentType=_ref5.valueComponentType;var _getInputVisualsToBeR=getInputVisualsToBeRendered({leadingIcon:leadingIcon,prefix:prefix,trailingInteractionElement:trailingInteractionElement,leadingInteractionElement:leadingInteractionElement,suffix:suffix,trailingIcon:trailingIcon,size:size}),hasLeadingIcon=_getInputVisualsToBeR.hasLeadingIcon,hasPrefix=_getInputVisualsToBeR.hasPrefix,hasTrailingInteractionElement=_getInputVisualsToBeR.hasTrailingInteractionElement,hasSuffix=_getInputVisualsToBeR.hasSuffix,hasTrailingIcon=_getInputVisualsToBeR.hasTrailingIcon;var isDropdownWithTags=isDropdownTrigger&&hasTags;var isReactNative=getPlatformType()==='react-native';return Object.assign({},valueComponentType==='heading'?getHeadingStyles({size:size,weight:'regular',color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.subtle',theme:theme}):getTextStyles({size:size,variant:'body',weight:'regular',color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.subtle',theme:theme}),{flex:1,backgroundColor:'transparent',paddingTop:makeSpace(theme.spacing[baseInputPaddingTokens.top[size]]),paddingBottom:makeSpace(theme.spacing[baseInputPaddingTokens.bottom[size]]),paddingLeft:makeSpace(getLeftPadding({theme:theme,isDropdownTrigger:isDropdownTrigger,hasLeadingIcon:hasLeadingIcon,hasPrefix:hasPrefix,size:size})),paddingRight:getRightPadding({theme:theme,hasTrailingInteractionElement:hasTrailingInteractionElement,hasSuffix:hasSuffix,hasTrailingIcon:hasTrailingIcon,size:size}),textAlign:textAlign,width:'100%',height:isTextArea||isDropdownWithTags?undefined:makeSpace(baseInputHeight[size]),minHeight:isDropdownWithTags?undefined:makeSpace(baseInputHeight[size])},isReactNative?{}:{resize:'none'});};var getAnimatedBaseInputWrapperMaxHeight=function getAnimatedBaseInputWrapperMaxHeight(_ref6){var maxTagRows=_ref6.maxTagRows,showAllTags=_ref6.showAllTags,size=_ref6.size;if(maxTagRows==='single'){return baseInputHeight[size];}if(maxTagRows==='multiple'){return baseInputWrapperMaxHeight[size];}return showAllTags?baseInputWrapperMaxHeight[size]:baseInputHeight[size];};
+var getBaseInputState=function getBaseInputState(_ref){var isFocused=_ref.isFocused,isHovered=_ref.isHovered,isDisabled=_ref.isDisabled;if(isDisabled){return 'disabled';}else if(isFocused){return 'focused';}else if(isHovered){return 'hovered';}else {return 'default';}};var getInputBackgroundAndBorderStyles=function getInputBackgroundAndBorderStyles(_ref2){var theme=_ref2.theme,isHovered=_ref2.isHovered,isFocused=_ref2.isFocused,isDisabled=_ref2.isDisabled,validationState=_ref2.validationState,isTextArea=_ref2.isTextArea,isDropdownTrigger=_ref2.isDropdownTrigger;var backgroundColor=getIn(theme.colors,baseInputBackgroundColor.default);var borderColor=getIn(theme.colors,baseInputBorderColor.default);var borderWidth=getIn(theme.border.width,baseInputBorderWidth.default);var baseInputState=getBaseInputState({isFocused:isFocused,isHovered:isHovered,isDisabled:isDisabled});backgroundColor=getIn(theme.colors,baseInputBackgroundColor[baseInputState]);borderColor=getIn(theme.colors,baseInputBorderColor[baseInputState]);borderWidth=getIn(theme.border.width,baseInputBorderWidth[baseInputState]);if(validationState==='error'){borderColor=getIn(theme.colors,baseInputBorderColor.error);borderWidth=getIn(theme.border.width,baseInputBorderWidth.error);}else if(validationState==='success'){borderColor=getIn(theme.colors,baseInputBorderColor.success);borderWidth=getIn(theme.border.width,baseInputBorderWidth.success);}return Object.assign({backgroundColor:backgroundColor,borderRadius:makeBorderSize(theme.border.radius.medium),borderStyle:'solid',display:'flex',flexDirection:'row',width:'100%',alignItems:isTextArea?'flex-start':undefined,position:'relative',height:isDropdownTrigger&&!isTextArea?'auto':undefined,border:'none'},getBaseInputBorderStyles({theme:theme,borderColor:borderColor,borderWidth:borderWidth,isFocused:isFocused}));};var getLeftPadding=function getLeftPadding(_ref3){var theme=_ref3.theme,isDropdownTrigger=_ref3.isDropdownTrigger,hasLeadingIcon=_ref3.hasLeadingIcon,hasPrefix=_ref3.hasPrefix,size=_ref3.size;if(isDropdownTrigger){return theme.spacing[0];}if(hasLeadingIcon||hasPrefix){return theme.spacing[3];}return theme.spacing[baseInputPaddingTokens.left[size]];};var getRightPadding=function getRightPadding(_ref4){var theme=_ref4.theme,hasTrailingInteractionElement=_ref4.hasTrailingInteractionElement,hasSuffix=_ref4.hasSuffix,hasTrailingIcon=_ref4.hasTrailingIcon,size=_ref4.size;if(hasTrailingInteractionElement||hasSuffix||hasTrailingIcon){return theme.spacing[3];}return theme.spacing[baseInputPaddingTokens.right[size]];};var getBaseInputStyles=function getBaseInputStyles(_ref5){var theme=_ref5.theme,isDisabled=_ref5.isDisabled,leadingIcon=_ref5.leadingIcon,prefix=_ref5.prefix,trailingInteractionElement=_ref5.trailingInteractionElement,leadingInteractionElement=_ref5.leadingInteractionElement,suffix=_ref5.suffix,trailingIcon=_ref5.trailingIcon,textAlign=_ref5.textAlign,isTextArea=_ref5.isTextArea,hasTags=_ref5.hasTags,isDropdownTrigger=_ref5.isDropdownTrigger,size=_ref5.size,valueComponentType=_ref5.valueComponentType;var _getInputVisualsToBeR=getInputVisualsToBeRendered({leadingIcon:leadingIcon,prefix:prefix,trailingInteractionElement:trailingInteractionElement,leadingInteractionElement:leadingInteractionElement,suffix:suffix,trailingIcon:trailingIcon,size:size}),hasLeadingIcon=_getInputVisualsToBeR.hasLeadingIcon,hasPrefix=_getInputVisualsToBeR.hasPrefix,hasTrailingInteractionElement=_getInputVisualsToBeR.hasTrailingInteractionElement,hasSuffix=_getInputVisualsToBeR.hasSuffix,hasTrailingIcon=_getInputVisualsToBeR.hasTrailingIcon;var isDropdownWithTags=isDropdownTrigger&&hasTags;var isReactNative=getPlatformType()==='react-native';return Object.assign({},valueComponentType==='heading'?getHeadingStyles({size:size,weight:'regular',color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.subtle',theme:theme}):getTextStyles({size:size,variant:'body',weight:'regular',color:isDisabled?'surface.text.gray.disabled':'surface.text.gray.subtle',theme:theme}),{flex:1,backgroundColor:'transparent',paddingTop:makeSpace(theme.spacing[baseInputPaddingTokens.top[size]]),paddingBottom:makeSpace(theme.spacing[baseInputPaddingTokens.bottom[size]]),paddingLeft:makeSpace(getLeftPadding({theme:theme,isDropdownTrigger:isDropdownTrigger,hasLeadingIcon:hasLeadingIcon,hasPrefix:hasPrefix,size:size})),paddingRight:getRightPadding({theme:theme,hasTrailingInteractionElement:hasTrailingInteractionElement,hasSuffix:hasSuffix,hasTrailingIcon:hasTrailingIcon,size:size}),textAlign:textAlign,width:'100%',height:isTextArea||isDropdownWithTags?undefined:makeSpace(baseInputHeight[size]),minHeight:isTextArea||isDropdownWithTags?undefined:makeSpace(baseInputHeight[size])},isReactNative?{}:{resize:'none'});};var getAnimatedBaseInputWrapperMaxHeight=function getAnimatedBaseInputWrapperMaxHeight(_ref6){var maxTagRows=_ref6.maxTagRows,showAllTags=_ref6.showAllTags,size=_ref6.size;if(maxTagRows==='single'){return baseInputHeight[size];}if(maxTagRows==='multiple'){return baseInputWrapperMaxHeight[size];}return showAllTags?baseInputWrapperMaxHeight[size]:baseInputHeight[size];};
 export { getAnimatedBaseInputWrapperMaxHeight, getBaseInputState, getBaseInputStyles, getInputBackgroundAndBorderStyles };
 //# sourceMappingURL=baseInputStyles.js.map

package/build/lib/native/components/Input/BaseInput/baseInputStyles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"baseInputStyles.js","sources":["../../../../../../src/components/Input/BaseInput/baseInputStyles.ts"],"sourcesContent":["import type { CSSObject } from 'styled-components';\nimport type { BaseInputProps } from './BaseInput';\nimport { getBaseInputBorderStyles } from './getBaseInputBorderStyles';\nimport {\n baseInputBackgroundColor,\n baseInputBorderColor,\n baseInputBorderWidth,\n baseInputHeight,\n baseInputPaddingTokens,\n baseInputWrapperMaxHeight,\n} from './baseInputTokens';\nimport { getInputVisualsToBeRendered } from './BaseInputVisuals';\nimport type { BaseInputWrapperProps } from './types';\nimport type { Theme } from '~components/BladeProvider';\nimport getTextStyles from '~components/Typography/Text/getTextStyles';\nimport { makeSpace } from '~utils/makeSpace';\nimport { makeBorderSize } from '~utils/makeBorderSize';\nimport { getPlatformType } from '~utils';\nimport getIn from '~utils/lodashButBetter/get';\nimport getHeadingStyles from '~components/Typography/Heading/getHeadingStyles';\n\ntype GetInputStyles = Pick<\n BaseInputProps,\n \| 'isDisabled'\n \| 'validationState'\n \| 'leadingIcon'\n \| 'prefix'\n \| 'trailingInteractionElement'\n \| 'leadingInteractionElement'\n \| 'suffix'\n \| 'trailingIcon'\n \| 'textAlign'\n \| 'isDropdownTrigger'\n \| 'valueComponentType'\n> & {\n isHovered?: boolean;\n isFocused?: boolean;\n isTextArea?: boolean;\n hasTags?: boolean;\n theme: Theme;\n size: NonNullable<BaseInputProps['size']>;\n};\n\nexport const getBaseInputState = ({\n isFocused,\n isHovered,\n isDisabled,\n}: {\n isFocused?: boolean;\n isHovered?: boolean;\n isDisabled?: boolean;\n}): 'focused' \| 'hovered' \| 'disabled' \| 'default' => {\n if (isDisabled) {\n return 'disabled';\n } else if (isFocused) {\n return 'focused';\n } else if (isHovered) {\n return 'hovered';\n } else {\n return 'default';\n }\n};\n\nexport const getInputBackgroundAndBorderStyles = ({\n theme,\n isHovered,\n isFocused,\n isDisabled,\n validationState,\n isTextArea,\n isDropdownTrigger,\n}: Pick<\n GetInputStyles,\n \| 'theme'\n \| 'isFocused'\n \| 'isDisabled'\n \| 'validationState'\n \| 'isHovered'\n \| 'isTextArea'\n \| 'isDropdownTrigger'\n>): CSSObject => {\n // normal state\n let backgroundColor = getIn(theme.colors, baseInputBackgroundColor.default);\n let borderColor = getIn(theme.colors, baseInputBorderColor.default);\n let borderWidth = getIn(theme.border.width, baseInputBorderWidth.default);\n\n const baseInputState = getBaseInputState({ isFocused, isHovered, isDisabled });\n\n backgroundColor = getIn(theme.colors, baseInputBackgroundColor[baseInputState]);\n borderColor = getIn(theme.colors, baseInputBorderColor[baseInputState]);\n borderWidth = getIn(theme.border.width, baseInputBorderWidth[baseInputState]);\n\n if (validationState === 'error') {\n borderColor = getIn(theme.colors, baseInputBorderColor.error);\n borderWidth = getIn(theme.border.width, baseInputBorderWidth.error);\n } else if (validationState === 'success') {\n borderColor = getIn(theme.colors, baseInputBorderColor.success);\n borderWidth = getIn(theme.border.width, baseInputBorderWidth.success);\n }\n\n return {\n backgroundColor,\n borderRadius: makeBorderSize(theme.border.radius.medium),\n borderStyle: 'solid',\n display: 'flex',\n flexDirection: 'row',\n width: '100%',\n alignItems: isTextArea ? 'flex-start' : undefined,\n position: 'relative',\n height: isDropdownTrigger ? 'auto' : undefined,\n border: 'none',\n ...getBaseInputBorderStyles({ theme, borderColor, borderWidth, isFocused }),\n };\n};\n\nconst getLeftPadding = ({\n theme,\n isDropdownTrigger,\n hasLeadingIcon,\n hasPrefix,\n size,\n}: {\n theme: Theme;\n hasLeadingIcon: boolean;\n hasPrefix: boolean;\n isDropdownTrigger: GetInputStyles['isDropdownTrigger'];\n size: GetInputStyles['size'];\n}): number => {\n if (isDropdownTrigger) {\n return theme.spacing[0];\n }\n\n if (hasLeadingIcon \|\| hasPrefix) {\n return theme.spacing[3];\n }\n\n return theme.spacing[baseInputPaddingTokens.left[size]];\n};\n\nconst getRightPadding = ({\n theme,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingIcon,\n size,\n}: {\n theme: Theme;\n hasTrailingInteractionElement: boolean;\n hasSuffix: boolean;\n hasTrailingIcon: boolean;\n size: GetInputStyles['size'];\n}): number => {\n if (hasTrailingInteractionElement \|\| hasSuffix \|\| hasTrailingIcon) {\n return theme.spacing[3];\n }\n return theme.spacing[baseInputPaddingTokens.right[size]];\n};\n\nexport const getBaseInputStyles = ({\n theme,\n isDisabled,\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n textAlign,\n isTextArea,\n hasTags,\n isDropdownTrigger,\n size,\n valueComponentType,\n}: GetInputStyles): CSSObject => {\n const {\n hasLeadingIcon,\n hasPrefix,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingIcon,\n } = getInputVisualsToBeRendered({\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n size,\n });\n\n const isDropdownWithTags = isDropdownTrigger && hasTags;\n const isReactNative = getPlatformType() === 'react-native';\n\n return {\n ...(valueComponentType === 'heading'\n ? getHeadingStyles({\n size,\n weight: 'regular',\n color: isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.subtle',\n theme,\n })\n : getTextStyles({\n size,\n variant: 'body',\n weight: 'regular',\n color: isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.subtle',\n theme,\n })),\n\n // take the full available width of parent container for input field\n flex: 1,\n backgroundColor: 'transparent',\n\n paddingTop: makeSpace(theme.spacing[baseInputPaddingTokens.top[size]]),\n paddingBottom: makeSpace(theme.spacing[baseInputPaddingTokens.bottom[size]]),\n paddingLeft: makeSpace(\n getLeftPadding({ theme, isDropdownTrigger, hasLeadingIcon, hasPrefix, size }),\n ),\n paddingRight: getRightPadding({\n theme,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingIcon,\n size,\n }),\n\n textAlign,\n width: '100%',\n height: isTextArea \|\| isDropdownWithTags ? undefined : makeSpace(baseInputHeight[size]),\n minHeight: isDropdownWithTags ? undefined : makeSpace(baseInputHeight[size]),\n ...(isReactNative ? {} : { resize: 'none' }),\n };\n};\n\nexport const getAnimatedBaseInputWrapperMaxHeight = ({\n maxTagRows,\n showAllTags,\n size,\n}: Pick<BaseInputWrapperProps, 'maxTagRows' \| 'showAllTags' \| 'size'>): number => {\n if (maxTagRows === 'single') {\n return baseInputHeight[size];\n }\n\n if (maxTagRows === 'multiple') {\n return baseInputWrapperMaxHeight[size];\n }\n\n // In expandable, max-height depends on the state\n return showAllTags ? baseInputWrapperMaxHeight[size] : baseInputHeight[size];\n};\n"],"names":["getBaseInputState","_ref","isFocused","isHovered","isDisabled","getInputBackgroundAndBorderStyles","_ref2","theme","validationState","isTextArea","isDropdownTrigger","backgroundColor","getIn","colors","baseInputBackgroundColor","default","borderColor","baseInputBorderColor","borderWidth","border","width","baseInputBorderWidth","baseInputState","error","success","Object","assign","borderRadius","makeBorderSize","radius","medium","borderStyle","display","flexDirection","alignItems","undefined","position","height","getBaseInputBorderStyles","getLeftPadding","_ref3","hasLeadingIcon","hasPrefix","size","spacing","baseInputPaddingTokens","left","getRightPadding","_ref4","hasTrailingInteractionElement","hasSuffix","hasTrailingIcon","right","getBaseInputStyles","_ref5","leadingIcon","prefix","trailingInteractionElement","leadingInteractionElement","suffix","trailingIcon","textAlign","hasTags","valueComponentType","_getInputVisualsToBeR","getInputVisualsToBeRendered","isDropdownWithTags","isReactNative","getPlatformType","getHeadingStyles","weight","color","getTextStyles","variant","flex","paddingTop","makeSpace","top","paddingBottom","bottom","paddingLeft","paddingRight","baseInputHeight","minHeight","resize","getAnimatedBaseInputWrapperMaxHeight","_ref6","maxTagRows","showAllTags","baseInputWrapperMaxHeight"],"mappings":"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"}
1	+ {"version":3,"file":"baseInputStyles.js","sources":["../../../../../../src/components/Input/BaseInput/baseInputStyles.ts"],"sourcesContent":["import type { CSSObject } from 'styled-components';\nimport type { BaseInputProps } from './BaseInput';\nimport { getBaseInputBorderStyles } from './getBaseInputBorderStyles';\nimport {\n baseInputBackgroundColor,\n baseInputBorderColor,\n baseInputBorderWidth,\n baseInputHeight,\n baseInputPaddingTokens,\n baseInputWrapperMaxHeight,\n} from './baseInputTokens';\nimport { getInputVisualsToBeRendered } from './BaseInputVisuals';\nimport type { BaseInputWrapperProps } from './types';\nimport type { Theme } from '~components/BladeProvider';\nimport getTextStyles from '~components/Typography/Text/getTextStyles';\nimport { makeSpace } from '~utils/makeSpace';\nimport { makeBorderSize } from '~utils/makeBorderSize';\nimport { getPlatformType } from '~utils';\nimport getIn from '~utils/lodashButBetter/get';\nimport getHeadingStyles from '~components/Typography/Heading/getHeadingStyles';\n\ntype GetInputStyles = Pick<\n BaseInputProps,\n \| 'isDisabled'\n \| 'validationState'\n \| 'leadingIcon'\n \| 'prefix'\n \| 'trailingInteractionElement'\n \| 'leadingInteractionElement'\n \| 'suffix'\n \| 'trailingIcon'\n \| 'textAlign'\n \| 'isDropdownTrigger'\n \| 'valueComponentType'\n> & {\n isHovered?: boolean;\n isFocused?: boolean;\n isTextArea?: boolean;\n hasTags?: boolean;\n theme: Theme;\n size: NonNullable<BaseInputProps['size']>;\n};\n\nexport const getBaseInputState = ({\n isFocused,\n isHovered,\n isDisabled,\n}: {\n isFocused?: boolean;\n isHovered?: boolean;\n isDisabled?: boolean;\n}): 'focused' \| 'hovered' \| 'disabled' \| 'default' => {\n if (isDisabled) {\n return 'disabled';\n } else if (isFocused) {\n return 'focused';\n } else if (isHovered) {\n return 'hovered';\n } else {\n return 'default';\n }\n};\n\nexport const getInputBackgroundAndBorderStyles = ({\n theme,\n isHovered,\n isFocused,\n isDisabled,\n validationState,\n isTextArea,\n isDropdownTrigger,\n}: Pick<\n GetInputStyles,\n \| 'theme'\n \| 'isFocused'\n \| 'isDisabled'\n \| 'validationState'\n \| 'isHovered'\n \| 'isTextArea'\n \| 'isDropdownTrigger'\n>): CSSObject => {\n // normal state\n let backgroundColor = getIn(theme.colors, baseInputBackgroundColor.default);\n let borderColor = getIn(theme.colors, baseInputBorderColor.default);\n let borderWidth = getIn(theme.border.width, baseInputBorderWidth.default);\n\n const baseInputState = getBaseInputState({ isFocused, isHovered, isDisabled });\n\n backgroundColor = getIn(theme.colors, baseInputBackgroundColor[baseInputState]);\n borderColor = getIn(theme.colors, baseInputBorderColor[baseInputState]);\n borderWidth = getIn(theme.border.width, baseInputBorderWidth[baseInputState]);\n\n if (validationState === 'error') {\n borderColor = getIn(theme.colors, baseInputBorderColor.error);\n borderWidth = getIn(theme.border.width, baseInputBorderWidth.error);\n } else if (validationState === 'success') {\n borderColor = getIn(theme.colors, baseInputBorderColor.success);\n borderWidth = getIn(theme.border.width, baseInputBorderWidth.success);\n }\n\n return {\n backgroundColor,\n borderRadius: makeBorderSize(theme.border.radius.medium),\n borderStyle: 'solid',\n display: 'flex',\n flexDirection: 'row',\n width: '100%',\n alignItems: isTextArea ? 'flex-start' : undefined,\n position: 'relative',\n height: isDropdownTrigger && !isTextArea ? 'auto' : undefined,\n border: 'none',\n ...getBaseInputBorderStyles({ theme, borderColor, borderWidth, isFocused }),\n };\n};\n\nconst getLeftPadding = ({\n theme,\n isDropdownTrigger,\n hasLeadingIcon,\n hasPrefix,\n size,\n}: {\n theme: Theme;\n hasLeadingIcon: boolean;\n hasPrefix: boolean;\n isDropdownTrigger: GetInputStyles['isDropdownTrigger'];\n size: GetInputStyles['size'];\n}): number => {\n if (isDropdownTrigger) {\n return theme.spacing[0];\n }\n\n if (hasLeadingIcon \|\| hasPrefix) {\n return theme.spacing[3];\n }\n\n return theme.spacing[baseInputPaddingTokens.left[size]];\n};\n\nconst getRightPadding = ({\n theme,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingIcon,\n size,\n}: {\n theme: Theme;\n hasTrailingInteractionElement: boolean;\n hasSuffix: boolean;\n hasTrailingIcon: boolean;\n size: GetInputStyles['size'];\n}): number => {\n if (hasTrailingInteractionElement \|\| hasSuffix \|\| hasTrailingIcon) {\n return theme.spacing[3];\n }\n return theme.spacing[baseInputPaddingTokens.right[size]];\n};\n\nexport const getBaseInputStyles = ({\n theme,\n isDisabled,\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n textAlign,\n isTextArea,\n hasTags,\n isDropdownTrigger,\n size,\n valueComponentType,\n}: GetInputStyles): CSSObject => {\n const {\n hasLeadingIcon,\n hasPrefix,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingIcon,\n } = getInputVisualsToBeRendered({\n leadingIcon,\n prefix,\n trailingInteractionElement,\n leadingInteractionElement,\n suffix,\n trailingIcon,\n size,\n });\n\n const isDropdownWithTags = isDropdownTrigger && hasTags;\n const isReactNative = getPlatformType() === 'react-native';\n\n return {\n ...(valueComponentType === 'heading'\n ? getHeadingStyles({\n size,\n weight: 'regular',\n color: isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.subtle',\n theme,\n })\n : getTextStyles({\n size,\n variant: 'body',\n weight: 'regular',\n color: isDisabled ? 'surface.text.gray.disabled' : 'surface.text.gray.subtle',\n theme,\n })),\n\n // take the full available width of parent container for input field\n flex: 1,\n backgroundColor: 'transparent',\n\n paddingTop: makeSpace(theme.spacing[baseInputPaddingTokens.top[size]]),\n paddingBottom: makeSpace(theme.spacing[baseInputPaddingTokens.bottom[size]]),\n paddingLeft: makeSpace(\n getLeftPadding({ theme, isDropdownTrigger, hasLeadingIcon, hasPrefix, size }),\n ),\n paddingRight: getRightPadding({\n theme,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingIcon,\n size,\n }),\n\n textAlign,\n width: '100%',\n height: isTextArea \|\| isDropdownWithTags ? undefined : makeSpace(baseInputHeight[size]),\n minHeight: isTextArea \|\| isDropdownWithTags ? undefined : makeSpace(baseInputHeight[size]),\n ...(isReactNative ? {} : { resize: 'none' }),\n };\n};\n\nexport const getAnimatedBaseInputWrapperMaxHeight = ({\n maxTagRows,\n showAllTags,\n size,\n}: Pick<BaseInputWrapperProps, 'maxTagRows' \| 'showAllTags' \| 'size'>): number => {\n if (maxTagRows === 'single') {\n return baseInputHeight[size];\n }\n\n if (maxTagRows === 'multiple') {\n return baseInputWrapperMaxHeight[size];\n }\n\n // In expandable, max-height depends on the state\n return showAllTags ? baseInputWrapperMaxHeight[size] : baseInputHeight[size];\n};\n"],"names":["getBaseInputState","_ref","isFocused","isHovered","isDisabled","getInputBackgroundAndBorderStyles","_ref2","theme","validationState","isTextArea","isDropdownTrigger","backgroundColor","getIn","colors","baseInputBackgroundColor","default","borderColor","baseInputBorderColor","borderWidth","border","width","baseInputBorderWidth","baseInputState","error","success","Object","assign","borderRadius","makeBorderSize","radius","medium","borderStyle","display","flexDirection","alignItems","undefined","position","height","getBaseInputBorderStyles","getLeftPadding","_ref3","hasLeadingIcon","hasPrefix","size","spacing","baseInputPaddingTokens","left","getRightPadding","_ref4","hasTrailingInteractionElement","hasSuffix","hasTrailingIcon","right","getBaseInputStyles","_ref5","leadingIcon","prefix","trailingInteractionElement","leadingInteractionElement","suffix","trailingIcon","textAlign","hasTags","valueComponentType","_getInputVisualsToBeR","getInputVisualsToBeRendered","isDropdownWithTags","isReactNative","getPlatformType","getHeadingStyles","weight","color","getTextStyles","variant","flex","paddingTop","makeSpace","top","paddingBottom","bottom","paddingLeft","paddingRight","baseInputHeight","minHeight","resize","getAnimatedBaseInputWrapperMaxHeight","_ref6","maxTagRows","showAllTags","baseInputWrapperMaxHeight"],"mappings":"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"}

package/build/lib/native/components/Input/BaseInput/useTaggedInput.js ADDED Viewed

@@ -0,0 +1,13 @@
+import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
+import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
+import React__default from 'react';
+import { getTagsGroup } from '../../Tag/getTagsGroup.js';
+import 'react-native';
+import { isReactNative } from '../../../utils/platform/isReactNative.js';
+import '../../BladeProvider/useTheme.js';
+import { useControllableState } from '../../../utils/useControllable.js';
+var useTaggedInput=function useTaggedInput(_ref){var tags=_ref.tags,isDisabled=_ref.isDisabled,onTagChange=_ref.onTagChange,isTaggedInput=_ref.isTaggedInput,inputRef=_ref.inputRef,onChange=_ref.onChange,name=_ref.name,value=_ref.value,defaultValue=_ref.defaultValue;var _React$useState=React__default.useState(-1),_React$useState2=_slicedToArray(_React$useState,2),activeTagIndex=_React$useState2[0],setActiveTagIndex=_React$useState2[1];var _React$useState3=React__default.useState(defaultValue!=null?defaultValue:''),_React$useState4=_slicedToArray(_React$useState3,2),inputValueUncontrolled=_React$useState4[0],setInputValueUncontrolled=_React$useState4[1];var _useControllableState=useControllableState({value:tags,defaultValue:[],onChange:function onChange(tags){onTagChange==null?void 0:onTagChange({tags:tags});}}),_useControllableState2=_slicedToArray(_useControllableState,2),tagsValue=_useControllableState2[0],setTagsValue=_useControllableState2[1];var isTagsControlled=Boolean(tags);var getNewTagsArray=function getNewTagsArray(indexToRemove){var currentTags=tagsValue;if(!currentTags){return [];}if(indexToRemove<0||indexToRemove>=currentTags.length){return currentTags;}var newArray=currentTags.slice(0,indexToRemove).concat(currentTags.slice(indexToRemove+1));return newArray;};var getTags=React__default.useMemo(function(){return function(_ref2){var size=_ref2.size;return getTagsGroup({size:size,tags:tagsValue,activeTagIndex:activeTagIndex,isDisabled:isDisabled,onDismiss:function onDismiss(_ref3){var tagIndex=_ref3.tagIndex;console.log('dismiss',{tagIndex:tagIndex});if(!isTagsControlled){setTagsValue(function(){return getNewTagsArray(tagIndex);});}onTagChange==null?void 0:onTagChange({tags:getNewTagsArray(tagIndex)});}});};},[activeTagIndex,tags,tagsValue,isDisabled]);var handleTaggedInputChange=function handleTaggedInputChange(_ref4){var value=_ref4.value;if(!isTaggedInput){return;}setInputValueUncontrolled(value!=null?value:'');};var handleTagsClear=function handleTagsClear(){if(!isTaggedInput){return;}if(!isTagsControlled){setTagsValue(function(){return [];});}onTagChange==null?void 0:onTagChange({tags:[]});};var clearInput=function clearInput(){var isControlledValue=value!==undefined;if(isControlledValue){onChange==null?void 0:onChange({name:name,value:''});return;}if(!inputRef.current){return;}setInputValueUncontrolled('');if(isReactNative()){setTimeout(function(){var _inputRef$current;(_inputRef$current=inputRef.current)==null?void 0:_inputRef$current.clear();},10);return;}inputRef.current.value='';};var handleTaggedInputKeydown=function handleTaggedInputKeydown(e){if(!isTaggedInput){return;}var currentTags=tagsValue;var isControlledValue=value!==undefined;var inputValue=isControlledValue?value==null?void 0:value.trim():inputValueUncontrolled.trim();if(e.key==='Enter'||e.key===','){e.event.preventDefault==null?void 0:e.event.preventDefault();if(inputValue){if(!isTagsControlled){setTagsValue(function(){return [].concat(_toConsumableArray(currentTags),[inputValue]);});}onTagChange==null?void 0:onTagChange({tags:[].concat(_toConsumableArray(currentTags),[inputValue])});clearInput();setActiveTagIndex(-1);}}if(e.key==='Backspace'&&!inputValue&&activeTagIndex<0&&currentTags.length>0){if(!isTagsControlled){setTagsValue(function(){return currentTags.slice(0,-1);});}onTagChange==null?void 0:onTagChange({tags:currentTags.slice(0,-1)});}};return {activeTagIndex:activeTagIndex,setActiveTagIndex:setActiveTagIndex,getTags:getTags,handleTaggedInputKeydown:handleTaggedInputKeydown,handleTaggedInputChange:handleTaggedInputChange,handleTagsClear:handleTagsClear};};
+export { useTaggedInput };
+//# sourceMappingURL=useTaggedInput.js.map

package/build/lib/native/components/Input/BaseInput/useTaggedInput.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useTaggedInput.js","sources":["../../../../../../src/components/Input/BaseInput/useTaggedInput.ts"],"sourcesContent":["import React from 'react';\nimport type { BaseInputProps } from './BaseInput';\nimport type { BladeElementRefWithValue } from '~utils/types';\nimport type { FormInputOnEvent, FormInputOnKeyDownEvent } from '~components/Form/FormTypes';\n// import { isReactNative } from '~utils';\nimport { getTagsGroup } from '~components/Tag/getTagsGroup';\nimport { isReactNative } from '~utils';\nimport { useControllableState } from '~utils/useControllable';\n\ntype TaggedInputProps = {\n isTaggedInput?: boolean;\n tags?: string[];\n onTagChange?: ({ tags }: { tags: string[] }) => void;\n};\n\ntype UseTaggedInputProps = TaggedInputProps &\n Pick<BaseInputProps, 'isDisabled' | 'onChange' | 'name' | 'value' | 'defaultValue'> & {\n inputRef: React.RefObject<BladeElementRefWithValue | null>;\n };\n\ntype UseTaggedInputReturn = {\n activeTagIndex: number;\n setActiveTagIndex: (activeTagIndex: number) => void;\n getTags: ({ size }: { size: NonNullable<BaseInputProps['size']> }) => React.ReactElement[];\n handleTaggedInputKeydown: (e: FormInputOnKeyDownEvent) => void;\n handleTaggedInputChange: FormInputOnEvent;\n handleTagsClear: () => void;\n};\n\nconst useTaggedInput = ({\n tags,\n isDisabled,\n onTagChange,\n isTaggedInput,\n inputRef,\n onChange,\n name,\n value,\n defaultValue,\n}: UseTaggedInputProps): UseTaggedInputReturn => {\n const [activeTagIndex, setActiveTagIndex] = React.useState(-1);\n const [inputValueUncontrolled, setInputValueUncontrolled] = React.useState(defaultValue ?? '');\n const [tagsValue, setTagsValue] = useControllableState({\n value: tags,\n defaultValue: [],\n onChange: (tags) => {\n onTagChange?.({ tags });\n },\n });\n\n const isTagsControlled = Boolean(tags);\n\n const getNewTagsArray = (indexToRemove: number): string[] => {\n const currentTags = tagsValue;\n\n if (!currentTags) {\n return [];\n }\n\n // Check if the index is valid\n if (indexToRemove < 0 || indexToRemove >= currentTags.length) {\n return currentTags; // Return the original array\n }\n\n // Create a new array without the element at the specified index\n const newArray = currentTags\n .slice(0, indexToRemove)\n .concat(currentTags.slice(indexToRemove + 1));\n\n return newArray;\n };\n\n const getTags = React.useMemo(\n () => ({ size }: { size: NonNullable<BaseInputProps['size']> }): React.ReactElement[] => {\n return getTagsGroup({\n size,\n tags: tagsValue,\n activeTagIndex,\n isDisabled,\n onDismiss: ({ tagIndex }) => {\n console.log('dismiss', { tagIndex });\n if (!isTagsControlled) {\n setTagsValue(() => getNewTagsArray(tagIndex));\n }\n onTagChange?.({ tags: getNewTagsArray(tagIndex) });\n },\n });\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [activeTagIndex, tags, tagsValue, isDisabled],\n );\n\n const handleTaggedInputChange: FormInputOnEvent = ({ value }) => {\n if (!isTaggedInput) {\n return;\n }\n setInputValueUncontrolled(value ?? '');\n };\n\n const handleTagsClear = (): void => {\n if (!isTaggedInput) {\n return;\n }\n\n if (!isTagsControlled) {\n setTagsValue(() => []);\n }\n\n onTagChange?.({ tags: [] });\n };\n\n const clearInput = (): void => {\n const isControlledValue = value !== undefined;\n\n if (isControlledValue) {\n // In Controlled component, we don't clear input ourselves. We just call onChange with empty value\n onChange?.({ name, value: '' });\n return;\n }\n\n if (!inputRef.current) {\n return;\n }\n\n setInputValueUncontrolled('');\n\n if (isReactNative()) {\n setTimeout(() => {\n // eslint-disable-next-line @typescript-eslint/prefer-ts-expect-error\n // @ts-ignore: clear does exist in react native\n inputRef.current?.clear();\n }, 10);\n return;\n }\n\n inputRef.current.value = '';\n };\n\n const handleTaggedInputKeydown = (e: FormInputOnKeyDownEvent): void => {\n if (!isTaggedInput) {\n return;\n }\n\n const currentTags = tagsValue;\n const isControlledValue = value !== undefined;\n const inputValue = isControlledValue ? value?.trim() : inputValueUncontrolled.trim();\n if (e.key === 'Enter' || e.key === ',') {\n e.event.preventDefault?.(); // we don't want textarea to treat enter as line break in tagged inputs\n if (inputValue) {\n if (!isTagsControlled) {\n setTagsValue(() => [...currentTags, inputValue]);\n }\n onTagChange?.({ tags: [...currentTags, inputValue] });\n clearInput();\n setActiveTagIndex(-1);\n }\n }\n if (e.key === 'Backspace' && !inputValue && activeTagIndex < 0 && currentTags.length > 0) {\n if (!isTagsControlled) {\n setTagsValue(() => currentTags.slice(0, -1));\n }\n onTagChange?.({ tags: currentTags.slice(0, -1) });\n }\n };\n\n return {\n activeTagIndex,\n setActiveTagIndex,\n getTags,\n handleTaggedInputKeydown,\n handleTaggedInputChange,\n handleTagsClear,\n };\n};\n\nexport type { TaggedInputProps };\nexport { useTaggedInput };\n"],"names":["useTaggedInput","_ref","tags","isDisabled","onTagChange","isTaggedInput","inputRef","onChange","name","value","defaultValue","_React$useState","React","useState","_React$useState2","_slicedToArray","activeTagIndex","setActiveTagIndex","_React$useState3","_React$useState4","inputValueUncontrolled","setInputValueUncontrolled","_useControllableState","useControllableState","_useControllableState2","tagsValue","setTagsValue","isTagsControlled","Boolean","getNewTagsArray","indexToRemove","currentTags","length","newArray","slice","concat","getTags","useMemo","_ref2","size","getTagsGroup","onDismiss","_ref3","tagIndex","console","log","handleTaggedInputChange","_ref4","handleTagsClear","clearInput","isControlledValue","undefined","current","isReactNative","setTimeout","_inputRef$current","clear","handleTaggedInputKeydown","e","inputValue","trim","key","event","preventDefault","_toConsumableArray"],"mappings":"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"}

package/build/lib/native/components/Input/OTPInput/OTPInput.js CHANGED Viewed

@@ -18,7 +18,7 @@ import { metaAttribute } from '../../../utils/metaAttribute/metaAttribute.native
 import { MetaConstants } from '../../../utils/metaAttribute/metaConstants.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
-var _excluded=["autoFocus","errorText","helpText","isDisabled","keyboardReturnKeyType","keyboardType","label","accessibilityLabel","labelPosition","name","onChange","onFocus","onBlur","onOTPFilled","otpLength","placeholder","successText","validationState","value","isMasked","autoCompleteSuggestionType","testID","size"];var isReactNative=getPlatformType()==='react-native';var otpToArray=function otpToArray(code){var _code$split;return (_code$split=code==null?void 0:code.split(''))!=null?_code$split:Array(6).fill('');};var _OTPInput=function _OTPInput(_ref,incomingRef){var autoFocus=_ref.autoFocus,errorText=_ref.errorText,helpText=_ref.helpText,isDisabled=_ref.isDisabled,keyboardReturnKeyType=_ref.keyboardReturnKeyType,_ref$keyboardType=_ref.keyboardType,keyboardType=_ref$keyboardType===void 0?'decimal':_ref$keyboardType,label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,labelPosition=_ref.labelPosition,name=_ref.name,onChange=_ref.onChange,_onFocus=_ref.onFocus,_onBlur=_ref.onBlur,onOTPFilled=_ref.onOTPFilled,_ref$otpLength=_ref.otpLength,otpLength=_ref$otpLength===void 0?6:_ref$otpLength,placeholder=_ref.placeholder,successText=_ref.successText,validationState=_ref.validationState,inputValue=_ref.value,isMasked=_ref.isMasked,_ref$autoCompleteSugg=_ref.autoCompleteSuggestionType,autoCompleteSuggestionType=_ref$autoCompleteSugg===void 0?'oneTimeCode':_ref$autoCompleteSugg,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,styledProps=_objectWithoutProperties(_ref,_excluded);var inputRefs=[];var _useState=useState(otpToArray(inputValue)),_useState2=_slicedToArray(_useState,2),otpValue=_useState2[0],setOtpValue=_useState2[1];var _useState3=useState([]),_useState4=_slicedToArray(_useState3,2),inputType=_useState4[0],setInputType=_useState4[1];var isLabelLeftPositioned=labelPosition==='left';var _useFormId=useFormId('otp'),inputId=_useFormId.inputId,helpTextId=_useFormId.helpTextId,errorTextId=_useFormId.errorTextId,successTextId=_useFormId.successTextId;useImperativeHandle(incomingRef,function(){return inputRefs.map(function(ref){return ref.current;});},[inputRefs]);useEffect(function(){if(inputValue&&inputValue.length>=otpLength){onOTPFilled==null?void 0:onOTPFilled({value:inputValue.slice(0,otpLength),name:name});}else if(!inputValue&&otpValue.join('').length>=otpLength){onOTPFilled==null?void 0:onOTPFilled({value:otpValue.slice(0,otpLength).join(''),name:name});}},[otpValue,otpLength,name,inputValue,onOTPFilled]);useEffect(function(){otpValue.forEach(function(otp,index){if(!isEmpty(otp)&&!inputType[index]&&isMasked){var newInputType=Array.from(inputType);newInputType[index]='password';setInputType(newInputType);}if(isEmpty(otp)&&inputType[index]){var _newInputType=Array.from(inputType);_newInputType[index]=undefined;setInputType(_newInputType);}});},[otpValue,inputType,isMasked]);var setOtpValueByIndex=function setOtpValueByIndex(_ref2){var value=_ref2.value,index=_ref2.index;var newOtpValue=Array.from(otpValue);newOtpValue[index]=value;setOtpValue(newOtpValue);return newOtpValue.join('');};var focusOnOtpByIndex=function focusOnOtpByIndex(index){var _inputRefs$index,_inputRefs$index$curr;(_inputRefs$index=inputRefs[index])==null?void 0:(_inputRefs$index$curr=_inputRefs$index.current)==null?void 0:_inputRefs$index$curr.focus();if(!isReactNative){var _inputRefs$index2,_inputRefs$index2$cur;(_inputRefs$index2=inputRefs[index])==null?void 0:(_inputRefs$index2$cur=_inputRefs$index2.current)==null?void 0:_inputRefs$index2$cur.select();}};var handleOnChange=function handleOnChange(_ref3){var value=_ref3.value,currentOtpIndex=_ref3.currentOtpIndex;if(value&&value===' '){return;}if(inputValue&&inputValue.length>0){var newOtpValue=Array.from(inputValue);newOtpValue[currentOtpIndex]=value!=null?value:'';setOtpValue(newOtpValue);onChange==null?void 0:onChange({name:name,value:newOtpValue.join('')});}else if(value&&value.trim().length>1){setOtpValue(Array.from(value));onChange==null?void 0:onChange({name:name,value:value.trim().slice(0,otpLength)});}else if(otpValue[currentOtpIndex]!==(value==null?void 0:value.trim())){var _value$trim;var newValue=setOtpValueByIndex({value:(_value$trim=value==null?void 0:value.trim())!=null?_value$trim:'',index:currentOtpIndex});onChange==null?void 0:onChange({name:name,value:newValue});}};var handleOnInput=function handleOnInput(_ref4){var value=_ref4.value,currentOtpIndex=_ref4.currentOtpIndex;if(value&&value.trim().length===1){focusOnOtpByIndex(++currentOtpIndex);}};var handleOnKeyDown=function handleOnKeyDown(_ref5){var key=_ref5.key,code=_ref5.code,event=_ref5.event,currentOtpIndex=_ref5.currentOtpIndex;if(key==='Backspace'||code==='Backspace'||code==='Delete'||key==='Delete'){event.preventDefault==null?void 0:event.preventDefault();handleOnChange({value:'',currentOtpIndex:currentOtpIndex});focusOnOtpByIndex(--currentOtpIndex);}else if(key==='ArrowLeft'||code==='ArrowLeft'){event.preventDefault==null?void 0:event.preventDefault();focusOnOtpByIndex(--currentOtpIndex);}else if(key==='ArrowRight'||code==='ArrowRight'){event.preventDefault==null?void 0:event.preventDefault();focusOnOtpByIndex(++currentOtpIndex);}else if(key===' '||code==='Space'){event.preventDefault==null?void 0:event.preventDefault();}};var getHiddenInput=function getHiddenInput(){if(!isReactNative){var _ref6;return jsx("input",{hidden:true,id:inputId,name:name,value:(_ref6=inputValue!=null?inputValue:otpValue.join(''))!=null?_ref6:'',readOnly:true});}return null;};var getOTPInputFields=function getOTPInputFields(){var inputs=[];var _loop=function _loop(index){var _otpValue$index,_Array$from$index;var currentValue=inputValue?otpToArray(inputValue)[index]||'':otpValue[index]||'';var ref=React__default.createRef();var currentInputType=void 0;if(isMasked){currentInputType=inputValue?'password':inputType[index];}inputRefs.push(ref);inputs.push(jsx(BaseBox,{flex:1,marginLeft:index==0?'spacing.0':'spacing.3',children:jsx(BaseInput,{autoFocus:autoFocus&&index===0,accessibilityLabel:`${index===0?label||accessibilityLabel:''} character ${index+1}`,label:label,hideLabelText:true,id:`${inputId}-${index}`,textAlign:"center",ref:ref,name:name,value:currentValue,maxCharacters:((_otpValue$index=otpValue[index])==null?void 0:_otpValue$index.length)>0?1:undefined,onChange:function onChange(formEvent){return handleOnChange(Object.assign({},formEvent,{currentOtpIndex:index}));},onFocus:function onFocus(formEvent){return _onFocus==null?void 0:_onFocus(Object.assign({},formEvent,{inputIndex:index}));},onBlur:function onBlur(formEvent){return _onBlur==null?void 0:_onBlur(Object.assign({},formEvent,{inputIndex:index}));},onInput:function onInput(formEvent){return handleOnInput(Object.assign({},formEvent,{currentOtpIndex:index}));},onKeyDown:function onKeyDown(keyboardEvent){return handleOnKeyDown(Object.assign({},keyboardEvent,{currentOtpIndex:index}));},isDisabled:isDisabled,placeholder:(_Array$from$index=Array.from(placeholder!=null?placeholder:'')[index])!=null?_Array$from$index:'',isRequired:true,autoCompleteSuggestionType:autoCompleteSuggestionType,keyboardType:keyboardType,keyboardReturnKeyType:keyboardReturnKeyType,validationState:validationState,successText:successText,errorText:errorText,helpText:helpText,hideFormHint:true,type:currentInputType,size:size,valueComponentType:"heading"})},`${inputId}-${index}`));};for(var index=0;index<otpLength;index++){_loop(index);}return inputs;};return jsxs(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.OTPInput,testID:testID}),getStyledProps(styledProps),{children:[jsxs(BaseBox,{display:"flex",flexDirection:isLabelLeftPositioned?'row':'column',alignItems:isLabelLeftPositioned?'center':undefined,position:"relative",children:[Boolean(label)&&jsx(FormLabel,{as:"label",position:labelPosition,htmlFor:inputId,size:size,children:label}),jsxs(BaseBox,{display:"flex",flexDirection:"row",children:[getHiddenInput(),getOTPInputFields()]})]}),jsx(BaseBox,{marginLeft:makeSize(isLabelLeftPositioned?136:0),children:jsx(FormHint,{type:getHintType({validationState:validationState,hasHelpText:Boolean(helpText)}),helpText:helpText,errorText:errorText,successText:successText,helpTextId:helpTextId,errorTextId:errorTextId,successTextId:successTextId,size:size})})]}));};var OTPInput=React__default.forwardRef(_OTPInput);
+var _excluded=["autoFocus","errorText","helpText","isDisabled","keyboardReturnKeyType","keyboardType","label","accessibilityLabel","labelPosition","name","onChange","onFocus","onBlur","onOTPFilled","otpLength","placeholder","successText","validationState","value","isMasked","autoCompleteSuggestionType","testID","size"];var isReactNative=getPlatformType()==='react-native';var otpToArray=function otpToArray(code){var _code$split;return (_code$split=code==null?void 0:code.split(''))!=null?_code$split:Array(6).fill('');};var _OTPInput=function _OTPInput(_ref,incomingRef){var autoFocus=_ref.autoFocus,errorText=_ref.errorText,helpText=_ref.helpText,isDisabled=_ref.isDisabled,keyboardReturnKeyType=_ref.keyboardReturnKeyType,_ref$keyboardType=_ref.keyboardType,keyboardType=_ref$keyboardType===void 0?'decimal':_ref$keyboardType,label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,labelPosition=_ref.labelPosition,name=_ref.name,onChange=_ref.onChange,_onFocus=_ref.onFocus,_onBlur=_ref.onBlur,onOTPFilled=_ref.onOTPFilled,_ref$otpLength=_ref.otpLength,otpLength=_ref$otpLength===void 0?6:_ref$otpLength,placeholder=_ref.placeholder,successText=_ref.successText,validationState=_ref.validationState,inputValue=_ref.value,isMasked=_ref.isMasked,_ref$autoCompleteSugg=_ref.autoCompleteSuggestionType,autoCompleteSuggestionType=_ref$autoCompleteSugg===void 0?'oneTimeCode':_ref$autoCompleteSugg,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,styledProps=_objectWithoutProperties(_ref,_excluded);var inputRefs=[];var _useState=useState(otpToArray(inputValue)),_useState2=_slicedToArray(_useState,2),otpValue=_useState2[0],setOtpValue=_useState2[1];var _useState3=useState([]),_useState4=_slicedToArray(_useState3,2),inputType=_useState4[0],setInputType=_useState4[1];var isLabelLeftPositioned=labelPosition==='left';var _useFormId=useFormId('otp'),inputId=_useFormId.inputId,helpTextId=_useFormId.helpTextId,errorTextId=_useFormId.errorTextId,successTextId=_useFormId.successTextId;useImperativeHandle(incomingRef,function(){return inputRefs.map(function(ref){return ref.current;});},[inputRefs]);useEffect(function(){if(inputValue&&inputValue.length>=otpLength){onOTPFilled==null?void 0:onOTPFilled({value:inputValue.slice(0,otpLength),name:name});}else if(!inputValue&&otpValue.join('').length>=otpLength){onOTPFilled==null?void 0:onOTPFilled({value:otpValue.slice(0,otpLength).join(''),name:name});}},[otpValue,otpLength,name,inputValue,onOTPFilled]);useEffect(function(){otpValue.forEach(function(otp,index){if(!isEmpty(otp)&&!inputType[index]&&isMasked){var newInputType=Array.from(inputType);newInputType[index]='password';setInputType(newInputType);}if(isEmpty(otp)&&inputType[index]){var _newInputType=Array.from(inputType);_newInputType[index]=undefined;setInputType(_newInputType);}});},[otpValue,inputType,isMasked]);var setOtpValueByIndex=function setOtpValueByIndex(_ref2){var value=_ref2.value,index=_ref2.index;var newOtpValue=Array.from(otpValue);newOtpValue[index]=value;setOtpValue(newOtpValue);return newOtpValue.join('');};var focusOnOtpByIndex=function focusOnOtpByIndex(index){var _inputRefs$index,_inputRefs$index$curr;(_inputRefs$index=inputRefs[index])==null?void 0:(_inputRefs$index$curr=_inputRefs$index.current)==null?void 0:_inputRefs$index$curr.focus();if(!isReactNative){var _inputRefs$index2,_inputRefs$index2$cur;(_inputRefs$index2=inputRefs[index])==null?void 0:(_inputRefs$index2$cur=_inputRefs$index2.current)==null?void 0:_inputRefs$index2$cur.select();}};var handleOnChange=function handleOnChange(_ref3){var value=_ref3.value,currentOtpIndex=_ref3.currentOtpIndex;if(value&&value===' '){return;}if(inputValue&&inputValue.length>0){var newOtpValue=Array.from(inputValue);newOtpValue[currentOtpIndex]=value!=null?value:'';setOtpValue(newOtpValue);onChange==null?void 0:onChange({name:name,value:newOtpValue.join('')});}else if(value&&value.trim().length>1){setOtpValue(Array.from(value));onChange==null?void 0:onChange({name:name,value:value.trim().slice(0,otpLength)});}else if(otpValue[currentOtpIndex]!==(value==null?void 0:value.trim())){var _value$trim;var newValue=setOtpValueByIndex({value:(_value$trim=value==null?void 0:value.trim())!=null?_value$trim:'',index:currentOtpIndex});onChange==null?void 0:onChange({name:name,value:newValue});}};var handleOnInput=function handleOnInput(_ref4){var value=_ref4.value,currentOtpIndex=_ref4.currentOtpIndex;if(value&&value.trim().length===1){focusOnOtpByIndex(++currentOtpIndex);}};var handleOnKeyDown=function handleOnKeyDown(_ref5){var key=_ref5.key,code=_ref5.code,event=_ref5.event,currentOtpIndex=_ref5.currentOtpIndex;if(key==='Backspace'||code==='Backspace'||code==='Delete'||key==='Delete'){event.preventDefault==null?void 0:event.preventDefault();handleOnChange({value:'',currentOtpIndex:currentOtpIndex});focusOnOtpByIndex(--currentOtpIndex);}else if(key==='ArrowLeft'||code==='ArrowLeft'){event.preventDefault==null?void 0:event.preventDefault();focusOnOtpByIndex(--currentOtpIndex);}else if(key==='ArrowRight'||code==='ArrowRight'){event.preventDefault==null?void 0:event.preventDefault();focusOnOtpByIndex(++currentOtpIndex);}else if(key===' '||code==='Space'){event.preventDefault==null?void 0:event.preventDefault();}};var getHiddenInput=function getHiddenInput(){if(!isReactNative){var _ref6;return jsx("input",{hidden:true,id:inputId,name:name,value:(_ref6=inputValue!=null?inputValue:otpValue.join(''))!=null?_ref6:'',readOnly:true});}return null;};var getOTPInputFields=function getOTPInputFields(){var inputs=[];var _loop=function _loop(index){var _otpValue$index,_Array$from$index;var currentValue=inputValue?otpToArray(inputValue)[index]||'':otpValue[index]||'';var ref=React__default.createRef();var currentInputType;if(isMasked){currentInputType=inputValue?'password':inputType[index];}inputRefs.push(ref);inputs.push(jsx(BaseBox,{flex:1,marginLeft:index==0?'spacing.0':'spacing.3',children:jsx(BaseInput,{autoFocus:autoFocus&&index===0,accessibilityLabel:`${index===0?label||accessibilityLabel:''} character ${index+1}`,label:label,hideLabelText:true,id:`${inputId}-${index}`,textAlign:"center",ref:ref,name:name,value:currentValue,maxCharacters:((_otpValue$index=otpValue[index])==null?void 0:_otpValue$index.length)>0?1:undefined,onChange:function onChange(formEvent){return handleOnChange(Object.assign({},formEvent,{currentOtpIndex:index}));},onFocus:function onFocus(formEvent){return _onFocus==null?void 0:_onFocus(Object.assign({},formEvent,{inputIndex:index}));},onBlur:function onBlur(formEvent){return _onBlur==null?void 0:_onBlur(Object.assign({},formEvent,{inputIndex:index}));},onInput:function onInput(formEvent){return handleOnInput(Object.assign({},formEvent,{currentOtpIndex:index}));},onKeyDown:function onKeyDown(keyboardEvent){return handleOnKeyDown(Object.assign({},keyboardEvent,{currentOtpIndex:index}));},isDisabled:isDisabled,placeholder:(_Array$from$index=Array.from(placeholder!=null?placeholder:'')[index])!=null?_Array$from$index:'',isRequired:true,autoCompleteSuggestionType:autoCompleteSuggestionType,keyboardType:keyboardType,keyboardReturnKeyType:keyboardReturnKeyType,validationState:validationState,successText:successText,errorText:errorText,helpText:helpText,hideFormHint:true,type:currentInputType,size:size,valueComponentType:"heading"})},`${inputId}-${index}`));};for(var index=0;index<otpLength;index++){_loop(index);}return inputs;};return jsxs(BaseBox,Object.assign({},metaAttribute({name:MetaConstants.OTPInput,testID:testID}),getStyledProps(styledProps),{children:[jsxs(BaseBox,{display:"flex",flexDirection:isLabelLeftPositioned?'row':'column',alignItems:isLabelLeftPositioned?'center':undefined,position:"relative",children:[Boolean(label)&&jsx(FormLabel,{as:"label",position:labelPosition,htmlFor:inputId,size:size,children:label}),jsxs(BaseBox,{display:"flex",flexDirection:"row",children:[getHiddenInput(),getOTPInputFields()]})]}),jsx(BaseBox,{marginLeft:makeSize(isLabelLeftPositioned?136:0),children:jsx(FormHint,{type:getHintType({validationState:validationState,hasHelpText:Boolean(helpText)}),helpText:helpText,errorText:errorText,successText:successText,helpTextId:helpTextId,errorTextId:errorTextId,successTextId:successTextId,size:size})})]}));};var OTPInput=React__default.forwardRef(_OTPInput);
 export { OTPInput };
 //# sourceMappingURL=OTPInput.js.map