@razorpay/blade 12.33.1 → 12.33.2
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.
- package/build/lib/native/components/Accordion/AccordionButton.native.js +1 -1
- package/build/lib/native/components/Accordion/AccordionButton.native.js.map +1 -1
- package/build/lib/native/components/Accordion/AccordionItemHeader.js +2 -1
- package/build/lib/native/components/Accordion/AccordionItemHeader.js.map +1 -1
- package/build/lib/native/components/Accordion/commonStyles.js +1 -1
- package/build/lib/native/components/Accordion/commonStyles.js.map +1 -1
- package/build/lib/native/components/ActionList/ActionListItem.js +1 -1
- package/build/lib/native/components/ActionList/ActionListItem.js.map +1 -1
- package/build/lib/native/components/BaseHeaderFooter/BaseHeader.js +1 -1
- package/build/lib/native/components/BaseHeaderFooter/BaseHeader.js.map +1 -1
- package/build/lib/native/components/Button/BaseButton/BaseButton.js +1 -1
- package/build/lib/native/components/Button/BaseButton/BaseButton.js.map +1 -1
- package/build/lib/native/components/Button/BaseButton/buttonTokens.js +1 -1
- package/build/lib/native/components/Button/BaseButton/buttonTokens.js.map +1 -1
- package/build/lib/native/components/Dropdown/Dropdown.js +1 -1
- package/build/lib/native/components/Dropdown/Dropdown.js.map +1 -1
- package/build/lib/native/components/Dropdown/DropdownButton.js +1 -1
- package/build/lib/native/components/Dropdown/DropdownButton.js.map +1 -1
- package/build/lib/native/components/Dropdown/InputDropdownButton.native.js +7 -0
- package/build/lib/native/components/Dropdown/InputDropdownButton.native.js.map +1 -0
- package/build/lib/native/components/Dropdown/dropdownComponentIds.js +1 -1
- package/build/lib/native/components/Dropdown/dropdownComponentIds.js.map +1 -1
- package/build/lib/native/components/Dropdown/useDropdown.js.map +1 -1
- package/build/lib/native/components/Icons/ChevronUpDownIcon/ChevronUpDownIcon.js +12 -0
- package/build/lib/native/components/Icons/ChevronUpDownIcon/ChevronUpDownIcon.js.map +1 -0
- package/build/lib/native/components/Input/BaseInput/BaseInput.js +1 -1
- package/build/lib/native/components/Input/BaseInput/BaseInput.js.map +1 -1
- package/build/lib/native/components/Input/BaseInput/BaseInputVisuals.js +1 -1
- package/build/lib/native/components/Input/BaseInput/BaseInputVisuals.js.map +1 -1
- package/build/lib/native/components/Input/BaseInput/baseInputStyles.js +1 -1
- package/build/lib/native/components/Input/BaseInput/baseInputStyles.js.map +1 -1
- package/build/lib/native/components/Input/BaseInput/baseInputTokens.js +1 -1
- package/build/lib/native/components/Input/BaseInput/baseInputTokens.js.map +1 -1
- package/build/lib/native/components/Input/DropdownInputTriggers/BaseDropdownInputTrigger.js +2 -5
- package/build/lib/native/components/Input/DropdownInputTriggers/BaseDropdownInputTrigger.js.map +1 -1
- package/build/lib/native/components/Input/SearchInput/SearchInput.js +12 -3
- package/build/lib/native/components/Input/SearchInput/SearchInput.js.map +1 -1
- package/build/lib/native/components/Input/TextInput/TextInput.js +11 -3
- package/build/lib/native/components/Input/TextInput/TextInput.js.map +1 -1
- package/build/lib/native/components/Typography/Text/Text.js +1 -1
- package/build/lib/native/components/Typography/Text/Text.js.map +1 -1
- package/build/lib/native/components/index.js +2 -0
- package/build/lib/native/components/index.js.map +1 -1
- package/build/lib/native/utils/useControlledDropdownInput/useControlledDropdownInput.js +14 -0
- package/build/lib/native/utils/useControlledDropdownInput/useControlledDropdownInput.js.map +1 -0
- package/build/lib/web/development/components/Accordion/AccordionItemHeader.js +18 -2
- package/build/lib/web/development/components/Accordion/AccordionItemHeader.js.map +1 -1
- package/build/lib/web/development/components/Accordion/StyledAccordionButton.web.js +4 -3
- package/build/lib/web/development/components/Accordion/StyledAccordionButton.web.js.map +1 -1
- package/build/lib/web/development/components/Accordion/commonStyles.js +1 -11
- package/build/lib/web/development/components/Accordion/commonStyles.js.map +1 -1
- package/build/lib/web/development/components/ActionList/ActionListItem.js +2 -1
- package/build/lib/web/development/components/ActionList/ActionListItem.js.map +1 -1
- package/build/lib/web/development/components/BaseHeaderFooter/BaseHeader.js +6 -3
- package/build/lib/web/development/components/BaseHeaderFooter/BaseHeader.js.map +1 -1
- package/build/lib/web/development/components/Button/BaseButton/BaseButton.js +24 -3
- package/build/lib/web/development/components/Button/BaseButton/BaseButton.js.map +1 -1
- package/build/lib/web/development/components/Button/BaseButton/StyledBaseButton.web.js +14 -2
- package/build/lib/web/development/components/Button/BaseButton/StyledBaseButton.web.js.map +1 -1
- package/build/lib/web/development/components/Button/BaseButton/buttonTokens.js +19 -0
- package/build/lib/web/development/components/Button/BaseButton/buttonTokens.js.map +1 -1
- package/build/lib/web/development/components/Dropdown/Dropdown.js +4 -1
- package/build/lib/web/development/components/Dropdown/Dropdown.js.map +1 -1
- package/build/lib/web/development/components/Dropdown/DropdownButton.js +4 -1
- package/build/lib/web/development/components/Dropdown/DropdownButton.js.map +1 -1
- package/build/lib/web/development/components/Dropdown/DropdownOverlay.web.js +4 -2
- package/build/lib/web/development/components/Dropdown/DropdownOverlay.web.js.map +1 -1
- package/build/lib/web/development/components/Dropdown/InputDropdownButton.web.js +180 -0
- package/build/lib/web/development/components/Dropdown/InputDropdownButton.web.js.map +1 -0
- package/build/lib/web/development/components/Dropdown/dropdownComponentIds.js +2 -1
- package/build/lib/web/development/components/Dropdown/dropdownComponentIds.js.map +1 -1
- package/build/lib/web/development/components/Dropdown/index.js +1 -0
- package/build/lib/web/development/components/Dropdown/index.js.map +1 -1
- package/build/lib/web/development/components/Dropdown/useDropdown.js.map +1 -1
- package/build/lib/web/development/components/Icons/ChevronUpDownIcon/ChevronUpDownIcon.js +40 -0
- package/build/lib/web/development/components/Icons/ChevronUpDownIcon/ChevronUpDownIcon.js.map +1 -0
- package/build/lib/web/development/components/Icons/ChevronUpDownIcon/index.js +2 -0
- package/build/lib/web/development/components/Icons/ChevronUpDownIcon/index.js.map +1 -0
- package/build/lib/web/development/components/Icons/index.js +1 -0
- package/build/lib/web/development/components/Icons/index.js.map +1 -1
- package/build/lib/web/development/components/Input/BaseInput/BaseInput.js +10 -4
- package/build/lib/web/development/components/Input/BaseInput/BaseInput.js.map +1 -1
- package/build/lib/web/development/components/Input/BaseInput/BaseInputVisuals.js +32 -8
- package/build/lib/web/development/components/Input/BaseInput/BaseInputVisuals.js.map +1 -1
- package/build/lib/web/development/components/Input/BaseInput/StyledBaseInput.web.js +2 -1
- package/build/lib/web/development/components/Input/BaseInput/StyledBaseInput.web.js.map +1 -1
- package/build/lib/web/development/components/Input/BaseInput/baseInputStyles.js +8 -4
- package/build/lib/web/development/components/Input/BaseInput/baseInputStyles.js.map +1 -1
- package/build/lib/web/development/components/Input/BaseInput/baseInputTokens.js +1 -1
- package/build/lib/web/development/components/Input/BaseInput/baseInputTokens.js.map +1 -1
- package/build/lib/web/development/components/Input/DropdownInputTriggers/BaseDropdownInputTrigger.js +25 -124
- package/build/lib/web/development/components/Input/DropdownInputTriggers/BaseDropdownInputTrigger.js.map +1 -1
- package/build/lib/web/development/components/Input/PhoneNumberInput/CountrySelector.web.js +6 -4
- package/build/lib/web/development/components/Input/PhoneNumberInput/CountrySelector.web.js.map +1 -1
- package/build/lib/web/development/components/Input/SearchInput/SearchInput.js +97 -30
- package/build/lib/web/development/components/Input/SearchInput/SearchInput.js.map +1 -1
- package/build/lib/web/development/components/Input/TextInput/TextInput.js +123 -31
- package/build/lib/web/development/components/Input/TextInput/TextInput.js.map +1 -1
- package/build/lib/web/development/components/Typography/Text/Text.js +0 -1
- package/build/lib/web/development/components/Typography/Text/Text.js.map +1 -1
- package/build/lib/web/development/components/index.js +2 -0
- package/build/lib/web/development/components/index.js.map +1 -1
- package/build/lib/web/development/utils/useControlledDropdownInput/index.js +2 -0
- package/build/lib/web/development/utils/useControlledDropdownInput/index.js.map +1 -0
- package/build/lib/web/development/utils/useControlledDropdownInput/useControlledDropdownInput.js +108 -0
- package/build/lib/web/development/utils/useControlledDropdownInput/useControlledDropdownInput.js.map +1 -0
- package/build/lib/web/production/components/Accordion/AccordionItemHeader.js +18 -2
- package/build/lib/web/production/components/Accordion/AccordionItemHeader.js.map +1 -1
- package/build/lib/web/production/components/Accordion/StyledAccordionButton.web.js +4 -3
- package/build/lib/web/production/components/Accordion/StyledAccordionButton.web.js.map +1 -1
- package/build/lib/web/production/components/Accordion/commonStyles.js +1 -11
- package/build/lib/web/production/components/Accordion/commonStyles.js.map +1 -1
- package/build/lib/web/production/components/ActionList/ActionListItem.js +2 -1
- package/build/lib/web/production/components/ActionList/ActionListItem.js.map +1 -1
- package/build/lib/web/production/components/BaseHeaderFooter/BaseHeader.js +6 -3
- package/build/lib/web/production/components/BaseHeaderFooter/BaseHeader.js.map +1 -1
- package/build/lib/web/production/components/Button/BaseButton/BaseButton.js +24 -3
- package/build/lib/web/production/components/Button/BaseButton/BaseButton.js.map +1 -1
- package/build/lib/web/production/components/Button/BaseButton/StyledBaseButton.web.js +14 -2
- package/build/lib/web/production/components/Button/BaseButton/StyledBaseButton.web.js.map +1 -1
- package/build/lib/web/production/components/Button/BaseButton/buttonTokens.js +19 -0
- package/build/lib/web/production/components/Button/BaseButton/buttonTokens.js.map +1 -1
- package/build/lib/web/production/components/Dropdown/Dropdown.js +4 -1
- package/build/lib/web/production/components/Dropdown/Dropdown.js.map +1 -1
- package/build/lib/web/production/components/Dropdown/DropdownButton.js +4 -1
- package/build/lib/web/production/components/Dropdown/DropdownButton.js.map +1 -1
- package/build/lib/web/production/components/Dropdown/DropdownOverlay.web.js +4 -2
- package/build/lib/web/production/components/Dropdown/DropdownOverlay.web.js.map +1 -1
- package/build/lib/web/production/components/Dropdown/InputDropdownButton.web.js +180 -0
- package/build/lib/web/production/components/Dropdown/InputDropdownButton.web.js.map +1 -0
- package/build/lib/web/production/components/Dropdown/dropdownComponentIds.js +2 -1
- package/build/lib/web/production/components/Dropdown/dropdownComponentIds.js.map +1 -1
- package/build/lib/web/production/components/Dropdown/index.js +1 -0
- package/build/lib/web/production/components/Dropdown/index.js.map +1 -1
- package/build/lib/web/production/components/Dropdown/useDropdown.js.map +1 -1
- package/build/lib/web/production/components/Icons/ChevronUpDownIcon/ChevronUpDownIcon.js +40 -0
- package/build/lib/web/production/components/Icons/ChevronUpDownIcon/ChevronUpDownIcon.js.map +1 -0
- package/build/lib/web/production/components/Icons/ChevronUpDownIcon/index.js +2 -0
- package/build/lib/web/production/components/Icons/ChevronUpDownIcon/index.js.map +1 -0
- package/build/lib/web/production/components/Icons/index.js +1 -0
- package/build/lib/web/production/components/Icons/index.js.map +1 -1
- package/build/lib/web/production/components/Input/BaseInput/BaseInput.js +10 -4
- package/build/lib/web/production/components/Input/BaseInput/BaseInput.js.map +1 -1
- package/build/lib/web/production/components/Input/BaseInput/BaseInputVisuals.js +32 -8
- package/build/lib/web/production/components/Input/BaseInput/BaseInputVisuals.js.map +1 -1
- package/build/lib/web/production/components/Input/BaseInput/StyledBaseInput.web.js +2 -1
- package/build/lib/web/production/components/Input/BaseInput/StyledBaseInput.web.js.map +1 -1
- package/build/lib/web/production/components/Input/BaseInput/baseInputStyles.js +8 -4
- package/build/lib/web/production/components/Input/BaseInput/baseInputStyles.js.map +1 -1
- package/build/lib/web/production/components/Input/BaseInput/baseInputTokens.js +1 -1
- package/build/lib/web/production/components/Input/BaseInput/baseInputTokens.js.map +1 -1
- package/build/lib/web/production/components/Input/DropdownInputTriggers/BaseDropdownInputTrigger.js +25 -124
- package/build/lib/web/production/components/Input/DropdownInputTriggers/BaseDropdownInputTrigger.js.map +1 -1
- package/build/lib/web/production/components/Input/PhoneNumberInput/CountrySelector.web.js +6 -4
- package/build/lib/web/production/components/Input/PhoneNumberInput/CountrySelector.web.js.map +1 -1
- package/build/lib/web/production/components/Input/SearchInput/SearchInput.js +97 -30
- package/build/lib/web/production/components/Input/SearchInput/SearchInput.js.map +1 -1
- package/build/lib/web/production/components/Input/TextInput/TextInput.js +123 -31
- package/build/lib/web/production/components/Input/TextInput/TextInput.js.map +1 -1
- package/build/lib/web/production/components/Typography/Text/Text.js +0 -1
- package/build/lib/web/production/components/Typography/Text/Text.js.map +1 -1
- package/build/lib/web/production/components/index.js +2 -0
- package/build/lib/web/production/components/index.js.map +1 -1
- package/build/lib/web/production/utils/useControlledDropdownInput/index.js +2 -0
- package/build/lib/web/production/utils/useControlledDropdownInput/index.js.map +1 -0
- package/build/lib/web/production/utils/useControlledDropdownInput/useControlledDropdownInput.js +108 -0
- package/build/lib/web/production/utils/useControlledDropdownInput/useControlledDropdownInput.js.map +1 -0
- package/build/types/components/index.d.ts +3098 -3001
- package/build/types/components/index.native.d.ts +2719 -2686
- package/package.json +1 -1
|
@@ -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 baseInputBorderlessBackgroundColor,\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 isTableInputCell: NonNullable<BaseInputProps['isTableInputCell']>;\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 isTableInputCell,\n}: Pick<\n GetInputStyles,\n | 'theme'\n | 'isFocused'\n | 'isDisabled'\n | 'validationState'\n | 'isHovered'\n | 'isTextArea'\n | 'isDropdownTrigger'\n | 'isTableInputCell'\n>): CSSObject => {\n // normal state\n const backgroundColorTokens = isTableInputCell\n ? baseInputBorderlessBackgroundColor\n : baseInputBackgroundColor;\n let backgroundColor = getIn(theme.colors, backgroundColorTokens.default);\n let borderColor = isTableInputCell\n ? theme.colors.transparent\n : getIn(theme.colors, baseInputBorderColor.default);\n let borderWidth = getIn(theme.border.width, baseInputBorderWidth.default);\n let zIndex: number | undefined;\n\n const baseInputState = getBaseInputState({ isFocused, isHovered, isDisabled });\n\n backgroundColor = getIn(theme.colors, backgroundColorTokens[baseInputState]);\n borderColor =\n isTableInputCell && baseInputState !== 'focused'\n ? theme.colors.transparent\n : getIn(theme.colors, baseInputBorderColor[baseInputState]);\n borderWidth = getIn(theme.border.width, baseInputBorderWidth[baseInputState]);\n\n if (!isTableInputCell && validationState && validationState !== 'none') {\n borderColor = getIn(theme.colors, baseInputBorderColor[validationState]);\n borderWidth = getIn(theme.border.width, baseInputBorderWidth[validationState]);\n zIndex = 1; // Prevent validation ring clipping by adjacent inputs in InputGroup\n } else if (validationState && validationState !== 'none') {\n backgroundColor = getIn(theme.colors, baseInputBorderlessBackgroundColor[validationState]);\n }\n return {\n backgroundColor,\n borderRadius: makeBorderSize(\n isTableInputCell ? theme.border.radius.none : theme.border.radius.medium,\n ),\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 zIndex,\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 // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing\n const shouldHaveFlexibleHeight = isTextArea || isDropdownWithTags;\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: theme.colors.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: shouldHaveFlexibleHeight ? undefined : makeSpace(baseInputHeight[size]),\n minHeight: shouldHaveFlexibleHeight ? 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","isTableInputCell","backgroundColorTokens","baseInputBorderlessBackgroundColor","baseInputBackgroundColor","backgroundColor","getIn","colors","default","borderColor","transparent","baseInputBorderColor","borderWidth","border","width","baseInputBorderWidth","zIndex","baseInputState","Object","assign","borderRadius","makeBorderSize","radius","none","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","shouldHaveFlexibleHeight","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 baseInputBorderlessBackgroundColor,\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 isTableInputCell: NonNullable<BaseInputProps['isTableInputCell']>;\n hasLeadingDropdown?: boolean;\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 isTableInputCell,\n}: Pick<\n GetInputStyles,\n | 'theme'\n | 'isFocused'\n | 'isDisabled'\n | 'validationState'\n | 'isHovered'\n | 'isTextArea'\n | 'isDropdownTrigger'\n | 'isTableInputCell'\n>): CSSObject => {\n // normal state\n const backgroundColorTokens = isTableInputCell\n ? baseInputBorderlessBackgroundColor\n : baseInputBackgroundColor;\n let backgroundColor = getIn(theme.colors, backgroundColorTokens.default);\n let borderColor = isTableInputCell\n ? theme.colors.transparent\n : getIn(theme.colors, baseInputBorderColor.default);\n let borderWidth = getIn(theme.border.width, baseInputBorderWidth.default);\n let zIndex: number | undefined;\n\n const baseInputState = getBaseInputState({ isFocused, isHovered, isDisabled });\n\n backgroundColor = getIn(theme.colors, backgroundColorTokens[baseInputState]);\n borderColor =\n isTableInputCell && baseInputState !== 'focused'\n ? theme.colors.transparent\n : getIn(theme.colors, baseInputBorderColor[baseInputState]);\n borderWidth = getIn(theme.border.width, baseInputBorderWidth[baseInputState]);\n\n if (!isTableInputCell && validationState && validationState !== 'none') {\n borderColor = getIn(theme.colors, baseInputBorderColor[validationState]);\n borderWidth = getIn(theme.border.width, baseInputBorderWidth[validationState]);\n zIndex = 1; // Prevent validation ring clipping by adjacent inputs in InputGroup\n } else if (validationState && validationState !== 'none') {\n backgroundColor = getIn(theme.colors, baseInputBorderlessBackgroundColor[validationState]);\n }\n return {\n backgroundColor,\n borderRadius: makeBorderSize(\n isTableInputCell ? theme.border.radius.none : theme.border.radius.medium,\n ),\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 zIndex,\n ...getBaseInputBorderStyles({ theme, borderColor, borderWidth, isFocused }),\n };\n};\n\nconst getLeftPadding = ({\n theme,\n isDropdownTrigger,\n hasLeadingIcon,\n hasPrefix,\n size,\n hasLeadingDropdown,\n}: {\n theme: Theme;\n hasLeadingIcon: boolean;\n hasPrefix: boolean;\n isDropdownTrigger: GetInputStyles['isDropdownTrigger'];\n size: GetInputStyles['size'];\n hasLeadingDropdown: boolean;\n}): number => {\n if (isDropdownTrigger) {\n return theme.spacing[0];\n }\n\n if (hasLeadingIcon || hasPrefix || hasLeadingDropdown) {\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 hasLeadingDropdown = false,\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 // eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing\n const shouldHaveFlexibleHeight = isTextArea || isDropdownWithTags;\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: theme.colors.transparent,\n\n paddingTop: makeSpace(theme.spacing[baseInputPaddingTokens.top[size]]),\n paddingBottom: makeSpace(theme.spacing[baseInputPaddingTokens.bottom[size]]),\n paddingLeft: makeSpace(\n getLeftPadding({\n theme,\n isDropdownTrigger,\n hasLeadingIcon,\n hasPrefix,\n size,\n hasLeadingDropdown,\n }),\n ),\n paddingRight: getRightPadding({\n theme,\n hasTrailingInteractionElement,\n hasSuffix,\n hasTrailingIcon,\n size,\n }),\n\n textAlign,\n width: '100%',\n height: shouldHaveFlexibleHeight ? undefined : makeSpace(baseInputHeight[size]),\n minHeight: shouldHaveFlexibleHeight ? 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","isTableInputCell","backgroundColorTokens","baseInputBorderlessBackgroundColor","baseInputBackgroundColor","backgroundColor","getIn","colors","default","borderColor","transparent","baseInputBorderColor","borderWidth","border","width","baseInputBorderWidth","zIndex","baseInputState","Object","assign","borderRadius","makeBorderSize","radius","none","medium","borderStyle","display","flexDirection","alignItems","undefined","position","height","getBaseInputBorderStyles","getLeftPadding","_ref3","hasLeadingIcon","hasPrefix","size","hasLeadingDropdown","spacing","baseInputPaddingTokens","left","getRightPadding","_ref4","hasTrailingInteractionElement","hasSuffix","hasTrailingIcon","right","getBaseInputStyles","_ref5","leadingIcon","prefix","trailingInteractionElement","leadingInteractionElement","suffix","trailingIcon","textAlign","hasTags","valueComponentType","_ref5$hasLeadingDropd","_getInputVisualsToBeR","getInputVisualsToBeRendered","isDropdownWithTags","isReactNative","getPlatformType","shouldHaveFlexibleHeight","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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"}
|
|
@@ -2,7 +2,7 @@ import '../../../tokens/global/typography.js';
|
|
|
2
2
|
import '../../../tokens/global/motion.js';
|
|
3
3
|
import { size } from '../../../tokens/global/size.js';
|
|
4
4
|
|
|
5
|
-
var BASEINPUT_MAX_ROWS=4;var baseInputHeight={medium:size['36'],large:size['48']};var baseInputWrapperMaxHeight={medium:baseInputHeight.medium*BASEINPUT_MAX_ROWS,large:baseInputHeight.large*BASEINPUT_MAX_ROWS};var baseInputBorderColor={default:'interactive.border.gray.default',hovered:'interactive.border.gray.highlighted',focused:'interactive.border.primary.default',disabled:'interactive.border.gray.disabled',error:'interactive.border.negative.default',success:'interactive.border.positive.default'};var baseInputBackgroundColor={default:'surface.background.gray.intense',hovered:'surface.background.gray.moderate',focused:'surface.background.gray.moderate',disabled:'surface.background.gray.
|
|
5
|
+
var BASEINPUT_MAX_ROWS=4;var baseInputHeight={medium:size['36'],large:size['48']};var baseInputWrapperMaxHeight={medium:baseInputHeight.medium*BASEINPUT_MAX_ROWS,large:baseInputHeight.large*BASEINPUT_MAX_ROWS};var baseInputBorderColor={default:'interactive.border.gray.default',hovered:'interactive.border.gray.highlighted',focused:'interactive.border.primary.default',disabled:'interactive.border.gray.disabled',error:'interactive.border.negative.default',success:'interactive.border.positive.default'};var baseInputBackgroundColor={default:'surface.background.gray.intense',hovered:'surface.background.gray.moderate',focused:'surface.background.gray.moderate',disabled:'surface.background.gray.subtle',error:'surface.background.gray.intense',success:'surface.background.gray.intense'};var baseInputBorderlessBackgroundColor={default:'transparent',hovered:'surface.background.gray.moderate',focused:'surface.background.gray.moderate',disabled:'surface.background.gray.intense',error:'feedback.background.negative.subtle',success:'feedback.background.positive.subtle'};var baseInputBorderWidth={default:'thin',hovered:'thin',disabled:'thin',focused:'thick',error:'thick',success:'thick'};var baseInputBorderBackgroundMotion={enter:{duration:'xgentle',easing:'emphasized'},exit:{duration:'gentle',easing:'standard'}};var baseInputPaddingTokens={top:{medium:3,large:4},bottom:{medium:3,large:4},left:{medium:4,large:4},right:{medium:4,large:4}};var formHintLeftLabelMarginLeft={medium:136,large:192};
|
|
6
6
|
|
|
7
7
|
export { BASEINPUT_MAX_ROWS, baseInputBackgroundColor, baseInputBorderBackgroundMotion, baseInputBorderColor, baseInputBorderWidth, baseInputBorderlessBackgroundColor, baseInputHeight, baseInputPaddingTokens, baseInputWrapperMaxHeight, formHintLeftLabelMarginLeft };
|
|
8
8
|
//# sourceMappingURL=baseInputTokens.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"baseInputTokens.js","sources":["../../../../../../src/components/Input/BaseInput/baseInputTokens.ts"],"sourcesContent":["import type { BaseInputProps } from './BaseInput';\nimport { size, spacing } from '~tokens/global';\n\nexport const BASEINPUT_MAX_ROWS = 4;\n\nexport const TAG_HEIGHT = size['20'];\nexport const TAG_GAP = spacing['3'];\n\n/**\n * 36px\n */\nexport const baseInputHeight: Record<\n NonNullable<BaseInputProps['size']>,\n typeof size[keyof typeof size]\n> = {\n medium: size['36'],\n large: size['48'],\n};\n\n/**\n * medium - 144px (36px height * 4 rows)\n * large - 192px (48px height * 4 rows)\n */\n// we don't want exact number but rough number to be able to animate correctly in height.\nexport const baseInputWrapperMaxHeight = {\n medium: baseInputHeight.medium * BASEINPUT_MAX_ROWS,\n large: baseInputHeight.large * BASEINPUT_MAX_ROWS,\n} as const;\n\nexport const baseInputBorderColor = {\n default: 'interactive.border.gray.default',\n hovered: 'interactive.border.gray.highlighted',\n focused: 'interactive.border.primary.default',\n disabled: 'interactive.border.gray.disabled',\n error: 'interactive.border.negative.default',\n success: 'interactive.border.positive.default',\n} as const;\n\nexport const baseInputBackgroundColor = {\n default: 'surface.background.gray.intense',\n hovered: 'surface.background.gray.moderate',\n focused: 'surface.background.gray.moderate',\n disabled: 'surface.background.gray.
|
|
1
|
+
{"version":3,"file":"baseInputTokens.js","sources":["../../../../../../src/components/Input/BaseInput/baseInputTokens.ts"],"sourcesContent":["import type { BaseInputProps } from './BaseInput';\nimport { size, spacing } from '~tokens/global';\n\nexport const BASEINPUT_MAX_ROWS = 4;\n\nexport const TAG_HEIGHT = size['20'];\nexport const TAG_GAP = spacing['3'];\n\n/**\n * 36px\n */\nexport const baseInputHeight: Record<\n NonNullable<BaseInputProps['size']>,\n typeof size[keyof typeof size]\n> = {\n medium: size['36'],\n large: size['48'],\n};\n\n/**\n * medium - 144px (36px height * 4 rows)\n * large - 192px (48px height * 4 rows)\n */\n// we don't want exact number but rough number to be able to animate correctly in height.\nexport const baseInputWrapperMaxHeight = {\n medium: baseInputHeight.medium * BASEINPUT_MAX_ROWS,\n large: baseInputHeight.large * BASEINPUT_MAX_ROWS,\n} as const;\n\nexport const baseInputBorderColor = {\n default: 'interactive.border.gray.default',\n hovered: 'interactive.border.gray.highlighted',\n focused: 'interactive.border.primary.default',\n disabled: 'interactive.border.gray.disabled',\n error: 'interactive.border.negative.default',\n success: 'interactive.border.positive.default',\n} as const;\n\nexport const baseInputBackgroundColor = {\n default: 'surface.background.gray.intense',\n hovered: 'surface.background.gray.moderate',\n focused: 'surface.background.gray.moderate',\n disabled: 'surface.background.gray.subtle',\n error: 'surface.background.gray.intense',\n success: 'surface.background.gray.intense',\n} as const;\n\nexport const baseInputBorderlessBackgroundColor = {\n default: 'transparent',\n hovered: 'surface.background.gray.moderate',\n focused: 'surface.background.gray.moderate',\n disabled: 'surface.background.gray.intense',\n error: 'feedback.background.negative.subtle',\n success: 'feedback.background.positive.subtle',\n} as const;\n\nexport const baseInputBorderWidth = {\n default: 'thin',\n hovered: 'thin',\n disabled: 'thin',\n focused: 'thick',\n error: 'thick',\n success: 'thick',\n} as const;\n\nexport const baseInputBorderBackgroundMotion = {\n enter: { duration: 'xgentle', easing: 'emphasized' },\n exit: { duration: 'gentle', easing: 'standard' },\n} as const;\n\nexport const baseInputPaddingTokens = {\n top: {\n medium: 3,\n large: 4,\n },\n bottom: {\n medium: 3,\n large: 4,\n },\n left: {\n medium: 4,\n large: 4,\n },\n right: {\n medium: 4,\n large: 4,\n },\n} as const;\n\n/* the magic number 192 is basically max-width of label \ni.e 176 and then right margin \ni.e 16 which is the spacing between label and input field */\nexport const formHintLeftLabelMarginLeft = {\n medium: 136,\n large: 192,\n} as const;\n"],"names":["BASEINPUT_MAX_ROWS","baseInputHeight","medium","size","large","baseInputWrapperMaxHeight","baseInputBorderColor","default","hovered","focused","disabled","error","success","baseInputBackgroundColor","baseInputBorderlessBackgroundColor","baseInputBorderWidth","baseInputBorderBackgroundMotion","enter","duration","easing","exit","baseInputPaddingTokens","top","bottom","left","right","formHintLeftLabelMarginLeft"],"mappings":";;;;AAGa,IAAAA,kBAAkB,CAAG,EAQrB,IAAAC,eAGZ,CAAG,CACFC,MAAM,CAAEC,IAAI,CAAC,IAAI,CAAC,CAClBC,KAAK,CAAED,IAAI,CAAC,IAAI,CAClB,EAOa,IAAAE,yBAAyB,CAAG,CACvCH,MAAM,CAAED,eAAe,CAACC,MAAM,CAAGF,kBAAkB,CACnDI,KAAK,CAAEH,eAAe,CAACG,KAAK,CAAGJ,kBACjC,EAEa,IAAAM,oBAAoB,CAAG,CAClCC,OAAO,CAAE,iCAAiC,CAC1CC,OAAO,CAAE,qCAAqC,CAC9CC,OAAO,CAAE,oCAAoC,CAC7CC,QAAQ,CAAE,kCAAkC,CAC5CC,KAAK,CAAE,qCAAqC,CAC5CC,OAAO,CAAE,qCACX,EAEa,IAAAC,wBAAwB,CAAG,CACtCN,OAAO,CAAE,iCAAiC,CAC1CC,OAAO,CAAE,kCAAkC,CAC3CC,OAAO,CAAE,kCAAkC,CAC3CC,QAAQ,CAAE,gCAAgC,CAC1CC,KAAK,CAAE,iCAAiC,CACxCC,OAAO,CAAE,iCACX,EAEa,IAAAE,kCAAkC,CAAG,CAChDP,OAAO,CAAE,aAAa,CACtBC,OAAO,CAAE,kCAAkC,CAC3CC,OAAO,CAAE,kCAAkC,CAC3CC,QAAQ,CAAE,iCAAiC,CAC3CC,KAAK,CAAE,qCAAqC,CAC5CC,OAAO,CAAE,qCACX,EAEa,IAAAG,oBAAoB,CAAG,CAClCR,OAAO,CAAE,MAAM,CACfC,OAAO,CAAE,MAAM,CACfE,QAAQ,CAAE,MAAM,CAChBD,OAAO,CAAE,OAAO,CAChBE,KAAK,CAAE,OAAO,CACdC,OAAO,CAAE,OACX,EAEa,IAAAI,+BAA+B,CAAG,CAC7CC,KAAK,CAAE,CAAEC,QAAQ,CAAE,SAAS,CAAEC,MAAM,CAAE,YAAa,CAAC,CACpDC,IAAI,CAAE,CAAEF,QAAQ,CAAE,QAAQ,CAAEC,MAAM,CAAE,UAAW,CACjD,EAEa,IAAAE,sBAAsB,CAAG,CACpCC,GAAG,CAAE,CACHpB,MAAM,CAAE,CAAC,CACTE,KAAK,CAAE,CACT,CAAC,CACDmB,MAAM,CAAE,CACNrB,MAAM,CAAE,CAAC,CACTE,KAAK,CAAE,CACT,CAAC,CACDoB,IAAI,CAAE,CACJtB,MAAM,CAAE,CAAC,CACTE,KAAK,CAAE,CACT,CAAC,CACDqB,KAAK,CAAE,CACLvB,MAAM,CAAE,CAAC,CACTE,KAAK,CAAE,CACT,CACF,EAKa,IAAAsB,2BAA2B,CAAG,CACzCxB,MAAM,CAAE,GAAG,CACXE,KAAK,CAAE,GACT;;;;"}
|
|
@@ -1,27 +1,24 @@
|
|
|
1
1
|
import React__default from 'react';
|
|
2
2
|
import { BaseInput } from '../BaseInput/BaseInput.js';
|
|
3
3
|
import { InputChevronIcon } from './InputChevronIcon.native.js';
|
|
4
|
-
import isEmpty from '../../../utils/lodashButBetter/isEmpty.js';
|
|
5
4
|
import { useDropdown } from '../../Dropdown/useDropdown.js';
|
|
6
5
|
import 'react-native';
|
|
7
6
|
import '@babel/runtime/helpers/slicedToArray';
|
|
8
7
|
import { isReactNative } from '../../../utils/platform/isReactNative.js';
|
|
9
|
-
import { isBrowser } from '../../../utils/platform/isBrowser.js';
|
|
10
8
|
import '../../BladeProvider/useTheme.js';
|
|
11
9
|
import { getActionListContainerRole } from '../../ActionList/getA11yRoles.js';
|
|
12
10
|
import '@babel/runtime/helpers/defineProperty';
|
|
13
11
|
import { MetaConstants } from '../../../utils/metaAttribute/metaConstants.js';
|
|
14
12
|
import { getTagsGroup } from '../../Tag/getTagsGroup.js';
|
|
15
|
-
import { useFirstRender } from '../../../utils/useFirstRender.js';
|
|
16
13
|
import { useTableContext } from '../../Table/TableContext.js';
|
|
17
14
|
import { rowDensityToIsTableInputCellMapping, tableEditableCellRowDensityToInputSizeMap, validationStateToInputTrailingIconMap } from '../../Table/tokens.js';
|
|
18
15
|
import { useTableEditableCell } from '../../Table/TableEditableCellContext.js';
|
|
19
16
|
import { makeAnalyticsAttribute } from '../../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
|
|
20
|
-
import { fireNativeEvent } from '../../../utils/fireNativeEvent/fireNativeEvent.native.js';
|
|
21
17
|
import { dropdownComponentIds } from '../../Dropdown/dropdownComponentIds.js';
|
|
18
|
+
import { useControlledDropdownInput } from '../../../utils/useControlledDropdownInput/useControlledDropdownInput.js';
|
|
22
19
|
import { jsx } from 'react/jsx-runtime';
|
|
23
20
|
|
|
24
|
-
var
|
|
21
|
+
var _BaseDropdownInputTrigger=function _BaseDropdownInputTrigger(props,ref){var _props$placeholder,_props$validationStat,_props$maxRows,_props$label;var _useDropdown=useDropdown(),isOpen=_useDropdown.isOpen,activeTagIndex=_useDropdown.activeTagIndex,setActiveTagIndex=_useDropdown.setActiveTagIndex,displayValue=_useDropdown.displayValue,selectionType=_useDropdown.selectionType,dropdownTriggerer=_useDropdown.dropdownTriggerer,dropdownBaseId=_useDropdown.dropdownBaseId,selectedIndices=_useDropdown.selectedIndices,triggererRef=_useDropdown.triggererRef,headerAutoCompleteRef=_useDropdown.headerAutoCompleteRef,triggererWrapperRef=_useDropdown.triggererWrapperRef,isTagDismissedRef=_useDropdown.isTagDismissedRef,onTriggerClick=_useDropdown.onTriggerClick,value=_useDropdown.value,shouldIgnoreBlurAnimation=_useDropdown.shouldIgnoreBlurAnimation,setShouldIgnoreBlurAnimation=_useDropdown.setShouldIgnoreBlurAnimation,activeIndex=_useDropdown.activeIndex,hasFooterAction=_useDropdown.hasFooterAction,options=_useDropdown.options,removeOption=_useDropdown.removeOption,setChangeCallbackTriggerer=_useDropdown.setChangeCallbackTriggerer,changeCallbackTriggerer=_useDropdown.changeCallbackTriggerer;var _useTableContext=useTableContext(),rowDensity=_useTableContext.rowDensity;var _useTableEditableCell=useTableEditableCell(),isInsideTableEditableCell=_useTableEditableCell.isInsideTableEditableCell;var dropdownTriggerPlaceholder=(_props$placeholder=props.placeholder)!=null?_props$placeholder:'Select Option';var isAutoCompleteInHeader=!props.isSelectInput&&dropdownTriggerer!==dropdownComponentIds.triggers.AutoComplete;var getShowAllTags=React__default.useCallback(function(){if(isAutoCompleteInHeader){if(props.isSelectInput){return false;}return true;}return isOpen;},[isAutoCompleteInHeader,props.isSelectInput,isOpen]);useControlledDropdownInput({onChange:props.onChange,name:props.name,value:props.value,defaultValue:props.defaultValue,syncInputValueWithSelection:props.syncInputValueWithSelection,isSelectInput:props.isSelectInput,triggererRef:triggererRef});var getValue=function getValue(){var prefix='';if(props.labelPosition==='inside-input'&&props.label){prefix=`${props.label}: `;}if(props.isSelectInput){if(selectionType==='single'){return `${prefix}${displayValue}`;}return undefined;}return props.inputValue;};var getTags=React__default.useMemo(function(){return function(_ref){var size=_ref.size;if(selectionType==='single'){return undefined;}return getTagsGroup({size:size,tags:selectedIndices.map(function(selectedIndex){var _options$selectedInde;return (_options$selectedInde=options[selectedIndex])==null?void 0:_options$selectedInde.title;}),activeTagIndex:activeTagIndex,isDisabled:props.isDisabled,onDismiss:function onDismiss(_ref2){var tagIndex=_ref2.tagIndex;if(isTagDismissedRef.current){isTagDismissedRef.current.value=true;}if(!isReactNative()){var _triggererRef$current;(_triggererRef$current=triggererRef.current)==null?void 0:_triggererRef$current.focus();}removeOption(selectedIndices[tagIndex]);setChangeCallbackTriggerer(Number(changeCallbackTriggerer)+1);}});};},[selectedIndices,selectionType,activeTagIndex,changeCallbackTriggerer,options]);var tableInputProps={isTableInputCell:rowDensityToIsTableInputCellMapping[rowDensity],id:'table-editable-cell-input',size:tableEditableCellRowDensityToInputSizeMap[rowDensity],trailingIcon:validationStateToInputTrailingIconMap[(_props$validationStat=props.validationState)!=null?_props$validationStat:'none'],showHintsAsTooltip:true};var isValidationStateNone=props.validationState==='none'||props.validationState===undefined;return jsx(BaseInput,Object.assign({as:props.isSelectInput?'button':'input',ref:isReactNative()?null:function(node){if(isAutoCompleteInHeader){headerAutoCompleteRef.current=node;}else {triggererRef.current=node;}if(ref){if(typeof ref==='function'){ref(node);}else {ref.current=node;}}},isDropdownTrigger:true,setInputWrapperRef:function setInputWrapperRef(wrapperNode){if(!isAutoCompleteInHeader){triggererWrapperRef.current=wrapperNode;}},maxTagRows:(_props$maxRows=props.maxRows)!=null?_props$maxRows:'single',tags:getTags({size:props.size||'medium'}),showAllTags:getShowAllTags(),activeTagIndex:activeTagIndex,setActiveTagIndex:setActiveTagIndex,shouldIgnoreBlurAnimation:shouldIgnoreBlurAnimation,setShouldIgnoreBlurAnimation:setShouldIgnoreBlurAnimation,textAlign:"left",label:props.label,placeholder:selectionType==='multiple'&&selectedIndices.length>0?undefined:dropdownTriggerPlaceholder,hideLabelText:((_props$label=props.label)==null?void 0:_props$label.length)===0,accessibilityLabel:props.accessibilityLabel,labelPosition:props.labelPosition==='inside-input'?undefined:props.labelPosition,isLabelInsideInput:props.labelPosition==='inside-input',necessityIndicator:props.necessityIndicator,autoCompleteSuggestionType:"none",validationState:props.validationState,helpText:props.helpText,errorText:props.errorText,successText:props.successText,name:props.name,isDisabled:props.isDisabled,isRequired:props.isRequired,prefix:props.prefix,suffix:props.suffix,autoFocus:props.autoFocus,value:getValue(),onClick:function onClick(e){if(props.isDisabled){return;}props.onTriggerClick==null?void 0:props.onTriggerClick(e);},onFocus:props.onFocus,onBlur:function onBlur(_ref3){var name=_ref3.name;props.onBlur==null?void 0:props.onBlur({name:name,value:value});},leadingIcon:props.icon,componentName:props.isSelectInput?MetaConstants.SelectInput:MetaConstants.AutoComplete,testID:props.testID,id:`${dropdownBaseId}-trigger`,labelId:`${dropdownBaseId}-label`,role:isAutoCompleteInHeader?'searchbox':'combobox',hasPopup:isAutoCompleteInHeader?false:getActionListContainerRole(hasFooterAction,dropdownTriggerer),isPopupExpanded:isOpen,activeDescendant:activeIndex>=0?`${dropdownBaseId}-${activeIndex}`:undefined,popupId:isAutoCompleteInHeader?undefined:`${dropdownBaseId}-actionlist`,onChange:props.isSelectInput?undefined:props.onInputValueChange,onKeyDown:props.onTriggerKeydown,size:props.size},makeAnalyticsAttribute(props),{onTrailingInteractionElementClick:function onTrailingInteractionElementClick(){if(!props.isDisabled){if(!isReactNative()){var _triggererRef$current2;(_triggererRef$current2=triggererRef.current)==null?void 0:_triggererRef$current2.focus();}onTriggerClick();}},trailingInteractionElement:isAutoCompleteInHeader||isInsideTableEditableCell&&!isValidationStateNone?null:jsx(InputChevronIcon,{isDisabled:props.isDisabled,isOpen:isOpen})},isInsideTableEditableCell?tableInputProps:undefined,{tabIndex:isAutoCompleteInHeader?0:undefined}));};var BaseDropdownInputTrigger=React__default.forwardRef(_BaseDropdownInputTrigger);
|
|
25
22
|
|
|
26
23
|
export { BaseDropdownInputTrigger };
|
|
27
24
|
//# sourceMappingURL=BaseDropdownInputTrigger.js.map
|
package/build/lib/native/components/Input/DropdownInputTriggers/BaseDropdownInputTrigger.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseDropdownInputTrigger.js","sources":["../../../../../../src/components/Input/DropdownInputTriggers/BaseDropdownInputTrigger.tsx"],"sourcesContent":["import React from 'react';\nimport { BaseInput } from '../BaseInput';\nimport type { BaseInputProps } from '../BaseInput';\nimport { InputChevronIcon } from './InputChevronIcon';\nimport type { BaseDropdownInputTriggerProps, useControlledDropdownInputProps } from './types';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { useDropdown } from '~components/Dropdown/useDropdown';\nimport { isReactNative, isBrowser } from '~utils';\nimport { getActionListContainerRole } from '~components/ActionList/getA11yRoles';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { getTagsGroup } from '~components/Tag/getTagsGroup';\nimport type { BladeElementRef } from '~utils/types';\nimport { useFirstRender } from '~utils/useFirstRender';\nimport { useTableContext } from '~components/Table/TableContext';\nimport {\n rowDensityToIsTableInputCellMapping,\n tableEditableCellRowDensityToInputSizeMap,\n validationStateToInputTrailingIconMap,\n} from '~components/Table/tokens';\nimport { useTableEditableCell } from '~components/Table/TableEditableCellContext';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\nimport { fireNativeEvent } from '~utils/fireNativeEvent';\nimport { dropdownComponentIds } from '~components/Dropdown/dropdownComponentIds';\n\nconst useControlledDropdownInput = (props: useControlledDropdownInputProps): void => {\n const isFirstRender = useFirstRender();\n const {\n changeCallbackTriggerer,\n isControlled,\n options,\n selectedIndices,\n controlledValueIndices,\n setSelectedIndices,\n selectionType,\n setIsControlled,\n } = useDropdown();\n\n const getValuesArrayFromIndices = (): string[] => {\n let indices: number[] = [];\n if (isControlled) {\n indices = controlledValueIndices;\n } else {\n indices = selectedIndices;\n }\n\n return indices.map((selectionIndex) => options[selectionIndex].value);\n };\n\n const selectValues = (valuesToSelect: string | string[]): void => {\n if (options.length > 0) {\n // we use empty `''` for clearing the input\n if (isEmpty(valuesToSelect)) {\n setSelectedIndices([]);\n } else if (typeof valuesToSelect === 'string') {\n // single select control\n const selectedItemIndex = options.findIndex((option) => option.value === valuesToSelect);\n if (selectedItemIndex >= 0) {\n setSelectedIndices([selectedItemIndex]);\n }\n } else {\n // multiselect control\n\n // Handles repeated values in user state\n const uniqueValues = Array.from(new Set(valuesToSelect));\n // Handle selectionType single with multiselect values\n const userValues = selectionType === 'single' ? [valuesToSelect?.[0]] : uniqueValues;\n\n const selectedItemIndices = userValues\n .map((optionValue) => options.findIndex((option) => option.value === optionValue))\n .filter((value) => value >= 0);\n\n setSelectedIndices(selectedItemIndices);\n }\n }\n };\n\n // Handles `defaultValue` prop\n React.useEffect(() => {\n if (options.length > 0 && props.defaultValue) {\n selectValues(props.defaultValue);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [options.length]);\n\n // Handles `value` prop\n React.useEffect(() => {\n if (options.length > 0 && props.value !== undefined) {\n if (!isControlled) {\n setIsControlled(true);\n }\n\n selectValues(props.value);\n\n // in single select AutoComplete, we have to set inputValue of autocomplete according to the new selection.\n if (selectionType === 'single' && !Array.isArray(props.value) && !props.isSelectInput) {\n props.syncInputValueWithSelection?.(props.value);\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [props.value, options]);\n\n // onChange behaviour\n React.useEffect(() => {\n // Ignore calling onChange on mount\n\n if (!isFirstRender) {\n props.onChange?.({\n name: props.name,\n values: getValuesArrayFromIndices(),\n });\n if (isBrowser()) {\n fireNativeEvent(props.triggererRef, ['change', 'input']);\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [changeCallbackTriggerer]);\n};\n\nconst _BaseDropdownInputTrigger = (\n props: BaseDropdownInputTriggerProps,\n ref: React.ForwardedRef<BladeElementRef>,\n): React.ReactElement => {\n const {\n isOpen,\n activeTagIndex,\n setActiveTagIndex,\n displayValue,\n selectionType,\n dropdownTriggerer,\n dropdownBaseId,\n selectedIndices,\n triggererRef,\n headerAutoCompleteRef,\n triggererWrapperRef,\n isTagDismissedRef,\n onTriggerClick,\n value,\n shouldIgnoreBlurAnimation,\n setShouldIgnoreBlurAnimation,\n activeIndex,\n hasFooterAction,\n options,\n removeOption,\n setChangeCallbackTriggerer,\n changeCallbackTriggerer,\n } = useDropdown();\n const { rowDensity } = useTableContext();\n const { isInsideTableEditableCell } = useTableEditableCell();\n\n const dropdownTriggerPlaceholder = props.placeholder ?? 'Select Option';\n const isAutoCompleteInHeader =\n !props.isSelectInput && dropdownTriggerer !== dropdownComponentIds.triggers.AutoComplete;\n\n const getShowAllTags = React.useCallback((): boolean => {\n if (isAutoCompleteInHeader) {\n // When AutoComplete is in bottomsheet header, we never want to show all tags in outer select input\n if (props.isSelectInput) {\n return false;\n }\n\n // ... And we always want to show all tags in inner AutoComplete\n return true;\n }\n\n return isOpen;\n }, [isAutoCompleteInHeader, props.isSelectInput, isOpen]);\n\n useControlledDropdownInput({\n onChange: props.onChange,\n name: props.name,\n value: props.value,\n defaultValue: props.defaultValue,\n syncInputValueWithSelection: props.syncInputValueWithSelection,\n isSelectInput: props.isSelectInput,\n triggererRef,\n });\n\n const getValue = (): string | undefined => {\n let prefix = '';\n if (props.labelPosition === 'inside-input' && props.label) {\n prefix = `${props.label}: `;\n }\n\n if (props.isSelectInput) {\n if (selectionType === 'single') {\n return `${prefix}${displayValue}`;\n }\n\n // In multiselect, we return tags so no display value is required\n return undefined;\n }\n\n // In AutoComplete, input has a special value too\n return props.inputValue;\n };\n\n const getTags = React.useMemo(\n () => ({ size }: { size: NonNullable<BaseInputProps['size']> }) => {\n if (selectionType === 'single') {\n return undefined;\n }\n\n return getTagsGroup({\n size,\n tags: selectedIndices.map((selectedIndex) => options[selectedIndex]?.title),\n activeTagIndex,\n isDisabled: props.isDisabled,\n onDismiss: ({ tagIndex }) => {\n if (isTagDismissedRef.current) {\n isTagDismissedRef.current.value = true;\n }\n\n if (!isReactNative()) {\n triggererRef.current?.focus();\n }\n\n removeOption(selectedIndices[tagIndex]);\n setChangeCallbackTriggerer(Number(changeCallbackTriggerer) + 1);\n },\n });\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [selectedIndices, selectionType, activeTagIndex, changeCallbackTriggerer, options],\n );\n\n const tableInputProps: Partial<BaseInputProps> = {\n isTableInputCell: rowDensityToIsTableInputCellMapping[rowDensity],\n id: 'table-editable-cell-input',\n size: tableEditableCellRowDensityToInputSizeMap[rowDensity],\n trailingIcon: validationStateToInputTrailingIconMap[props.validationState ?? 'none'],\n showHintsAsTooltip: true,\n };\n\n const isValidationStateNone =\n props.validationState === 'none' || props.validationState === undefined;\n\n return (\n <BaseInput\n as={props.isSelectInput ? 'button' : 'input'}\n ref={\n (isReactNative()\n ? null\n : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (node: any) => {\n if (isAutoCompleteInHeader) {\n headerAutoCompleteRef.current = node;\n } else {\n triggererRef.current = node;\n }\n\n if (ref) {\n if (typeof ref === 'function') {\n ref(node);\n } else {\n ref.current = node;\n }\n }\n }) as never\n }\n isDropdownTrigger={true}\n setInputWrapperRef={(wrapperNode) => {\n // when autocomplete is in header, its not a trigger but a component inside of DropdownOverlay\n if (!isAutoCompleteInHeader) {\n triggererWrapperRef.current = wrapperNode;\n }\n }}\n maxTagRows={props.maxRows ?? 'single'}\n tags={getTags({ size: props.size || 'medium' })}\n showAllTags={getShowAllTags()}\n activeTagIndex={activeTagIndex}\n setActiveTagIndex={setActiveTagIndex}\n shouldIgnoreBlurAnimation={shouldIgnoreBlurAnimation}\n setShouldIgnoreBlurAnimation={setShouldIgnoreBlurAnimation}\n textAlign=\"left\"\n // Form Props\n label={props.label as string}\n placeholder={\n selectionType === 'multiple' && selectedIndices.length > 0\n ? undefined\n : dropdownTriggerPlaceholder\n }\n hideLabelText={props.label?.length === 0}\n accessibilityLabel={props.accessibilityLabel}\n labelPosition={props.labelPosition === 'inside-input' ? undefined : props.labelPosition}\n isLabelInsideInput={props.labelPosition === 'inside-input'}\n necessityIndicator={props.necessityIndicator}\n autoCompleteSuggestionType=\"none\"\n validationState={props.validationState}\n helpText={props.helpText}\n errorText={props.errorText}\n successText={props.successText}\n name={props.name}\n isDisabled={props.isDisabled}\n isRequired={props.isRequired}\n prefix={props.prefix}\n suffix={props.suffix}\n autoFocus={props.autoFocus} // eslint-disable-line jsx-a11y/no-autofocus\n value={getValue()}\n onClick={(e) => {\n if (props.isDisabled) {\n return;\n }\n props.onTriggerClick?.(e);\n }}\n onFocus={props.onFocus}\n onBlur={({ name }) => {\n props.onBlur?.({ name, value });\n }}\n leadingIcon={props.icon}\n // Meta Props\n componentName={props.isSelectInput ? MetaConstants.SelectInput : MetaConstants.AutoComplete}\n testID={props.testID}\n // a11y Props\n id={`${dropdownBaseId}-trigger`}\n labelId={`${dropdownBaseId}-label`}\n role={isAutoCompleteInHeader ? 'searchbox' : 'combobox'}\n hasPopup={\n isAutoCompleteInHeader\n ? false\n : getActionListContainerRole(hasFooterAction, dropdownTriggerer)\n }\n isPopupExpanded={isOpen}\n activeDescendant={activeIndex >= 0 ? `${dropdownBaseId}-${activeIndex}` : undefined}\n popupId={isAutoCompleteInHeader ? undefined : `${dropdownBaseId}-actionlist`}\n // Special Props for Unique behaviour between Select and AutoComplete\n onChange={props.isSelectInput ? undefined : props.onInputValueChange}\n onKeyDown={props.onTriggerKeydown}\n size={props.size}\n {...makeAnalyticsAttribute(props)}\n onTrailingInteractionElementClick={() => {\n if (!props.isDisabled) {\n // Icon onClicks to the SelectInput itself\n if (!isReactNative()) {\n triggererRef.current?.focus();\n }\n onTriggerClick();\n }\n }}\n trailingInteractionElement={\n isAutoCompleteInHeader || (isInsideTableEditableCell && !isValidationStateNone) ? null : (\n <InputChevronIcon isDisabled={props.isDisabled} isOpen={isOpen} />\n )\n }\n {...(isInsideTableEditableCell ? tableInputProps : undefined)}\n // When AutoComplete is present inside DropdownOverlay, the floating ui adds tabIndex -1 internally. We override it with tabIndex 0 here\n tabIndex={isAutoCompleteInHeader ? 0 : undefined}\n />\n );\n};\n\nconst BaseDropdownInputTrigger = React.forwardRef(_BaseDropdownInputTrigger);\n\nexport { BaseDropdownInputTrigger };\n"],"names":["useControlledDropdownInput","props","isFirstRender","useFirstRender","_useDropdown","useDropdown","changeCallbackTriggerer","isControlled","options","selectedIndices","controlledValueIndices","setSelectedIndices","selectionType","setIsControlled","getValuesArrayFromIndices","indices","map","selectionIndex","value","selectValues","valuesToSelect","length","isEmpty","selectedItemIndex","findIndex","option","uniqueValues","Array","from","Set","userValues","selectedItemIndices","optionValue","filter","React","useEffect","defaultValue","undefined","isArray","isSelectInput","syncInputValueWithSelection","onChange","name","values","isBrowser","fireNativeEvent","triggererRef","_BaseDropdownInputTrigger","ref","_props$placeholder","_props$validationStat","_props$maxRows","_props$label","_useDropdown2","isOpen","activeTagIndex","setActiveTagIndex","displayValue","dropdownTriggerer","dropdownBaseId","headerAutoCompleteRef","triggererWrapperRef","isTagDismissedRef","onTriggerClick","shouldIgnoreBlurAnimation","setShouldIgnoreBlurAnimation","activeIndex","hasFooterAction","removeOption","setChangeCallbackTriggerer","_useTableContext","useTableContext","rowDensity","_useTableEditableCell","useTableEditableCell","isInsideTableEditableCell","dropdownTriggerPlaceholder","placeholder","isAutoCompleteInHeader","dropdownComponentIds","triggers","AutoComplete","getShowAllTags","useCallback","getValue","prefix","labelPosition","label","inputValue","getTags","useMemo","_ref","size","getTagsGroup","tags","selectedIndex","_options$selectedInde","title","isDisabled","onDismiss","_ref2","tagIndex","current","isReactNative","_triggererRef$current","focus","Number","tableInputProps","isTableInputCell","rowDensityToIsTableInputCellMapping","id","tableEditableCellRowDensityToInputSizeMap","trailingIcon","validationStateToInputTrailingIconMap","validationState","showHintsAsTooltip","isValidationStateNone","_jsx","BaseInput","Object","assign","as","node","isDropdownTrigger","setInputWrapperRef","wrapperNode","maxTagRows","maxRows","showAllTags","textAlign","hideLabelText","accessibilityLabel","isLabelInsideInput","necessityIndicator","autoCompleteSuggestionType","helpText","errorText","successText","isRequired","suffix","autoFocus","onClick","e","onFocus","onBlur","_ref3","leadingIcon","icon","componentName","MetaConstants","SelectInput","testID","labelId","role","hasPopup","getActionListContainerRole","isPopupExpanded","activeDescendant","popupId","onInputValueChange","onKeyDown","onTriggerKeydown","makeAnalyticsAttribute","onTrailingInteractionElementClick","_triggererRef$current2","trailingInteractionElement","InputChevronIcon","tabIndex","BaseDropdownInputTrigger","forwardRef"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BaseDropdownInputTrigger.js","sources":["../../../../../../src/components/Input/DropdownInputTriggers/BaseDropdownInputTrigger.tsx"],"sourcesContent":["import React from 'react';\nimport { BaseInput } from '../BaseInput';\nimport type { BaseInputProps } from '../BaseInput';\nimport { InputChevronIcon } from './InputChevronIcon';\nimport type { BaseDropdownInputTriggerProps } from './types';\nimport { useDropdown } from '~components/Dropdown/useDropdown';\nimport { isReactNative } from '~utils';\nimport { getActionListContainerRole } from '~components/ActionList/getA11yRoles';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { getTagsGroup } from '~components/Tag/getTagsGroup';\nimport type { BladeElementRef } from '~utils/types';\nimport { useTableContext } from '~components/Table/TableContext';\nimport {\n rowDensityToIsTableInputCellMapping,\n tableEditableCellRowDensityToInputSizeMap,\n validationStateToInputTrailingIconMap,\n} from '~components/Table/tokens';\nimport { useTableEditableCell } from '~components/Table/TableEditableCellContext';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\nimport { dropdownComponentIds } from '~components/Dropdown/dropdownComponentIds';\nimport { useControlledDropdownInput } from '~utils/useControlledDropdownInput';\n\nconst _BaseDropdownInputTrigger = (\n props: BaseDropdownInputTriggerProps,\n ref: React.ForwardedRef<BladeElementRef>,\n): React.ReactElement => {\n const {\n isOpen,\n activeTagIndex,\n setActiveTagIndex,\n displayValue,\n selectionType,\n dropdownTriggerer,\n dropdownBaseId,\n selectedIndices,\n triggererRef,\n headerAutoCompleteRef,\n triggererWrapperRef,\n isTagDismissedRef,\n onTriggerClick,\n value,\n shouldIgnoreBlurAnimation,\n setShouldIgnoreBlurAnimation,\n activeIndex,\n hasFooterAction,\n options,\n removeOption,\n setChangeCallbackTriggerer,\n changeCallbackTriggerer,\n } = useDropdown();\n const { rowDensity } = useTableContext();\n const { isInsideTableEditableCell } = useTableEditableCell();\n\n const dropdownTriggerPlaceholder = props.placeholder ?? 'Select Option';\n const isAutoCompleteInHeader =\n !props.isSelectInput && dropdownTriggerer !== dropdownComponentIds.triggers.AutoComplete;\n\n const getShowAllTags = React.useCallback((): boolean => {\n if (isAutoCompleteInHeader) {\n // When AutoComplete is in bottomsheet header, we never want to show all tags in outer select input\n if (props.isSelectInput) {\n return false;\n }\n\n // ... And we always want to show all tags in inner AutoComplete\n return true;\n }\n\n return isOpen;\n }, [isAutoCompleteInHeader, props.isSelectInput, isOpen]);\n\n useControlledDropdownInput({\n onChange: props.onChange,\n name: props.name,\n value: props.value,\n defaultValue: props.defaultValue,\n syncInputValueWithSelection: props.syncInputValueWithSelection,\n isSelectInput: props.isSelectInput,\n triggererRef,\n });\n\n const getValue = (): string | undefined => {\n let prefix = '';\n if (props.labelPosition === 'inside-input' && props.label) {\n prefix = `${props.label}: `;\n }\n\n if (props.isSelectInput) {\n if (selectionType === 'single') {\n return `${prefix}${displayValue}`;\n }\n\n // In multiselect, we return tags so no display value is required\n return undefined;\n }\n\n // In AutoComplete, input has a special value too\n return props.inputValue;\n };\n\n const getTags = React.useMemo(\n () => ({ size }: { size: NonNullable<BaseInputProps['size']> }) => {\n if (selectionType === 'single') {\n return undefined;\n }\n\n return getTagsGroup({\n size,\n tags: selectedIndices.map((selectedIndex) => options[selectedIndex]?.title),\n activeTagIndex,\n isDisabled: props.isDisabled,\n onDismiss: ({ tagIndex }) => {\n if (isTagDismissedRef.current) {\n isTagDismissedRef.current.value = true;\n }\n\n if (!isReactNative()) {\n triggererRef.current?.focus();\n }\n\n removeOption(selectedIndices[tagIndex]);\n setChangeCallbackTriggerer(Number(changeCallbackTriggerer) + 1);\n },\n });\n },\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [selectedIndices, selectionType, activeTagIndex, changeCallbackTriggerer, options],\n );\n\n const tableInputProps: Partial<BaseInputProps> = {\n isTableInputCell: rowDensityToIsTableInputCellMapping[rowDensity],\n id: 'table-editable-cell-input',\n size: tableEditableCellRowDensityToInputSizeMap[rowDensity],\n trailingIcon: validationStateToInputTrailingIconMap[props.validationState ?? 'none'],\n showHintsAsTooltip: true,\n };\n\n const isValidationStateNone =\n props.validationState === 'none' || props.validationState === undefined;\n\n return (\n <BaseInput\n as={props.isSelectInput ? 'button' : 'input'}\n ref={\n (isReactNative()\n ? null\n : // eslint-disable-next-line @typescript-eslint/no-explicit-any\n (node: any) => {\n if (isAutoCompleteInHeader) {\n headerAutoCompleteRef.current = node;\n } else {\n triggererRef.current = node;\n }\n\n if (ref) {\n if (typeof ref === 'function') {\n ref(node);\n } else {\n ref.current = node;\n }\n }\n }) as never\n }\n isDropdownTrigger={true}\n setInputWrapperRef={(wrapperNode) => {\n // when autocomplete is in header, its not a trigger but a component inside of DropdownOverlay\n if (!isAutoCompleteInHeader) {\n triggererWrapperRef.current = wrapperNode;\n }\n }}\n maxTagRows={props.maxRows ?? 'single'}\n tags={getTags({ size: props.size || 'medium' })}\n showAllTags={getShowAllTags()}\n activeTagIndex={activeTagIndex}\n setActiveTagIndex={setActiveTagIndex}\n shouldIgnoreBlurAnimation={shouldIgnoreBlurAnimation}\n setShouldIgnoreBlurAnimation={setShouldIgnoreBlurAnimation}\n textAlign=\"left\"\n // Form Props\n label={props.label as string}\n placeholder={\n selectionType === 'multiple' && selectedIndices.length > 0\n ? undefined\n : dropdownTriggerPlaceholder\n }\n hideLabelText={props.label?.length === 0}\n accessibilityLabel={props.accessibilityLabel}\n labelPosition={props.labelPosition === 'inside-input' ? undefined : props.labelPosition}\n isLabelInsideInput={props.labelPosition === 'inside-input'}\n necessityIndicator={props.necessityIndicator}\n autoCompleteSuggestionType=\"none\"\n validationState={props.validationState}\n helpText={props.helpText}\n errorText={props.errorText}\n successText={props.successText}\n name={props.name}\n isDisabled={props.isDisabled}\n isRequired={props.isRequired}\n prefix={props.prefix}\n suffix={props.suffix}\n autoFocus={props.autoFocus} // eslint-disable-line jsx-a11y/no-autofocus\n value={getValue()}\n onClick={(e) => {\n if (props.isDisabled) {\n return;\n }\n props.onTriggerClick?.(e);\n }}\n onFocus={props.onFocus}\n onBlur={({ name }) => {\n props.onBlur?.({ name, value });\n }}\n leadingIcon={props.icon}\n // Meta Props\n componentName={props.isSelectInput ? MetaConstants.SelectInput : MetaConstants.AutoComplete}\n testID={props.testID}\n // a11y Props\n id={`${dropdownBaseId}-trigger`}\n labelId={`${dropdownBaseId}-label`}\n role={isAutoCompleteInHeader ? 'searchbox' : 'combobox'}\n hasPopup={\n isAutoCompleteInHeader\n ? false\n : getActionListContainerRole(hasFooterAction, dropdownTriggerer)\n }\n isPopupExpanded={isOpen}\n activeDescendant={activeIndex >= 0 ? `${dropdownBaseId}-${activeIndex}` : undefined}\n popupId={isAutoCompleteInHeader ? undefined : `${dropdownBaseId}-actionlist`}\n // Special Props for Unique behaviour between Select and AutoComplete\n onChange={props.isSelectInput ? undefined : props.onInputValueChange}\n onKeyDown={props.onTriggerKeydown}\n size={props.size}\n {...makeAnalyticsAttribute(props)}\n onTrailingInteractionElementClick={() => {\n if (!props.isDisabled) {\n // Icon onClicks to the SelectInput itself\n if (!isReactNative()) {\n triggererRef.current?.focus();\n }\n onTriggerClick();\n }\n }}\n trailingInteractionElement={\n isAutoCompleteInHeader || (isInsideTableEditableCell && !isValidationStateNone) ? null : (\n <InputChevronIcon isDisabled={props.isDisabled} isOpen={isOpen} />\n )\n }\n {...(isInsideTableEditableCell ? tableInputProps : undefined)}\n // When AutoComplete is present inside DropdownOverlay, the floating ui adds tabIndex -1 internally. We override it with tabIndex 0 here\n tabIndex={isAutoCompleteInHeader ? 0 : undefined}\n />\n );\n};\n\nconst BaseDropdownInputTrigger = React.forwardRef(_BaseDropdownInputTrigger);\n\nexport { BaseDropdownInputTrigger };\n"],"names":["_BaseDropdownInputTrigger","props","ref","_props$placeholder","_props$validationStat","_props$maxRows","_props$label","_useDropdown","useDropdown","isOpen","activeTagIndex","setActiveTagIndex","displayValue","selectionType","dropdownTriggerer","dropdownBaseId","selectedIndices","triggererRef","headerAutoCompleteRef","triggererWrapperRef","isTagDismissedRef","onTriggerClick","value","shouldIgnoreBlurAnimation","setShouldIgnoreBlurAnimation","activeIndex","hasFooterAction","options","removeOption","setChangeCallbackTriggerer","changeCallbackTriggerer","_useTableContext","useTableContext","rowDensity","_useTableEditableCell","useTableEditableCell","isInsideTableEditableCell","dropdownTriggerPlaceholder","placeholder","isAutoCompleteInHeader","isSelectInput","dropdownComponentIds","triggers","AutoComplete","getShowAllTags","React","useCallback","useControlledDropdownInput","onChange","name","defaultValue","syncInputValueWithSelection","getValue","prefix","labelPosition","label","undefined","inputValue","getTags","useMemo","_ref","size","getTagsGroup","tags","map","selectedIndex","_options$selectedInde","title","isDisabled","onDismiss","_ref2","tagIndex","current","isReactNative","_triggererRef$current","focus","Number","tableInputProps","isTableInputCell","rowDensityToIsTableInputCellMapping","id","tableEditableCellRowDensityToInputSizeMap","trailingIcon","validationStateToInputTrailingIconMap","validationState","showHintsAsTooltip","isValidationStateNone","_jsx","BaseInput","Object","assign","as","node","isDropdownTrigger","setInputWrapperRef","wrapperNode","maxTagRows","maxRows","showAllTags","textAlign","length","hideLabelText","accessibilityLabel","isLabelInsideInput","necessityIndicator","autoCompleteSuggestionType","helpText","errorText","successText","isRequired","suffix","autoFocus","onClick","e","onFocus","onBlur","_ref3","leadingIcon","icon","componentName","MetaConstants","SelectInput","testID","labelId","role","hasPopup","getActionListContainerRole","isPopupExpanded","activeDescendant","popupId","onInputValueChange","onKeyDown","onTriggerKeydown","makeAnalyticsAttribute","onTrailingInteractionElementClick","_triggererRef$current2","trailingInteractionElement","InputChevronIcon","tabIndex","BaseDropdownInputTrigger","forwardRef"],"mappings":";;;;;;;;;;;;;;;;;;;;AAsBA,IAAMA,yBAAyB,CAAG,SAA5BA,yBAAyBA,CAC7BC,KAAoC,CACpCC,GAAwC,CACjB,CAAAC,IAAAA,kBAAA,CAAAC,qBAAA,CAAAC,cAAA,CAAAC,YAAA,CACvB,IAAAC,YAAA,CAuBIC,WAAW,EAAE,CAtBfC,MAAM,CAAAF,YAAA,CAANE,MAAM,CACNC,cAAc,CAAAH,YAAA,CAAdG,cAAc,CACdC,iBAAiB,CAAAJ,YAAA,CAAjBI,iBAAiB,CACjBC,YAAY,CAAAL,YAAA,CAAZK,YAAY,CACZC,aAAa,CAAAN,YAAA,CAAbM,aAAa,CACbC,iBAAiB,CAAAP,YAAA,CAAjBO,iBAAiB,CACjBC,cAAc,CAAAR,YAAA,CAAdQ,cAAc,CACdC,eAAe,CAAAT,YAAA,CAAfS,eAAe,CACfC,YAAY,CAAAV,YAAA,CAAZU,YAAY,CACZC,qBAAqB,CAAAX,YAAA,CAArBW,qBAAqB,CACrBC,mBAAmB,CAAAZ,YAAA,CAAnBY,mBAAmB,CACnBC,iBAAiB,CAAAb,YAAA,CAAjBa,iBAAiB,CACjBC,cAAc,CAAAd,YAAA,CAAdc,cAAc,CACdC,KAAK,CAAAf,YAAA,CAALe,KAAK,CACLC,yBAAyB,CAAAhB,YAAA,CAAzBgB,yBAAyB,CACzBC,4BAA4B,CAAAjB,YAAA,CAA5BiB,4BAA4B,CAC5BC,WAAW,CAAAlB,YAAA,CAAXkB,WAAW,CACXC,eAAe,CAAAnB,YAAA,CAAfmB,eAAe,CACfC,OAAO,CAAApB,YAAA,CAAPoB,OAAO,CACPC,YAAY,CAAArB,YAAA,CAAZqB,YAAY,CACZC,0BAA0B,CAAAtB,YAAA,CAA1BsB,0BAA0B,CAC1BC,uBAAuB,CAAAvB,YAAA,CAAvBuB,uBAAuB,CAEzB,IAAAC,gBAAA,CAAuBC,eAAe,EAAE,CAAhCC,UAAU,CAAAF,gBAAA,CAAVE,UAAU,CAClB,IAAAC,qBAAA,CAAsCC,oBAAoB,EAAE,CAApDC,yBAAyB,CAAAF,qBAAA,CAAzBE,yBAAyB,CAEjC,IAAMC,0BAA0B,CAAAlC,CAAAA,kBAAA,CAAGF,KAAK,CAACqC,WAAW,GAAA,IAAA,CAAAnC,kBAAA,CAAI,eAAe,CACvE,IAAMoC,sBAAsB,CAC1B,CAACtC,KAAK,CAACuC,aAAa,EAAI1B,iBAAiB,GAAK2B,oBAAoB,CAACC,QAAQ,CAACC,YAAY,CAE1F,IAAMC,cAAc,CAAGC,cAAK,CAACC,WAAW,CAAC,UAAe,CACtD,GAAIP,sBAAsB,CAAE,CAE1B,GAAItC,KAAK,CAACuC,aAAa,CAAE,CACvB,OAAY,KAAA,CACd,CAGA,WAAW,CACb,CAEA,OAAO/B,MAAM,CACf,CAAC,CAAE,CAAC8B,sBAAsB,CAAEtC,KAAK,CAACuC,aAAa,CAAE/B,MAAM,CAAC,CAAC,CAEzDsC,0BAA0B,CAAC,CACzBC,QAAQ,CAAE/C,KAAK,CAAC+C,QAAQ,CACxBC,IAAI,CAAEhD,KAAK,CAACgD,IAAI,CAChB3B,KAAK,CAAErB,KAAK,CAACqB,KAAK,CAClB4B,YAAY,CAAEjD,KAAK,CAACiD,YAAY,CAChCC,2BAA2B,CAAElD,KAAK,CAACkD,2BAA2B,CAC9DX,aAAa,CAAEvC,KAAK,CAACuC,aAAa,CAClCvB,YAAY,CAAZA,YACF,CAAC,CAAC,CAEF,IAAMmC,QAAQ,CAAG,SAAXA,QAAQA,EAA6B,CACzC,IAAIC,MAAM,CAAG,EAAE,CACf,GAAIpD,KAAK,CAACqD,aAAa,GAAK,cAAc,EAAIrD,KAAK,CAACsD,KAAK,CAAE,CACzDF,MAAM,CAAI,CAAA,EAAEpD,KAAK,CAACsD,KAAM,CAAG,EAAA,CAAA,CAC7B,CAEA,GAAItD,KAAK,CAACuC,aAAa,CAAE,CACvB,GAAI3B,aAAa,GAAK,QAAQ,CAAE,CAC9B,OAAQ,CAAA,EAAEwC,MAAO,CAAEzC,EAAAA,YAAa,CAAC,CAAA,CACnC,CAGA,OAAO4C,SAAS,CAClB,CAGA,OAAOvD,KAAK,CAACwD,UAAU,CACzB,CAAC,CAED,IAAMC,OAAO,CAAGb,cAAK,CAACc,OAAO,CAC3B,UAAM,CAAA,OAAA,SAAAC,IAAA,CAA6D,CAAA,IAA1DC,IAAI,CAAAD,IAAA,CAAJC,IAAI,CACX,GAAIhD,aAAa,GAAK,QAAQ,CAAE,CAC9B,OAAO2C,SAAS,CAClB,CAEA,OAAOM,YAAY,CAAC,CAClBD,IAAI,CAAJA,IAAI,CACJE,IAAI,CAAE/C,eAAe,CAACgD,GAAG,CAAC,SAACC,aAAa,CAAA,CAAA,IAAAC,qBAAA,CAAAA,OAAAA,CAAAA,qBAAA,CAAKvC,OAAO,CAACsC,aAAa,CAAC,GAAA,IAAA,CAAA,KAAA,CAAA,CAAtBC,qBAAA,CAAwBC,KAAK,CAAC,CAAA,CAAA,CAC3EzD,cAAc,CAAdA,cAAc,CACd0D,UAAU,CAAEnE,KAAK,CAACmE,UAAU,CAC5BC,SAAS,CAAE,SAAAA,SAAAA,CAAAC,KAAA,CAAkB,CAAA,IAAfC,QAAQ,CAAAD,KAAA,CAARC,QAAQ,CACpB,GAAInD,iBAAiB,CAACoD,OAAO,CAAE,CAC7BpD,iBAAiB,CAACoD,OAAO,CAAClD,KAAK,CAAG,IAAI,CACxC,CAEA,GAAI,CAACmD,aAAa,EAAE,CAAE,CAAAC,IAAAA,qBAAA,CACpB,CAAAA,qBAAA,CAAAzD,YAAY,CAACuD,OAAO,GAApBE,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,qBAAA,CAAsBC,KAAK,EAAE,CAC/B,CAEA/C,YAAY,CAACZ,eAAe,CAACuD,QAAQ,CAAC,CAAC,CACvC1C,0BAA0B,CAAC+C,MAAM,CAAC9C,uBAAuB,CAAC,CAAG,CAAC,CAAC,CACjE,CACF,CAAC,CAAC,CACJ,CAAC,CAAA,CAAA,CAED,CAACd,eAAe,CAAEH,aAAa,CAAEH,cAAc,CAAEoB,uBAAuB,CAAEH,OAAO,CACnF,CAAC,CAED,IAAMkD,eAAwC,CAAG,CAC/CC,gBAAgB,CAAEC,mCAAmC,CAAC9C,UAAU,CAAC,CACjE+C,EAAE,CAAE,2BAA2B,CAC/BnB,IAAI,CAAEoB,yCAAyC,CAAChD,UAAU,CAAC,CAC3DiD,YAAY,CAAEC,qCAAqC,CAAA/E,CAAAA,qBAAA,CAACH,KAAK,CAACmF,eAAe,QAAAhF,qBAAA,CAAI,MAAM,CAAC,CACpFiF,kBAAkB,CAAE,IACtB,CAAC,CAED,IAAMC,qBAAqB,CACzBrF,KAAK,CAACmF,eAAe,GAAK,MAAM,EAAInF,KAAK,CAACmF,eAAe,GAAK5B,SAAS,CAEzE,OACE+B,GAAA,CAACC,SAAS,CAAAC,MAAA,CAAAC,MAAA,CACRC,CAAAA,EAAE,CAAE1F,KAAK,CAACuC,aAAa,CAAG,QAAQ,CAAG,OAAQ,CAC7CtC,GAAG,CACAuE,aAAa,EAAE,CACZ,IAAI,CAEJ,SAACmB,IAAS,CAAK,CACb,GAAIrD,sBAAsB,CAAE,CAC1BrB,qBAAqB,CAACsD,OAAO,CAAGoB,IAAI,CACtC,CAAC,KAAM,CACL3E,YAAY,CAACuD,OAAO,CAAGoB,IAAI,CAC7B,CAEA,GAAI1F,GAAG,CAAE,CACP,GAAI,OAAOA,GAAG,GAAK,UAAU,CAAE,CAC7BA,GAAG,CAAC0F,IAAI,CAAC,CACX,CAAC,KAAM,CACL1F,GAAG,CAACsE,OAAO,CAAGoB,IAAI,CACpB,CACF,CACF,CACL,CACDC,iBAAiB,CAAE,IAAK,CACxBC,kBAAkB,CAAE,SAAAA,mBAACC,WAAW,CAAK,CAEnC,GAAI,CAACxD,sBAAsB,CAAE,CAC3BpB,mBAAmB,CAACqD,OAAO,CAAGuB,WAAW,CAC3C,CACF,CAAE,CACFC,UAAU,CAAA,CAAA3F,cAAA,CAAEJ,KAAK,CAACgG,OAAO,QAAA5F,cAAA,CAAI,QAAS,CACtC0D,IAAI,CAAEL,OAAO,CAAC,CAAEG,IAAI,CAAE5D,KAAK,CAAC4D,IAAI,EAAI,QAAS,CAAC,CAAE,CAChDqC,WAAW,CAAEtD,cAAc,EAAG,CAC9BlC,cAAc,CAAEA,cAAe,CAC/BC,iBAAiB,CAAEA,iBAAkB,CACrCY,yBAAyB,CAAEA,yBAA0B,CACrDC,4BAA4B,CAAEA,4BAA6B,CAC3D2E,SAAS,CAAC,MAAM,CAEhB5C,KAAK,CAAEtD,KAAK,CAACsD,KAAgB,CAC7BjB,WAAW,CACTzB,aAAa,GAAK,UAAU,EAAIG,eAAe,CAACoF,MAAM,CAAG,CAAC,CACtD5C,SAAS,CACTnB,0BACL,CACDgE,aAAa,CAAE,CAAA/F,CAAAA,YAAA,CAAAL,KAAK,CAACsD,KAAK,GAAA,IAAA,CAAA,KAAA,CAAA,CAAXjD,YAAA,CAAa8F,MAAM,IAAK,CAAE,CACzCE,kBAAkB,CAAErG,KAAK,CAACqG,kBAAmB,CAC7ChD,aAAa,CAAErD,KAAK,CAACqD,aAAa,GAAK,cAAc,CAAGE,SAAS,CAAGvD,KAAK,CAACqD,aAAc,CACxFiD,kBAAkB,CAAEtG,KAAK,CAACqD,aAAa,GAAK,cAAe,CAC3DkD,kBAAkB,CAAEvG,KAAK,CAACuG,kBAAmB,CAC7CC,0BAA0B,CAAC,MAAM,CACjCrB,eAAe,CAAEnF,KAAK,CAACmF,eAAgB,CACvCsB,QAAQ,CAAEzG,KAAK,CAACyG,QAAS,CACzBC,SAAS,CAAE1G,KAAK,CAAC0G,SAAU,CAC3BC,WAAW,CAAE3G,KAAK,CAAC2G,WAAY,CAC/B3D,IAAI,CAAEhD,KAAK,CAACgD,IAAK,CACjBmB,UAAU,CAAEnE,KAAK,CAACmE,UAAW,CAC7ByC,UAAU,CAAE5G,KAAK,CAAC4G,UAAW,CAC7BxD,MAAM,CAAEpD,KAAK,CAACoD,MAAO,CACrByD,MAAM,CAAE7G,KAAK,CAAC6G,MAAO,CACrBC,SAAS,CAAE9G,KAAK,CAAC8G,SAAU,CAC3BzF,KAAK,CAAE8B,QAAQ,EAAG,CAClB4D,OAAO,CAAE,SAAAA,OAAAA,CAACC,CAAC,CAAK,CACd,GAAIhH,KAAK,CAACmE,UAAU,CAAE,CACpB,OACF,CACAnE,KAAK,CAACoB,cAAc,EAApBpB,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,KAAK,CAACoB,cAAc,CAAG4F,CAAC,CAAC,CAC3B,CAAE,CACFC,OAAO,CAAEjH,KAAK,CAACiH,OAAQ,CACvBC,MAAM,CAAE,SAAAA,MAAAA,CAAAC,KAAA,CAAc,KAAXnE,IAAI,CAAAmE,KAAA,CAAJnE,IAAI,CACbhD,KAAK,CAACkH,MAAM,EAAZlH,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,KAAK,CAACkH,MAAM,CAAG,CAAElE,IAAI,CAAJA,IAAI,CAAE3B,KAAK,CAALA,KAAM,CAAC,CAAC,CACjC,CAAE,CACF+F,WAAW,CAAEpH,KAAK,CAACqH,IAAK,CAExBC,aAAa,CAAEtH,KAAK,CAACuC,aAAa,CAAGgF,aAAa,CAACC,WAAW,CAAGD,aAAa,CAAC7E,YAAa,CAC5F+E,MAAM,CAAEzH,KAAK,CAACyH,MAAO,CAErB1C,EAAE,CAAG,CAAA,EAAEjE,cAAe,CAAU,QAAA,CAAA,CAChC4G,OAAO,CAAG,GAAE5G,cAAe,CAAA,MAAA,CAAQ,CACnC6G,IAAI,CAAErF,sBAAsB,CAAG,WAAW,CAAG,UAAW,CACxDsF,QAAQ,CACNtF,sBAAsB,CAClB,KAAK,CACLuF,0BAA0B,CAACpG,eAAe,CAAEZ,iBAAiB,CAClE,CACDiH,eAAe,CAAEtH,MAAO,CACxBuH,gBAAgB,CAAEvG,WAAW,EAAI,CAAC,CAAI,CAAEV,EAAAA,cAAe,CAAGU,CAAAA,EAAAA,WAAY,EAAC,CAAG+B,SAAU,CACpFyE,OAAO,CAAE1F,sBAAsB,CAAGiB,SAAS,CAAI,GAAEzC,cAAe,CAAA,WAAA,CAAa,CAE7EiC,QAAQ,CAAE/C,KAAK,CAACuC,aAAa,CAAGgB,SAAS,CAAGvD,KAAK,CAACiI,kBAAmB,CACrEC,SAAS,CAAElI,KAAK,CAACmI,gBAAiB,CAClCvE,IAAI,CAAE5D,KAAK,CAAC4D,IAAK,CACbwE,CAAAA,sBAAsB,CAACpI,KAAK,CAAC,CACjCqI,CAAAA,iCAAiC,CAAE,SAAAA,iCAAAA,EAAM,CACvC,GAAI,CAACrI,KAAK,CAACmE,UAAU,CAAE,CAErB,GAAI,CAACK,aAAa,EAAE,CAAE,CAAA8D,IAAAA,sBAAA,CACpB,CAAAA,sBAAA,CAAAtH,YAAY,CAACuD,OAAO,GAApB+D,IAAAA,CAAAA,KAAAA,CAAAA,CAAAA,sBAAA,CAAsB5D,KAAK,EAAE,CAC/B,CACAtD,cAAc,EAAE,CAClB,CACF,CAAE,CACFmH,0BAA0B,CACxBjG,sBAAsB,EAAKH,yBAAyB,EAAI,CAACkD,qBAAsB,CAAG,IAAI,CACpFC,GAAA,CAACkD,gBAAgB,CAAA,CAACrE,UAAU,CAAEnE,KAAK,CAACmE,UAAW,CAAC3D,MAAM,CAAEA,MAAO,CAAE,CAEpE,EACI2B,yBAAyB,CAAGyC,eAAe,CAAGrB,SAAS,CAE5DkF,CAAAA,QAAQ,CAAEnG,sBAAsB,CAAG,CAAC,CAAGiB,SAAU,CAAA,CAClD,CAAC,CAEN,CAAC,CAEK,IAAAmF,wBAAwB,CAAG9F,cAAK,CAAC+F,UAAU,CAAC5I,yBAAyB;;;;"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
2
2
|
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
3
|
-
import React__default, { useState } from 'react';
|
|
3
|
+
import React__default, { useState, useEffect } from 'react';
|
|
4
4
|
import { BaseInput } from '../BaseInput/BaseInput.js';
|
|
5
5
|
import { getKeyboardAndAutocompleteProps } from '../BaseInput/utils.js';
|
|
6
6
|
import isEmpty from '../../../utils/lodashButBetter/isEmpty.js';
|
|
7
7
|
import 'react-native-svg';
|
|
8
8
|
import '@babel/runtime/helpers/defineProperty';
|
|
9
9
|
import { MetaConstants } from '../../../utils/metaAttribute/metaConstants.js';
|
|
10
|
-
import { jsx } from 'react/jsx-runtime';
|
|
10
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
11
11
|
import '../../Icons/_Svg/Svg/Svg.native.js';
|
|
12
12
|
import '../../../tokens/global/typography.js';
|
|
13
13
|
import '../../../tokens/global/motion.js';
|
|
@@ -27,8 +27,17 @@ import { assignWithoutSideEffects } from '../../../utils/assignWithoutSideEffect
|
|
|
27
27
|
import { useMergeRefs } from '../../../utils/useMergeRefs.js';
|
|
28
28
|
import { dropdownComponentIds } from '../../Dropdown/dropdownComponentIds.js';
|
|
29
29
|
import { useDropdown } from '../../Dropdown/useDropdown.js';
|
|
30
|
+
import '../../Dropdown/Dropdown.js';
|
|
31
|
+
import { DropdownOverlay } from '../../Dropdown/DropdownOverlay.native.js';
|
|
32
|
+
import '../../Dropdown/DropdownButton.js';
|
|
33
|
+
import '../../Dropdown/DropdownLink.js';
|
|
34
|
+
import '../../Dropdown/DropdownIconButton.js';
|
|
35
|
+
import '../../Dropdown/DropdownHeaderFooter.js';
|
|
36
|
+
import { InputDropdownButton } from '../../Dropdown/InputDropdownButton.native.js';
|
|
37
|
+
import { Divider } from '../../Divider/Divider.js';
|
|
38
|
+
import { getComponentId } from '../../../utils/isValidAllowedChildren/isValidAllowedChildren.js';
|
|
30
39
|
|
|
31
|
-
var _excluded=["label","accessibilityLabel","labelPosition","placeholder","defaultValue","name","value","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","helpText","onClearButtonClick","isLoading","autoCapitalize","autoFocus","testID","size","showSearchIcon"];var isReactNative=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var _SearchInput=function _SearchInput(_ref,ref){var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,placeholder=_ref.placeholder,defaultValue=_ref.defaultValue,name=_ref.name,value=_ref.value,_onChange=_ref.onChange,_onClick=_ref.onClick,onFocus=_ref.onFocus,onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,isDisabled=_ref.isDisabled,helpText=_ref.helpText,onClearButtonClick=_ref.onClearButtonClick,isLoading=_ref.isLoading,autoCapitalize=_ref.autoCapitalize,autoFocus=_ref.autoFocus,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,_ref$showSearchIcon=_ref.showSearchIcon,showSearchIcon=_ref$showSearchIcon===void 0?true:_ref$showSearchIcon,rest=_objectWithoutProperties(_ref,_excluded);var textInputRef=React__default.useRef(null);var mergedRef=useMergeRefs(ref,textInputRef);var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldShowClearButton=_useState2[0],setShouldShowClearButton=_useState2[1];var _useDropdown=useDropdown(),triggererWrapperRef=_useDropdown.triggererWrapperRef,onTriggerKeydown=_useDropdown.onTriggerKeydown,onTriggerClick=_useDropdown.onTriggerClick,dropdownTriggerer=_useDropdown.dropdownTriggerer;var isInsideDropdown=dropdownTriggerer==='SearchInput';React__default.useEffect(function(){setShouldShowClearButton(Boolean(defaultValue!=null?defaultValue:value));},[defaultValue,value]);var
|
|
40
|
+
var _excluded=["label","accessibilityLabel","labelPosition","placeholder","defaultValue","name","value","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","helpText","onClearButtonClick","isLoading","autoCapitalize","autoFocus","testID","size","showSearchIcon","trailing"];var isReactNative=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var _SearchInput=function _SearchInput(_ref,ref){var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,placeholder=_ref.placeholder,defaultValue=_ref.defaultValue,name=_ref.name,value=_ref.value,_onChange=_ref.onChange,_onClick=_ref.onClick,onFocus=_ref.onFocus,onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,isDisabled=_ref.isDisabled,helpText=_ref.helpText,onClearButtonClick=_ref.onClearButtonClick,isLoading=_ref.isLoading,autoCapitalize=_ref.autoCapitalize,autoFocus=_ref.autoFocus,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,_ref$showSearchIcon=_ref.showSearchIcon,showSearchIcon=_ref$showSearchIcon===void 0?true:_ref$showSearchIcon,trailing=_ref.trailing,rest=_objectWithoutProperties(_ref,_excluded);var textInputRef=React__default.useRef(null);var mergedRef=useMergeRefs(ref,textInputRef);var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldShowClearButton=_useState2[0],setShouldShowClearButton=_useState2[1];var _useState3=useState(false),_useState4=_slicedToArray(_useState3,2),isTrailingDropDownOpen=_useState4[0],setIsTrailingDropDownOpen=_useState4[1];var _useDropdown=useDropdown(),triggererWrapperRef=_useDropdown.triggererWrapperRef,onTriggerKeydown=_useDropdown.onTriggerKeydown,onTriggerClick=_useDropdown.onTriggerClick,dropdownTriggerer=_useDropdown.dropdownTriggerer,closeParentDropDown=_useDropdown.close,isParentDropDownOpen=_useDropdown.isOpen;var isInsideDropdown=dropdownTriggerer==='SearchInput';React__default.useEffect(function(){setShouldShowClearButton(Boolean(defaultValue!=null?defaultValue:value));},[defaultValue,value]);useEffect(function(){if(isParentDropDownOpen&&isTrailingDropDownOpen){setIsTrailingDropDownOpen(false);}},[closeParentDropDown,isParentDropDownOpen]);useEffect(function(){if(isTrailingDropDownOpen&&isParentDropDownOpen){closeParentDropDown();}},[setIsTrailingDropDownOpen,isTrailingDropDownOpen]);var trailingDropdown=trailing&&getComponentId(trailing)==='Dropdown'?trailing:null;var renderTrailingDropDown=function renderTrailingDropDown(){if(!trailingDropdown){return null;}return React__default.cloneElement(trailingDropdown,{selectionType:'single',isOpen:isTrailingDropDownOpen,onOpenChange:function onOpenChange(isOpen){setIsTrailingDropDownOpen(isOpen);},children:React__default.Children.map(trailingDropdown.props.children,function(child){if(child.type===InputDropdownButton){return React__default.cloneElement(child,{_isInsideSearchInput:true});}if(child.type===DropdownOverlay){return React__default.cloneElement(child,{referenceRef:triggererWrapperRef,_isNestedDropdown:true,defaultPlacement:'bottom-end'});}return child;})});};var renderClearButton=function renderClearButton(){return jsx(IconButton,{size:"medium",icon:CloseIcon,onClick:function onClick(){var _textInputRef$current;if(isEmpty(value)&&textInputRef.current){if(isReactNative(textInputRef.current)){textInputRef.current.clear();textInputRef.current.focus();}else if(textInputRef.current instanceof HTMLInputElement){textInputRef.current.value='';textInputRef.current.focus();}}onClearButtonClick==null?void 0:onClearButtonClick();textInputRef==null?void 0:(_textInputRef$current=textInputRef.current)==null?void 0:_textInputRef$current.focus();setShouldShowClearButton(false);},isDisabled:isDisabled,accessibilityLabel:"Clear Input Content"});};var renderInteractionElement=function renderInteractionElement(){if(isLoading){return jsx(Spinner,{accessibilityLabel:"Loading Content",color:"primary"});}if(shouldShowClearButton&&trailingDropdown){return jsxs(BaseBox,{display:"flex",gap:"spacing.3",children:[renderClearButton()," ",jsx(Divider,{orientation:"vertical"})]});}if(shouldShowClearButton){return renderClearButton();}return null;};return jsx(BaseBox,{position:"relative",children:jsx(BaseInput,Object.assign({id:"searchinput",componentName:MetaConstants.SearchInput,ref:mergedRef,isDropdownTrigger:true,setInputWrapperRef:isInsideDropdown||isTrailingDropDownOpen?function(wrapperNode){triggererWrapperRef.current=wrapperNode;}:undefined,label:label,accessibilityLabel:accessibilityLabel,hideLabelText:!Boolean(label),labelPosition:labelPosition,placeholder:placeholder,defaultValue:defaultValue,value:value,name:name,onKeyDown:isInsideDropdown?onTriggerKeydown:undefined,onChange:function onChange(_ref2){var name=_ref2.name,value=_ref2.value;if(value!=null&&value.length){setShouldShowClearButton(true);}if(shouldShowClearButton&&!(value!=null&&value.length)){setShouldShowClearButton(false);}_onChange==null?void 0:_onChange({name:name,value:value});},onClick:function onClick(e){if(isDisabled)return;if(isInsideDropdown){onTriggerClick();}_onClick==null?void 0:_onClick(e);},onFocus:onFocus,onBlur:onBlur,onSubmit:onSubmit,isDisabled:isDisabled,leadingIcon:showSearchIcon?SearchIcon:undefined,trailingInteractionElement:renderInteractionElement(),trailingDropDown:renderTrailingDropDown(),helpText:helpText,autoFocus:autoFocus,testID:testID},getKeyboardAndAutocompleteProps({type:'search',autoCapitalize:autoCapitalize}),{size:size},rest))});};var SearchInput=assignWithoutSideEffects(React__default.forwardRef(_SearchInput),{displayName:'SearchInput',componentId:dropdownComponentIds.triggers.SearchInput});
|
|
32
41
|
|
|
33
42
|
export { SearchInput };
|
|
34
43
|
//# sourceMappingURL=SearchInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchInput.js","sources":["../../../../../../src/components/Input/SearchInput/SearchInput.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport type { ReactElement, ReactNode } from 'react';\nimport type { TextInput as TextInputReactNative } from 'react-native';\nimport type { BaseInputProps } from '../BaseInput';\nimport { BaseInput } from '../BaseInput';\nimport { getKeyboardAndAutocompleteProps } from '../BaseInput/utils';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { CloseIcon, SearchIcon } from '~components/Icons';\nimport { IconButton } from '~components/Button/IconButton';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport BaseBox from '~components/Box/BaseBox';\nimport { Spinner } from '~components/Spinner';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getPlatformType } from '~utils';\nimport { useMergeRefs } from '~utils/useMergeRefs';\nimport type {\n BladeElementRef,\n BladeElementRefWithValue,\n DataAnalyticsAttribute,\n} from '~utils/types';\nimport { dropdownComponentIds } from '~components/Dropdown/dropdownComponentIds';\nimport { useDropdown } from '~components/Dropdown/useDropdown';\n\ntype SearchInputCommonProps = Pick<\n BaseInputProps,\n | 'label'\n | 'accessibilityLabel'\n | 'labelPosition'\n | 'helpText'\n | 'placeholder'\n | 'defaultValue'\n | 'name'\n | 'onChange'\n | 'onFocus'\n | 'onBlur'\n | 'value'\n | 'isDisabled'\n | 'autoFocus'\n | 'onSubmit'\n | 'autoCapitalize'\n | 'testID'\n | 'onClick'\n | 'size'\n | keyof DataAnalyticsAttribute\n> & {\n /**\n * Event handler to handle the onClick event for clear button.\n */\n onClearButtonClick?: () => void;\n\n /**\n * Decides whether to show a loading spinner for the input field.\n */\n isLoading?: boolean;\n /**\n * Toggle the visibility of the search icon.\n *\n * @default true\n */\n showSearchIcon?: boolean;\n} & StyledPropsBlade;\n\n/*\n Mandatory accessibilityLabel prop when label is not provided\n*/\ntype SearchInputPropsWithA11yLabel = {\n /**\n * Label to be shown for the input field\n */\n label?: undefined;\n /**\n * Accessibility label for the input\n */\n accessibilityLabel: string;\n};\n\n/*\n Optional accessibilityLabel prop when label is provided\n*/\ntype SearchInputPropsWithLabel = {\n /**\n * Label to be shown for the input field\n */\n label: string;\n /**\n * Accessibility label for the input\n */\n accessibilityLabel?: string;\n};\n\ntype SearchInputProps = (SearchInputPropsWithA11yLabel | SearchInputPropsWithLabel) &\n SearchInputCommonProps;\n\n// need to do this to tell TS to infer type as SearchInput of React Native and make it believe that `ref.current.clear()` exists\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst isReactNative = (_textInputRef?: any): _textInputRef is TextInputReactNative => {\n return getPlatformType() === 'react-native';\n};\n\nconst _SearchInput: React.ForwardRefRenderFunction<BladeElementRef, SearchInputProps> = (\n {\n label,\n accessibilityLabel,\n labelPosition = 'top',\n placeholder,\n defaultValue,\n name,\n value,\n onChange,\n onClick,\n onFocus,\n onBlur,\n onSubmit,\n isDisabled,\n helpText,\n onClearButtonClick,\n isLoading,\n autoCapitalize,\n autoFocus,\n testID,\n size = 'medium',\n showSearchIcon = true,\n ...rest\n },\n ref,\n): ReactElement => {\n const textInputRef = React.useRef<BladeElementRefWithValue>(null);\n const mergedRef = useMergeRefs(ref, textInputRef);\n const [shouldShowClearButton, setShouldShowClearButton] = useState(false);\n const {\n triggererWrapperRef,\n onTriggerKeydown,\n onTriggerClick,\n dropdownTriggerer,\n } = useDropdown();\n const isInsideDropdown = dropdownTriggerer === 'SearchInput';\n\n React.useEffect(() => {\n setShouldShowClearButton(Boolean(defaultValue ?? value));\n }, [defaultValue, value]);\n\n const renderInteractionElement = (): ReactNode => {\n if (isLoading) {\n return <Spinner accessibilityLabel=\"Loading Content\" color=\"primary\" />;\n }\n\n if (shouldShowClearButton) {\n return (\n <IconButton\n size=\"medium\"\n icon={CloseIcon}\n onClick={() => {\n if (isEmpty(value) && textInputRef.current) {\n // when the input field is uncontrolled take the ref and clear the input and then call the onClearButtonClick function\n if (isReactNative(textInputRef.current)) {\n textInputRef.current.clear();\n textInputRef.current.focus();\n } else if (textInputRef.current instanceof HTMLInputElement) {\n textInputRef.current.value = '';\n textInputRef.current.focus();\n }\n }\n\n // if the input field is controlled just call the click handler and the value change shall be left upto the consumer\n onClearButtonClick?.();\n textInputRef?.current?.focus();\n setShouldShowClearButton(false);\n }}\n isDisabled={isDisabled}\n accessibilityLabel=\"Clear Input Content\"\n />\n );\n }\n\n return null;\n };\n\n return (\n <BaseBox position=\"relative\">\n <BaseInput\n id=\"searchinput\"\n componentName={MetaConstants.SearchInput}\n ref={mergedRef}\n isDropdownTrigger={true}\n setInputWrapperRef={\n isInsideDropdown\n ? (wrapperNode) => {\n triggererWrapperRef.current = wrapperNode;\n }\n : undefined\n }\n label={label as string}\n accessibilityLabel={accessibilityLabel}\n hideLabelText={!Boolean(label)}\n labelPosition={labelPosition}\n placeholder={placeholder}\n defaultValue={defaultValue}\n value={value}\n name={name}\n onKeyDown={isInsideDropdown ? onTriggerKeydown : undefined}\n onChange={({ name, value }) => {\n if (value?.length) {\n // show the clear button when the user starts typing in\n setShouldShowClearButton(true);\n }\n\n if (shouldShowClearButton && !value?.length) {\n // hide the clear button when the input field is empty\n setShouldShowClearButton(false);\n }\n\n onChange?.({ name, value });\n }}\n onClick={(e) => {\n if (isDisabled) return;\n if (isInsideDropdown) {\n onTriggerClick();\n }\n onClick?.(e);\n }}\n onFocus={onFocus}\n onBlur={onBlur}\n onSubmit={onSubmit}\n isDisabled={isDisabled}\n leadingIcon={showSearchIcon ? SearchIcon : undefined}\n trailingInteractionElement={renderInteractionElement()}\n helpText={helpText}\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={autoFocus}\n testID={testID}\n {...getKeyboardAndAutocompleteProps({\n type: 'search',\n autoCapitalize,\n })}\n size={size}\n {...rest}\n />\n </BaseBox>\n );\n};\n\nconst SearchInput = assignWithoutSideEffects(React.forwardRef(_SearchInput), {\n displayName: 'SearchInput',\n componentId: dropdownComponentIds.triggers.SearchInput,\n});\n\nexport type { SearchInputProps };\nexport { SearchInput };\n"],"names":["isReactNative","_textInputRef","getPlatformType","_SearchInput","_ref","ref","label","accessibilityLabel","_ref$labelPosition","labelPosition","placeholder","defaultValue","name","value","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","helpText","onClearButtonClick","isLoading","autoCapitalize","autoFocus","testID","_ref$size","size","_ref$showSearchIcon","showSearchIcon","rest","_objectWithoutProperties","_excluded","textInputRef","React","useRef","mergedRef","useMergeRefs","_useState","useState","_useState2","_slicedToArray","shouldShowClearButton","setShouldShowClearButton","_useDropdown","useDropdown","triggererWrapperRef","onTriggerKeydown","onTriggerClick","dropdownTriggerer","isInsideDropdown","useEffect","Boolean","renderInteractionElement","_jsx","Spinner","color","IconButton","icon","CloseIcon","_textInputRef$current","isEmpty","current","clear","focus","HTMLInputElement","BaseBox","position","children","BaseInput","Object","assign","id","componentName","MetaConstants","SearchInput","isDropdownTrigger","setInputWrapperRef","wrapperNode","undefined","hideLabelText","onKeyDown","_ref2","length","e","leadingIcon","SearchIcon","trailingInteractionElement","getKeyboardAndAutocompleteProps","type","assignWithoutSideEffects","forwardRef","displayName","componentId","dropdownComponentIds","triggers"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SearchInput.js","sources":["../../../../../../src/components/Input/SearchInput/SearchInput.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport type { ReactElement, ReactNode } from 'react';\nimport type { TextInput as TextInputReactNative } from 'react-native';\nimport type { BaseInputProps } from '../BaseInput';\nimport { BaseInput } from '../BaseInput';\nimport { getKeyboardAndAutocompleteProps } from '../BaseInput/utils';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { CloseIcon, SearchIcon } from '~components/Icons';\nimport { IconButton } from '~components/Button/IconButton';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport BaseBox from '~components/Box/BaseBox';\nimport { Spinner } from '~components/Spinner';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getPlatformType } from '~utils';\nimport { useMergeRefs } from '~utils/useMergeRefs';\nimport type {\n BladeElementRef,\n BladeElementRefWithValue,\n DataAnalyticsAttribute,\n} from '~utils/types';\nimport { dropdownComponentIds } from '~components/Dropdown/dropdownComponentIds';\nimport { useDropdown } from '~components/Dropdown/useDropdown';\nimport { DropdownOverlay, InputDropdownButton } from '~components/Dropdown';\nimport { Divider } from '~components/Divider';\nimport { getComponentId } from '~utils/isValidAllowedChildren';\n\ntype SearchInputCommonProps = Pick<\n BaseInputProps,\n | 'label'\n | 'accessibilityLabel'\n | 'labelPosition'\n | 'helpText'\n | 'placeholder'\n | 'defaultValue'\n | 'name'\n | 'onChange'\n | 'onFocus'\n | 'onBlur'\n | 'value'\n | 'isDisabled'\n | 'autoFocus'\n | 'onSubmit'\n | 'autoCapitalize'\n | 'testID'\n | 'onClick'\n | 'size'\n | keyof DataAnalyticsAttribute\n> & {\n /**\n * Event handler to handle the onClick event for clear button.\n */\n onClearButtonClick?: () => void;\n\n /**\n * Decides whether to show a loading spinner for the input field.\n */\n isLoading?: boolean;\n /**\n * Toggle the visibility of the search icon.\n *\n * @default true\n */\n showSearchIcon?: boolean;\n /**\n * Optional trailing to be shown at the end of the input.\n */\n trailing?: React.ReactNode;\n} & StyledPropsBlade;\n\n/*\n Mandatory accessibilityLabel prop when label is not provided\n*/\ntype SearchInputPropsWithA11yLabel = {\n /**\n * Label to be shown for the input field\n */\n label?: undefined;\n /**\n * Accessibility label for the input\n */\n accessibilityLabel: string;\n};\n\n/*\n Optional accessibilityLabel prop when label is provided\n*/\ntype SearchInputPropsWithLabel = {\n /**\n * Label to be shown for the input field\n */\n label: string;\n /**\n * Accessibility label for the input\n */\n accessibilityLabel?: string;\n};\n\ntype SearchInputProps = (SearchInputPropsWithA11yLabel | SearchInputPropsWithLabel) &\n SearchInputCommonProps;\n\n// need to do this to tell TS to infer type as SearchInput of React Native and make it believe that `ref.current.clear()` exists\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst isReactNative = (_textInputRef?: any): _textInputRef is TextInputReactNative => {\n return getPlatformType() === 'react-native';\n};\n\nconst _SearchInput: React.ForwardRefRenderFunction<BladeElementRef, SearchInputProps> = (\n {\n label,\n accessibilityLabel,\n labelPosition = 'top',\n placeholder,\n defaultValue,\n name,\n value,\n onChange,\n onClick,\n onFocus,\n onBlur,\n onSubmit,\n isDisabled,\n helpText,\n onClearButtonClick,\n isLoading,\n autoCapitalize,\n autoFocus,\n testID,\n size = 'medium',\n showSearchIcon = true,\n trailing,\n ...rest\n },\n ref,\n): ReactElement => {\n const textInputRef = React.useRef<BladeElementRefWithValue>(null);\n const mergedRef = useMergeRefs(ref, textInputRef);\n const [shouldShowClearButton, setShouldShowClearButton] = useState(false);\n const [isTrailingDropDownOpen, setIsTrailingDropDownOpen] = useState(false);\n const {\n triggererWrapperRef,\n onTriggerKeydown,\n onTriggerClick,\n dropdownTriggerer,\n close: closeParentDropDown,\n isOpen: isParentDropDownOpen,\n } = useDropdown();\n const isInsideDropdown = dropdownTriggerer === 'SearchInput';\n\n React.useEffect(() => {\n setShouldShowClearButton(Boolean(defaultValue ?? value));\n }, [defaultValue, value]);\n\n useEffect(() => {\n if (isParentDropDownOpen && isTrailingDropDownOpen) {\n setIsTrailingDropDownOpen(false);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [closeParentDropDown, isParentDropDownOpen]);\n\n useEffect(() => {\n if (isTrailingDropDownOpen && isParentDropDownOpen) {\n closeParentDropDown();\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [setIsTrailingDropDownOpen, isTrailingDropDownOpen]);\n\n const trailingDropdown =\n trailing && getComponentId(trailing as React.ReactElement) === 'Dropdown' ? trailing : null;\n\n const renderTrailingDropDown = (): React.ReactElement | null => {\n if (!trailingDropdown) {\n return null;\n }\n return React.cloneElement(trailingDropdown as React.ReactElement, {\n selectionType: 'single',\n isOpen: isTrailingDropDownOpen,\n onOpenChange: (isOpen: boolean) => {\n setIsTrailingDropDownOpen(isOpen);\n },\n children: React.Children.map(\n (trailingDropdown as React.ReactElement).props.children,\n (child) => {\n if (child.type === InputDropdownButton) {\n return React.cloneElement(child, {\n _isInsideSearchInput: true,\n });\n }\n if (child.type === DropdownOverlay) {\n return React.cloneElement(child, {\n referenceRef: triggererWrapperRef,\n _isNestedDropdown: true,\n defaultPlacement: 'bottom-end',\n });\n }\n return child;\n },\n ),\n });\n };\n\n const renderClearButton = (): React.ReactElement => {\n return (\n <IconButton\n size=\"medium\"\n icon={CloseIcon}\n onClick={() => {\n if (isEmpty(value) && textInputRef.current) {\n // when the input field is uncontrolled take the ref and clear the input and then call the onClearButtonClick function\n if (isReactNative(textInputRef.current)) {\n textInputRef.current.clear();\n textInputRef.current.focus();\n } else if (textInputRef.current instanceof HTMLInputElement) {\n textInputRef.current.value = '';\n textInputRef.current.focus();\n }\n }\n\n // if the input field is controlled just call the click handler and the value change shall be left upto the consumer\n onClearButtonClick?.();\n textInputRef?.current?.focus();\n setShouldShowClearButton(false);\n }}\n isDisabled={isDisabled}\n accessibilityLabel=\"Clear Input Content\"\n />\n );\n };\n\n const renderInteractionElement = (): ReactNode => {\n if (isLoading) {\n return <Spinner accessibilityLabel=\"Loading Content\" color=\"primary\" />;\n }\n\n if (shouldShowClearButton && trailingDropdown) {\n return (\n <BaseBox display=\"flex\" gap=\"spacing.3\">\n {renderClearButton()} <Divider orientation=\"vertical\" />\n </BaseBox>\n );\n }\n if (shouldShowClearButton) {\n return renderClearButton();\n }\n\n return null;\n };\n\n return (\n <BaseBox position=\"relative\">\n <BaseInput\n id=\"searchinput\"\n componentName={MetaConstants.SearchInput}\n ref={mergedRef}\n isDropdownTrigger={true}\n setInputWrapperRef={\n isInsideDropdown || isTrailingDropDownOpen\n ? (wrapperNode) => {\n triggererWrapperRef.current = wrapperNode;\n }\n : undefined\n }\n label={label as string}\n accessibilityLabel={accessibilityLabel}\n hideLabelText={!Boolean(label)}\n labelPosition={labelPosition}\n placeholder={placeholder}\n defaultValue={defaultValue}\n value={value}\n name={name}\n onKeyDown={isInsideDropdown ? onTriggerKeydown : undefined}\n onChange={({ name, value }) => {\n if (value?.length) {\n // show the clear button when the user starts typing in\n setShouldShowClearButton(true);\n }\n\n if (shouldShowClearButton && !value?.length) {\n // hide the clear button when the input field is empty\n setShouldShowClearButton(false);\n }\n\n onChange?.({ name, value });\n }}\n onClick={(e) => {\n if (isDisabled) return;\n if (isInsideDropdown) {\n onTriggerClick();\n }\n onClick?.(e);\n }}\n onFocus={onFocus}\n onBlur={onBlur}\n onSubmit={onSubmit}\n isDisabled={isDisabled}\n leadingIcon={showSearchIcon ? SearchIcon : undefined}\n trailingInteractionElement={renderInteractionElement()}\n trailingDropDown={renderTrailingDropDown()}\n helpText={helpText}\n // eslint-disable-next-line jsx-a11y/no-autofocus\n autoFocus={autoFocus}\n testID={testID}\n {...getKeyboardAndAutocompleteProps({\n type: 'search',\n autoCapitalize,\n })}\n size={size}\n {...rest}\n />\n </BaseBox>\n );\n};\n\nconst SearchInput = assignWithoutSideEffects(React.forwardRef(_SearchInput), {\n displayName: 'SearchInput',\n componentId: dropdownComponentIds.triggers.SearchInput,\n});\n\nexport type { SearchInputProps };\nexport { SearchInput };\n"],"names":["isReactNative","_textInputRef","getPlatformType","_SearchInput","_ref","ref","label","accessibilityLabel","_ref$labelPosition","labelPosition","placeholder","defaultValue","name","value","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","helpText","onClearButtonClick","isLoading","autoCapitalize","autoFocus","testID","_ref$size","size","_ref$showSearchIcon","showSearchIcon","trailing","rest","_objectWithoutProperties","_excluded","textInputRef","React","useRef","mergedRef","useMergeRefs","_useState","useState","_useState2","_slicedToArray","shouldShowClearButton","setShouldShowClearButton","_useState3","_useState4","isTrailingDropDownOpen","setIsTrailingDropDownOpen","_useDropdown","useDropdown","triggererWrapperRef","onTriggerKeydown","onTriggerClick","dropdownTriggerer","closeParentDropDown","close","isParentDropDownOpen","isOpen","isInsideDropdown","useEffect","Boolean","trailingDropdown","getComponentId","renderTrailingDropDown","cloneElement","selectionType","onOpenChange","children","Children","map","props","child","type","InputDropdownButton","_isInsideSearchInput","DropdownOverlay","referenceRef","_isNestedDropdown","defaultPlacement","renderClearButton","_jsx","IconButton","icon","CloseIcon","_textInputRef$current","isEmpty","current","clear","focus","HTMLInputElement","renderInteractionElement","Spinner","color","_jsxs","BaseBox","display","gap","Divider","orientation","position","BaseInput","Object","assign","id","componentName","MetaConstants","SearchInput","isDropdownTrigger","setInputWrapperRef","wrapperNode","undefined","hideLabelText","onKeyDown","_ref2","length","e","leadingIcon","SearchIcon","trailingInteractionElement","trailingDropDown","getKeyboardAndAutocompleteProps","assignWithoutSideEffects","forwardRef","displayName","componentId","dropdownComponentIds","triggers"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
2
2
|
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
3
|
-
import React__default, { useState } from 'react';
|
|
3
|
+
import React__default, { useState, useRef, useEffect } from 'react';
|
|
4
4
|
import { BaseInput } from '../BaseInput/BaseInput.js';
|
|
5
5
|
import { getKeyboardAndAutocompleteProps } from '../BaseInput/utils.js';
|
|
6
6
|
import { useTaggedInput } from '../BaseInput/useTaggedInput.js';
|
|
@@ -8,7 +8,7 @@ import isEmpty from '../../../utils/lodashButBetter/isEmpty.js';
|
|
|
8
8
|
import 'react-native-svg';
|
|
9
9
|
import '@babel/runtime/helpers/defineProperty';
|
|
10
10
|
import { MetaConstants } from '../../../utils/metaAttribute/metaConstants.js';
|
|
11
|
-
import { jsx } from 'react/jsx-runtime';
|
|
11
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
12
12
|
import '../../Icons/_Svg/Svg/Svg.native.js';
|
|
13
13
|
import '../../../tokens/global/typography.js';
|
|
14
14
|
import '../../../tokens/global/motion.js';
|
|
@@ -27,8 +27,16 @@ import { Spinner } from '../../Spinner/Spinner/Spinner.js';
|
|
|
27
27
|
import { assignWithoutSideEffects } from '../../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
|
|
28
28
|
import { useMergeRefs } from '../../../utils/useMergeRefs.js';
|
|
29
29
|
import { hintMarginTop } from '../../Form/formTokens.js';
|
|
30
|
+
import { Divider } from '../../Divider/Divider.js';
|
|
31
|
+
import { getComponentId } from '../../../utils/isValidAllowedChildren/isValidAllowedChildren.js';
|
|
32
|
+
import '../../Dropdown/Dropdown.js';
|
|
33
|
+
import { DropdownOverlay } from '../../Dropdown/DropdownOverlay.native.js';
|
|
34
|
+
import '../../Dropdown/DropdownButton.js';
|
|
35
|
+
import '../../Dropdown/DropdownLink.js';
|
|
36
|
+
import '../../Dropdown/DropdownIconButton.js';
|
|
37
|
+
import '../../Dropdown/DropdownHeaderFooter.js';
|
|
30
38
|
|
|
31
|
-
var _excluded=["label","accessibilityLabel","labelPosition","placeholder","type","defaultValue","name","value","maxCharacters","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","icon","prefix","showClearButton","onClearButtonClick","isLoading","suffix","autoFocus","keyboardReturnKeyType","autoCompleteSuggestionType","autoCapitalize","testID","size","leadingIcon","trailingIcon","isTaggedInput","tags","onTagChange"];var isReactNative=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var _TextInput=function _TextInput(_ref,ref){var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,placeholder=_ref.placeholder,_ref$type=_ref.type,type=_ref$type===void 0?'text':_ref$type,defaultValue=_ref.defaultValue,name=_ref.name,value=_ref.value,maxCharacters=_ref.maxCharacters,_onChange=_ref.onChange,onClick=_ref.onClick,_onFocus=_ref.onFocus,_onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,isDisabled=_ref.isDisabled,necessityIndicator=_ref.necessityIndicator,validationState=_ref.validationState,errorText=_ref.errorText,helpText=_ref.helpText,successText=_ref.successText,isRequired=_ref.isRequired,icon=_ref.icon,prefix=_ref.prefix,showClearButton=_ref.showClearButton,onClearButtonClick=_ref.onClearButtonClick,isLoading=_ref.isLoading,suffix=_ref.suffix,autoFocus=_ref.autoFocus,keyboardReturnKeyType=_ref.keyboardReturnKeyType,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType,autoCapitalize=_ref.autoCapitalize,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,leadingIcon=_ref.leadingIcon,trailingIcon=_ref.trailingIcon,isTaggedInput=_ref.isTaggedInput,tags=_ref.tags,onTagChange=_ref.onTagChange,rest=_objectWithoutProperties(_ref,_excluded);var textInputRef=React__default.useRef(null);var mergedRef=useMergeRefs(ref,textInputRef);var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldShowClearButton=_useState2[0],setShouldShowClearButton=_useState2[1];var _useState3=useState(autoFocus!=null?autoFocus:false),_useState4=_slicedToArray(_useState3,2),isInputFocussed=_useState4[0],setIsInputFocussed=_useState4[1];var _useTaggedInput=useTaggedInput({isTaggedInput:isTaggedInput,tags:tags,onTagChange:onTagChange,isDisabled:isDisabled,onChange:_onChange,name:name,value:value,inputRef:textInputRef}),activeTagIndex=_useTaggedInput.activeTagIndex,setActiveTagIndex=_useTaggedInput.setActiveTagIndex,getTags=_useTaggedInput.getTags,handleTaggedInputKeydown=_useTaggedInput.handleTaggedInputKeydown,handleTaggedInputChange=_useTaggedInput.handleTaggedInputChange,handleTagsClear=_useTaggedInput.handleTagsClear;React__default.useEffect(function(){
|
|
39
|
+
var _excluded=["label","accessibilityLabel","labelPosition","placeholder","type","defaultValue","name","value","maxCharacters","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","icon","prefix","showClearButton","onClearButtonClick","isLoading","suffix","autoFocus","keyboardReturnKeyType","autoCompleteSuggestionType","autoCapitalize","testID","size","leadingIcon","trailingIcon","isTaggedInput","tags","onTagChange","trailing","leading"];var isReactNative=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var _TextInput=function _TextInput(_ref,ref){var _leading$name,_trailing$name,_ref3;var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,placeholder=_ref.placeholder,_ref$type=_ref.type,type=_ref$type===void 0?'text':_ref$type,defaultValue=_ref.defaultValue,name=_ref.name,value=_ref.value,maxCharacters=_ref.maxCharacters,_onChange=_ref.onChange,onClick=_ref.onClick,_onFocus=_ref.onFocus,_onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,isDisabled=_ref.isDisabled,necessityIndicator=_ref.necessityIndicator,validationState=_ref.validationState,errorText=_ref.errorText,helpText=_ref.helpText,successText=_ref.successText,isRequired=_ref.isRequired,icon=_ref.icon,prefix=_ref.prefix,showClearButton=_ref.showClearButton,onClearButtonClick=_ref.onClearButtonClick,isLoading=_ref.isLoading,suffix=_ref.suffix,autoFocus=_ref.autoFocus,keyboardReturnKeyType=_ref.keyboardReturnKeyType,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType,autoCapitalize=_ref.autoCapitalize,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,leadingIcon=_ref.leadingIcon,trailingIcon=_ref.trailingIcon,isTaggedInput=_ref.isTaggedInput,tags=_ref.tags,onTagChange=_ref.onTagChange,trailing=_ref.trailing,leading=_ref.leading,rest=_objectWithoutProperties(_ref,_excluded);var textInputRef=React__default.useRef(null);var mergedRef=useMergeRefs(ref,textInputRef);var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldShowClearButton=_useState2[0],setShouldShowClearButton=_useState2[1];var _useState3=useState(autoFocus!=null?autoFocus:false),_useState4=_slicedToArray(_useState3,2),isInputFocussed=_useState4[0],setIsInputFocussed=_useState4[1];var _useTaggedInput=useTaggedInput({isTaggedInput:isTaggedInput,tags:tags,onTagChange:onTagChange,isDisabled:isDisabled,onChange:_onChange,name:name,value:value,inputRef:textInputRef}),activeTagIndex=_useTaggedInput.activeTagIndex,setActiveTagIndex=_useTaggedInput.setActiveTagIndex,getTags=_useTaggedInput.getTags,handleTaggedInputKeydown=_useTaggedInput.handleTaggedInputKeydown,handleTaggedInputChange=_useTaggedInput.handleTaggedInputChange,handleTagsClear=_useTaggedInput.handleTagsClear;var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isTrailingDropDownOpen=_React$useState2[0],setIsTrailingDropDownOpen=_React$useState2[1];var _React$useState3=React__default.useState(false),_React$useState4=_slicedToArray(_React$useState3,2),isLeadingDropDownOpen=_React$useState4[0],setIsLeadingDropDownOpen=_React$useState4[1];var textInputWrapperRef=useRef(null);useEffect(function(){if(isTrailingDropDownOpen&&isLeadingDropDownOpen){setIsLeadingDropDownOpen(false);}},[isTrailingDropDownOpen]);useEffect(function(){if(isLeadingDropDownOpen&&isTrailingDropDownOpen){setIsTrailingDropDownOpen(false);}},[isLeadingDropDownOpen]);var leadingDropDown=leading&&getComponentId(leading)==='Dropdown'?leading:null;var trailingDropdown=trailing&&getComponentId(trailing)==='Dropdown'?trailing:null;var _leadingIcon=leading&&typeof leading==='function'&&(_leading$name=leading.name)!=null&&_leading$name.endsWith('Icon')?leading:undefined;var _trailingIcon=trailing&&typeof trailing==='function'&&(_trailing$name=trailing.name)!=null&&_trailing$name.endsWith('Icon')?trailing:undefined;var hasLeadingInteractionElement=!_leadingIcon&&!leadingDropDown&&leading;var hasTrailingInteractionElement=!_trailingIcon&&!trailingDropdown&&trailing;var renderDropdown=function renderDropdown(dropdown,isOpen,setIsOpen,defaultPlacement){if(!dropdown){return null;}return React__default.cloneElement(dropdown,{selectionType:'single',isOpen:isOpen,onOpenChange:function onOpenChange(isOpen){setIsOpen(isOpen);},children:React__default.Children.map(dropdown.props.children,function(child){if(child.type===DropdownOverlay){return React__default.cloneElement(child,{referenceRef:textInputWrapperRef,_isNestedDropdown:true,defaultPlacement:defaultPlacement});}return child;})});};var renderLeadingDropDown=renderDropdown(leadingDropDown,isLeadingDropDownOpen,setIsLeadingDropDownOpen,'bottom-start');var renderTrailingDropDown=renderDropdown(trailingDropdown,isTrailingDropDownOpen,setIsTrailingDropDownOpen,'bottom-end');React__default.useEffect(function(){setShouldShowClearButton(Boolean(showClearButton&&(defaultValue!=null?defaultValue:value)));},[showClearButton,defaultValue,value]);var renderClearButton=function renderClearButton(){return jsx(IconButton,{size:"medium",icon:CloseIcon,onClick:function onClick(){var _textInputRef$current;if(isEmpty(value)&&textInputRef.current){if(isReactNative(textInputRef.current)){textInputRef.current.clear();textInputRef.current.focus();}else if(textInputRef.current instanceof HTMLInputElement){textInputRef.current.value='';textInputRef.current.focus();}}handleTagsClear();onClearButtonClick==null?void 0:onClearButtonClick();textInputRef==null?void 0:(_textInputRef$current=textInputRef.current)==null?void 0:_textInputRef$current.focus();setShouldShowClearButton(false);},isDisabled:isDisabled,accessibilityLabel:"Clear Input Content"});};var hasTrailingDropDown=Boolean(trailingDropdown);var renderInteractionElement=function renderInteractionElement(){if(isLoading){return jsx(Spinner,{accessibilityLabel:"Loading Content",color:"primary"});}if(shouldShowClearButton&&hasTrailingDropDown){return jsxs(BaseBox,{display:"flex",gap:"spacing.3",children:[renderClearButton()," ",jsx(Divider,{orientation:"vertical"})]});}if(showClearButton&&hasTrailingInteractionElement){return jsxs(BaseBox,{display:"flex",gap:"spacing.3",children:[renderClearButton()," ",jsx(Divider,{orientation:"vertical"})," ",trailing]});}if(shouldShowClearButton){return renderClearButton();}if(hasTrailingInteractionElement){return trailing;}return null;};return jsx(BaseInput,Object.assign({id:"textinput",componentName:MetaConstants.TextInput,ref:mergedRef,setInputWrapperRef:function setInputWrapperRef(wrapperNode){textInputWrapperRef.current=wrapperNode;},label:label,accessibilityLabel:accessibilityLabel,hideLabelText:!Boolean(label),labelPosition:labelPosition,placeholder:placeholder,defaultValue:defaultValue,value:value,name:name,maxCharacters:maxCharacters,isDropdownTrigger:isTaggedInput,tags:isTaggedInput?getTags({size:size}):undefined,showAllTags:isInputFocussed,maxTagRows:"single",activeTagIndex:activeTagIndex,setActiveTagIndex:setActiveTagIndex,leadingDropDown:renderLeadingDropDown,trailingDropDown:renderTrailingDropDown,leadingInteractionElement:hasLeadingInteractionElement?leading:null,onChange:function onChange(_ref2){var name=_ref2.name,value=_ref2.value;if(showClearButton&&value!=null&&value.length){setShouldShowClearButton(true);}if(shouldShowClearButton&&!(value!=null&&value.length)){setShouldShowClearButton(false);}handleTaggedInputChange({name:name,value:value});_onChange==null?void 0:_onChange({name:name,value:value});},onClick:onClick,onFocus:function onFocus(e){setIsInputFocussed(true);_onFocus==null?void 0:_onFocus(e);},onBlur:function onBlur(e){setIsInputFocussed(false);_onBlur==null?void 0:_onBlur(e);},onKeyDown:function onKeyDown(e){handleTaggedInputKeydown(e);},onSubmit:onSubmit,isDisabled:isDisabled,necessityIndicator:necessityIndicator,isRequired:isRequired,leadingIcon:(_ref3=_leadingIcon!=null?_leadingIcon:leadingIcon)!=null?_ref3:icon,prefix:prefix,trailingInteractionElement:renderInteractionElement(),trailingIcon:_trailingIcon!=null?_trailingIcon:trailingIcon,suffix:suffix,validationState:validationState,errorText:errorText,helpText:helpText,successText:successText,trailingFooterSlot:function trailingFooterSlot(value){var _value$length;return maxCharacters?jsx(BaseBox,{marginTop:hintMarginTop[size],marginRight:"spacing.1",children:jsx(CharacterCounter,{currentCount:(_value$length=value==null?void 0:value.length)!=null?_value$length:0,maxCount:maxCharacters,size:size})}):null;},autoFocus:autoFocus,testID:testID},getKeyboardAndAutocompleteProps({type:type,keyboardReturnKeyType:keyboardReturnKeyType,autoCompleteSuggestionType:autoCompleteSuggestionType,autoCapitalize:autoCapitalize}),{size:size},rest));};var TextInput=assignWithoutSideEffects(React__default.forwardRef(_TextInput),{displayName:'TextInput'});
|
|
32
40
|
|
|
33
41
|
export { TextInput };
|
|
34
42
|
//# sourceMappingURL=TextInput.js.map
|