@razorpay/blade 12.38.0 → 12.40.0

package/build/lib/native/components/Input/OTPInput/OTPInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"OTPInput.js","sources":["../../../../../../src/components/Input/OTPInput/OTPInput.tsx"],"sourcesContent":["import React, { useEffect, useImperativeHandle, useState } from 'react';\nimport type { BaseInputProps } from '../BaseInput';\nimport { BaseInput } from '../BaseInput';\nimport { getHintType } from '../BaseInput/BaseInput';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport type { FormInputOnEvent } from '~components/Form';\nimport { FormHint, FormLabel } from '~components/Form';\nimport { useFormId } from '~components/Form/useFormId';\nimport type { FormInputOnKeyDownEvent } from '~components/Form/FormTypes';\nimport BaseBox from '~components/Box/BaseBox';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { getPlatformType } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { makeSize } from '~utils/makeSize';\nimport type { DataAnalyticsAttribute } from '~utils/types';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype FormInputOnEventWithIndex = ({\n  name,\n  value,\n  inputIndex,\n}: {\n  name?: string;\n  value?: string;\n  inputIndex: number;\n}) => void;\n\nexport type OTPInputCommonProps = Pick<\n  BaseInputProps,\n  | 'label'\n  | 'accessibilityLabel'\n  | 'labelPosition'\n  | 'validationState'\n  | 'helpText'\n  | 'errorText'\n  | 'successText'\n  | 'name'\n  | 'onChange'\n  | 'value'\n  | 'isDisabled'\n  | 'autoFocus'\n  | 'keyboardReturnKeyType'\n  | 'keyboardType'\n  | 'placeholder'\n  | 'testID'\n  | 'size'\n  | keyof DataAnalyticsAttribute\n> & {\n  /**\n   * Determines the number of input fields to show for the OTP\n   * @default 6\n   */\n  otpLength?: 4 | 6;\n  /**\n   * The callback function to be invoked when all the values of the OTPInput are filled\n   */\n  onOTPFilled?: FormInputOnEvent;\n  /**\n   * Masks input characters in all the fields\n   */\n  isMasked?: boolean;\n  /**\n   * Determines what autoComplete suggestion type to show. Defaults to `oneTimeCode`.\n   *\n   * It's not recommended to turn this off in favor of otp input practices.\n   *\n   *\n   * Internally it'll render platform specific attributes:\n   *\n   * - web: `autocomplete`\n   * - iOS: `textContentType`\n   * - android: `autoComplete`\n   *\n   */\n  autoCompleteSuggestionType?: Extract<\n    BaseInputProps['autoCompleteSuggestionType'],\n    'none' | 'oneTimeCode'\n  >;\n  /**\n   * The callback function to be invoked when one of the input fields gets focus\n   */\n  onFocus?: FormInputOnEventWithIndex;\n  /**\n   * The callback function to be invoked when one of the input fields is blurred\n   */\n  onBlur?: FormInputOnEventWithIndex;\n} & StyledPropsBlade;\n\n/*\n  Mandatory accessibilityLabel prop when label is not provided\n*/\ntype OTPInputPropsWithA11yLabel = {\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 OTPInputPropsWithLabel = {\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 OTPInputProps = (OTPInputPropsWithA11yLabel | OTPInputPropsWithLabel) & OTPInputCommonProps;\n\nconst isReactNative = getPlatformType() === 'react-native';\n\n/**\n *  Converts a string value of otp to array if passed otherwise returns an array of 6 empty strings\n */\nconst otpToArray = (code?: string): string[] => code?.split('') ?? Array(6).fill('');\n\n/**\n * OTPInput component can be used for accepting OTPs sent to users for authentication/verification purposes.\n *\n * ## Usage\n *\n * ```tsx\n *   <OTPInput\n *     label=\"Enter OTP\"\n *     name=\"otpInput\"\n *     onChange={({ name, value }): void => console.log({ name, value })}\n *     onOTPFilled={({ name, value }): void => console.log({ name, value })}\n *   />\n * ```\n */\nconst _OTPInput: React.ForwardRefRenderFunction<HTMLInputElement[], OTPInputProps> = (\n  {\n    autoFocus,\n    errorText,\n    helpText,\n    isDisabled,\n    keyboardReturnKeyType,\n    keyboardType = 'decimal',\n    label,\n    accessibilityLabel,\n    labelPosition,\n    name,\n    onChange,\n    onFocus,\n    onBlur,\n    onOTPFilled,\n    otpLength = 6,\n    placeholder,\n    successText,\n    validationState,\n    value: inputValue,\n    isMasked,\n    autoCompleteSuggestionType = 'oneTimeCode',\n    testID,\n    size = 'medium',\n    ...rest\n  },\n  incomingRef,\n) => {\n  const inputRefs: React.RefObject<HTMLInputElement>[] = [];\n  const [otpValue, setOtpValue] = useState<string[]>(otpToArray(inputValue));\n  const [inputType, setInputType] = useState<('password' | undefined)[]>([]);\n  const isLabelLeftPositioned = labelPosition === 'left';\n  const { inputId, helpTextId, errorTextId, successTextId } = useFormId('otp');\n\n  useImperativeHandle(\n    incomingRef,\n    () => {\n      return inputRefs.map((ref) => ref.current!);\n    },\n    [inputRefs],\n  );\n\n  useEffect(() => {\n    // Effect for calling `onOTPFilled` callback\n    if (inputValue && inputValue.length >= otpLength) {\n      // callback for when the OTPInput is controlled and inputValue reaches the same or greater length as the otpLength\n      onOTPFilled?.({ value: inputValue.slice(0, otpLength), name });\n    } else if (!inputValue && otpValue.join('').length >= otpLength) {\n      // callback for when the OTPInput is uncontrolled and otpValue stored in state reaches the same or greater length as the otpLength\n      onOTPFilled?.({ value: otpValue.slice(0, otpLength).join(''), name });\n    }\n  }, [otpValue, otpLength, name, inputValue, onOTPFilled]);\n\n  useEffect(() => {\n    /* We want to disable the password managers for OTPInput when isMasked is set.\n       The issue with only setting autocomplete='off' is that its not an enforcement but a suggestion to the browser to follow.\n       This workaround unsets type on first render and sets it to `password` only once a value is entered by the user.\n    */\n    otpValue.forEach((otp, index) => {\n      // Set inputType as 'password' only when a value is entered when isMasked is set\n      if (!isEmpty(otp) && !inputType[index] && isMasked) {\n        const newInputType = Array.from(inputType);\n        newInputType[index] = 'password';\n        setInputType(newInputType);\n      }\n      // Cleanup the inputType array whenever the value is empty but inputType[index] is set\n      if (isEmpty(otp) && inputType[index]) {\n        const newInputType = Array.from(inputType);\n        newInputType[index] = undefined;\n        setInputType(newInputType);\n      }\n    });\n  }, [otpValue, inputType, isMasked]);\n\n  /**\n   * Changes the value of the otp at a given index and updates the otpValue stored in state\n   *\n   * @param {{ value: string; index: number }} { value, index }\n   * @returns {string} updated otpValue\n   */\n  const setOtpValueByIndex = ({ value, index }: { value: string; index: number }): string => {\n    const newOtpValue = Array.from(otpValue);\n    newOtpValue[index] = value;\n    setOtpValue(newOtpValue);\n    return newOtpValue.join('');\n  };\n\n  /**\n   * Sets focus to the desired otp input by index\n   *\n   * @param {number} index the index of the otp input to be focused\n   */\n  const focusOnOtpByIndex = (index: number): void => {\n    inputRefs[index]?.current?.focus();\n    if (!isReactNative) {\n      // React Native doesn't support imperatively selecting the value of input\n      inputRefs[index]?.current?.select();\n    }\n  };\n\n  const handleOnChange = ({\n    value,\n    currentOtpIndex,\n  }: {\n    value?: string;\n    currentOtpIndex: number;\n  }): void => {\n    if (value && value === ' ') {\n      // React native doesn't support `event.preventDefault()` hence have to add this check to ensure that empty space is not allowed\n      return;\n    }\n    if (inputValue && inputValue.length > 0) {\n      // When OTPInput is controlled, set the otpValue as the consumer passed `inputValue` and append the value on current index based on user's input.\n      // User's input will not reflect on the otp but will trigger `onChange` callback with the user's input appended so that the consumer can take appropriate action.\n      const newOtpValue = Array.from(inputValue);\n      newOtpValue[currentOtpIndex] = value ?? '';\n      setOtpValue(newOtpValue);\n      onChange?.({ name, value: newOtpValue.join('') });\n    } else if (value && value.trim().length > 1) {\n      // When the entered value is more that 1 character (when value is pasted), set the otpValue to the newly received value.\n      // Could have used `onPaste` for web to achieve this but 1. React Native doesn't support onPaste and 2. Safari's autofill on web doesn't trigger onPaste\n      setOtpValue(Array.from(value));\n      onChange?.({ name, value: value.trim().slice(0, otpLength) });\n    } else if (otpValue[currentOtpIndex] !== value?.trim()) {\n      // Set the value at the current index to the entered value\n      // only as long as its not the same as the already existing value (this prevents `onChange` being triggered unnecessarily)\n      const newValue = setOtpValueByIndex({\n        value: value?.trim() ?? '',\n        index: currentOtpIndex,\n      });\n      onChange?.({ name, value: newValue });\n    }\n  };\n\n  const handleOnInput = ({\n    value,\n    currentOtpIndex,\n  }: {\n    value?: string;\n    currentOtpIndex: number;\n  }): void => {\n    // Moves focus to next input whenever a value is entered in the current input\n    if (value && value.trim().length === 1) {\n      focusOnOtpByIndex(++currentOtpIndex);\n    }\n  };\n\n  const handleOnKeyDown = ({\n    key,\n    code,\n    event,\n    currentOtpIndex,\n  }: FormInputOnKeyDownEvent & { currentOtpIndex: number }): void => {\n    if (key === 'Backspace' || code === 'Backspace' || code === 'Delete' || key === 'Delete') {\n      event.preventDefault?.();\n      if (otpValue[currentOtpIndex]) {\n        // Clear the value at the current index if value exists\n        handleOnChange({ value: '', currentOtpIndex });\n      } else {\n        // Move focus to the previous input if the current input is empty\n        // and clear the value at the new active (previous) index\n        focusOnOtpByIndex(--currentOtpIndex);\n        handleOnChange({ value: '', currentOtpIndex });\n      }\n    } else if (key === 'ArrowLeft' || code === 'ArrowLeft') {\n      event.preventDefault?.();\n      focusOnOtpByIndex(--currentOtpIndex);\n    } else if (key === 'ArrowRight' || code === 'ArrowRight') {\n      event.preventDefault?.();\n      focusOnOtpByIndex(++currentOtpIndex);\n    } else if (key === ' ' || code === 'Space') {\n      event.preventDefault?.();\n    }\n  };\n\n  const getHiddenInput = (): React.ReactNode => {\n    if (!isReactNative) {\n      return (\n        <input\n          hidden={true}\n          id={inputId}\n          name={name}\n          value={inputValue ?? otpValue.join('') ?? ''}\n          readOnly\n        />\n      );\n    }\n    return null;\n  };\n\n  const getOTPInputFields = (): React.ReactNode => {\n    const inputs = [];\n    for (let index = 0; index < otpLength; index++) {\n      const currentValue = inputValue ? otpToArray(inputValue)[index] || '' : otpValue[index] || '';\n      const ref = React.createRef<HTMLInputElement>();\n      // if an inputValue is passed (controlled) and isMasked is set, inputType will always be password\n      let currentInputType: 'password' | undefined;\n      if (isMasked) {\n        // if inputValue is passed (controlled component) then the inputType will always be password\n        currentInputType = inputValue ? 'password' : inputType[index];\n      }\n      inputRefs.push(ref);\n      inputs.push(\n        <BaseBox\n          flex={1}\n          marginLeft={index == 0 ? 'spacing.0' : 'spacing.3'}\n          key={`${inputId}-${index}`}\n        >\n          <BaseInput\n            // eslint-disable-next-line jsx-a11y/no-autofocus\n            autoFocus={autoFocus && index === 0}\n            accessibilityLabel={`${index === 0 ? label || accessibilityLabel : ''} character ${\n              index + 1\n            }`}\n            label={label}\n            hideLabelText={true}\n            id={`${inputId}-${index}`}\n            textAlign=\"center\"\n            ref={ref as never}\n            name={name}\n            value={currentValue}\n            maxCharacters={otpValue[index]?.length > 0 ? 1 : undefined}\n            onChange={(formEvent) => handleOnChange({ ...formEvent, currentOtpIndex: index })}\n            onFocus={(formEvent) => onFocus?.({ ...formEvent, inputIndex: index })}\n            onBlur={(formEvent) => onBlur?.({ ...formEvent, inputIndex: index })}\n            onInput={(formEvent) => handleOnInput({ ...formEvent, currentOtpIndex: index })}\n            onKeyDown={(keyboardEvent) =>\n              handleOnKeyDown({ ...keyboardEvent, currentOtpIndex: index })\n            }\n            isDisabled={isDisabled}\n            placeholder={Array.from(placeholder ?? '')[index] ?? ''}\n            isRequired={true}\n            autoCompleteSuggestionType={autoCompleteSuggestionType}\n            keyboardType={keyboardType}\n            keyboardReturnKeyType={keyboardReturnKeyType}\n            validationState={validationState}\n            successText={successText}\n            errorText={errorText}\n            helpText={helpText}\n            hideFormHint={true}\n            type={currentInputType}\n            size={size}\n            valueComponentType=\"heading\"\n            {...makeAnalyticsAttribute(rest)}\n          />\n        </BaseBox>,\n      );\n    }\n    return inputs;\n  };\n\n  return (\n    <BaseBox {...metaAttribute({ name: MetaConstants.OTPInput, testID })} {...getStyledProps(rest)}>\n      <BaseBox\n        display=\"flex\"\n        flexDirection={isLabelLeftPositioned ? 'row' : 'column'}\n        alignItems={isLabelLeftPositioned ? 'center' : undefined}\n        position=\"relative\"\n      >\n        {Boolean(label) && (\n          <FormLabel as=\"label\" position={labelPosition} htmlFor={inputId} size={size}>\n            {label}\n          </FormLabel>\n        )}\n        <BaseBox display=\"flex\" flexDirection=\"row\">\n          {getHiddenInput()}\n          {getOTPInputFields()}\n        </BaseBox>\n      </BaseBox>\n      {/* the magic number 136 is basically max-width of label i.e 120 and then right margin i.e 16 which is the spacing between label and input field */}\n      {/*Refer `BaseInput`'s implementation of FormHint which uses similar logic */}\n      <BaseBox marginLeft={makeSize(isLabelLeftPositioned ? 136 : 0)}>\n        <FormHint\n          type={getHintType({ validationState, hasHelpText: Boolean(helpText) })}\n          helpText={helpText}\n          errorText={errorText}\n          successText={successText}\n          helpTextId={helpTextId}\n          errorTextId={errorTextId}\n          successTextId={successTextId}\n          size={size}\n        />\n      </BaseBox>\n    </BaseBox>\n  );\n};\n\nconst OTPInput = React.forwardRef<HTMLInputElement[], OTPInputProps>(_OTPInput);\n\nexport type { OTPInputProps };\nexport { OTPInput };\n"],"names":["isReactNative","getPlatformType","otpToArray","code","_code$split","split","Array","fill","_OTPInput","_ref","incomingRef","autoFocus","errorText","helpText","isDisabled","keyboardReturnKeyType","_ref$keyboardType","keyboardType","label","accessibilityLabel","labelPosition","name","onChange","onFocus","onBlur","onOTPFilled","_ref$otpLength","otpLength","placeholder","successText","validationState","inputValue","value","isMasked","_ref$autoCompleteSugg","autoCompleteSuggestionType","testID","_ref$size","size","rest","_objectWithoutProperties","_excluded","inputRefs","_useState","useState","_useState2","_slicedToArray","otpValue","setOtpValue","_useState3","_useState4","inputType","setInputType","isLabelLeftPositioned","_useFormId","useFormId","inputId","helpTextId","errorTextId","successTextId","useImperativeHandle","map","ref","current","useEffect","length","slice","join","forEach","otp","index","isEmpty","newInputType","from","undefined","setOtpValueByIndex","_ref2","newOtpValue","focusOnOtpByIndex","_inputRefs$index","_inputRefs$index$curr","focus","_inputRefs$index2","_inputRefs$index2$cur","select","handleOnChange","_ref3","currentOtpIndex","trim","_value$trim","newValue","handleOnInput","_ref4","handleOnKeyDown","_ref5","key","event","preventDefault","getHiddenInput","_ref6","_jsx","hidden","id","readOnly","getOTPInputFields","inputs","_loop","_otpValue$index","_Array$from$index","currentValue","React","createRef","currentInputType","push","BaseBox","flex","marginLeft","children","BaseInput","Object","assign","hideLabelText","textAlign","maxCharacters","formEvent","inputIndex","onInput","onKeyDown","keyboardEvent","isRequired","hideFormHint","type","valueComponentType","makeAnalyticsAttribute","_jsxs","metaAttribute","MetaConstants","OTPInput","getStyledProps","display","flexDirection","alignItems","position","Boolean","FormLabel","as","htmlFor","makeSize","FormHint","getHintType","hasHelpText","forwardRef"],"mappings":"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"}
+{"version":3,"file":"OTPInput.js","sources":["../../../../../../src/components/Input/OTPInput/OTPInput.tsx"],"sourcesContent":["import React, { useEffect, useImperativeHandle, useState } from 'react';\nimport type { BaseInputProps } from '../BaseInput';\nimport { BaseInput } from '../BaseInput';\nimport { getHintType } from '../BaseInput/BaseInput';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport type { FormInputOnEvent } from '~components/Form';\nimport { FormHint, FormLabel } from '~components/Form';\nimport { useFormId } from '~components/Form/useFormId';\nimport type { FormInputOnKeyDownEvent } from '~components/Form/FormTypes';\nimport BaseBox from '~components/Box/BaseBox';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { getPlatformType } from '~utils';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { makeSize } from '~utils/makeSize';\nimport type { DataAnalyticsAttribute } from '~utils/types';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\ntype FormInputOnEventWithIndex = ({\n  name,\n  value,\n  inputIndex,\n}: {\n  name?: string;\n  value?: string;\n  inputIndex: number;\n}) => void;\n\nexport type OTPInputCommonProps = Pick<\n  BaseInputProps,\n  | 'label'\n  | 'accessibilityLabel'\n  | 'labelPosition'\n  | 'labelSuffix'\n  | 'labelTrailing'\n  | 'validationState'\n  | 'helpText'\n  | 'errorText'\n  | 'successText'\n  | 'name'\n  | 'onChange'\n  | 'value'\n  | 'isDisabled'\n  | 'autoFocus'\n  | 'keyboardReturnKeyType'\n  | 'keyboardType'\n  | 'placeholder'\n  | 'testID'\n  | 'size'\n  | keyof DataAnalyticsAttribute\n> & {\n  /**\n   * Determines the number of input fields to show for the OTP\n   * @default 6\n   */\n  otpLength?: 4 | 6;\n  /**\n   * The callback function to be invoked when all the values of the OTPInput are filled\n   */\n  onOTPFilled?: FormInputOnEvent;\n  /**\n   * Masks input characters in all the fields\n   */\n  isMasked?: boolean;\n  /**\n   * Determines what autoComplete suggestion type to show. Defaults to `oneTimeCode`.\n   *\n   * It's not recommended to turn this off in favor of otp input practices.\n   *\n   *\n   * Internally it'll render platform specific attributes:\n   *\n   * - web: `autocomplete`\n   * - iOS: `textContentType`\n   * - android: `autoComplete`\n   *\n   */\n  autoCompleteSuggestionType?: Extract<\n    BaseInputProps['autoCompleteSuggestionType'],\n    'none' | 'oneTimeCode'\n  >;\n  /**\n   * The callback function to be invoked when one of the input fields gets focus\n   */\n  onFocus?: FormInputOnEventWithIndex;\n  /**\n   * The callback function to be invoked when one of the input fields is blurred\n   */\n  onBlur?: FormInputOnEventWithIndex;\n} & StyledPropsBlade;\n\n/*\n  Mandatory accessibilityLabel prop when label is not provided\n*/\ntype OTPInputPropsWithA11yLabel = {\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 OTPInputPropsWithLabel = {\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 OTPInputProps = (OTPInputPropsWithA11yLabel | OTPInputPropsWithLabel) & OTPInputCommonProps;\n\nconst isReactNative = getPlatformType() === 'react-native';\n\n/**\n *  Converts a string value of otp to array if passed otherwise returns an array of 6 empty strings\n */\nconst otpToArray = (code?: string): string[] => code?.split('') ?? Array(6).fill('');\n\n/**\n * OTPInput component can be used for accepting OTPs sent to users for authentication/verification purposes.\n *\n * ## Usage\n *\n * ```tsx\n *   <OTPInput\n *     label=\"Enter OTP\"\n *     name=\"otpInput\"\n *     onChange={({ name, value }): void => console.log({ name, value })}\n *     onOTPFilled={({ name, value }): void => console.log({ name, value })}\n *   />\n * ```\n */\nconst _OTPInput: React.ForwardRefRenderFunction<HTMLInputElement[], OTPInputProps> = (\n  {\n    autoFocus,\n    errorText,\n    helpText,\n    isDisabled,\n    keyboardReturnKeyType,\n    keyboardType = 'decimal',\n    label,\n    accessibilityLabel,\n    labelPosition,\n    labelSuffix,\n    labelTrailing,\n    name,\n    onChange,\n    onFocus,\n    onBlur,\n    onOTPFilled,\n    otpLength = 6,\n    placeholder,\n    successText,\n    validationState,\n    value: inputValue,\n    isMasked,\n    autoCompleteSuggestionType = 'oneTimeCode',\n    testID,\n    size = 'medium',\n    ...rest\n  },\n  incomingRef,\n) => {\n  const inputRefs: React.RefObject<HTMLInputElement>[] = [];\n  const [otpValue, setOtpValue] = useState<string[]>(otpToArray(inputValue));\n  const [inputType, setInputType] = useState<('password' | undefined)[]>([]);\n  const isLabelLeftPositioned = labelPosition === 'left';\n  const { inputId, helpTextId, errorTextId, successTextId } = useFormId('otp');\n\n  useImperativeHandle(\n    incomingRef,\n    () => {\n      return inputRefs.map((ref) => ref.current!);\n    },\n    [inputRefs],\n  );\n\n  useEffect(() => {\n    // Effect for calling `onOTPFilled` callback\n    if (inputValue && inputValue.length >= otpLength) {\n      // callback for when the OTPInput is controlled and inputValue reaches the same or greater length as the otpLength\n      onOTPFilled?.({ value: inputValue.slice(0, otpLength), name });\n    } else if (!inputValue && otpValue.join('').length >= otpLength) {\n      // callback for when the OTPInput is uncontrolled and otpValue stored in state reaches the same or greater length as the otpLength\n      onOTPFilled?.({ value: otpValue.slice(0, otpLength).join(''), name });\n    }\n  }, [otpValue, otpLength, name, inputValue, onOTPFilled]);\n\n  useEffect(() => {\n    /* We want to disable the password managers for OTPInput when isMasked is set.\n       The issue with only setting autocomplete='off' is that its not an enforcement but a suggestion to the browser to follow.\n       This workaround unsets type on first render and sets it to `password` only once a value is entered by the user.\n    */\n    otpValue.forEach((otp, index) => {\n      // Set inputType as 'password' only when a value is entered when isMasked is set\n      if (!isEmpty(otp) && !inputType[index] && isMasked) {\n        const newInputType = Array.from(inputType);\n        newInputType[index] = 'password';\n        setInputType(newInputType);\n      }\n      // Cleanup the inputType array whenever the value is empty but inputType[index] is set\n      if (isEmpty(otp) && inputType[index]) {\n        const newInputType = Array.from(inputType);\n        newInputType[index] = undefined;\n        setInputType(newInputType);\n      }\n    });\n  }, [otpValue, inputType, isMasked]);\n\n  /**\n   * Changes the value of the otp at a given index and updates the otpValue stored in state\n   *\n   * @param {{ value: string; index: number }} { value, index }\n   * @returns {string} updated otpValue\n   */\n  const setOtpValueByIndex = ({ value, index }: { value: string; index: number }): string => {\n    const newOtpValue = Array.from(otpValue);\n    newOtpValue[index] = value;\n    setOtpValue(newOtpValue);\n    return newOtpValue.join('');\n  };\n\n  /**\n   * Sets focus to the desired otp input by index\n   *\n   * @param {number} index the index of the otp input to be focused\n   */\n  const focusOnOtpByIndex = (index: number): void => {\n    inputRefs[index]?.current?.focus();\n    if (!isReactNative) {\n      // React Native doesn't support imperatively selecting the value of input\n      inputRefs[index]?.current?.select();\n    }\n  };\n\n  const handleOnChange = ({\n    value,\n    currentOtpIndex,\n  }: {\n    value?: string;\n    currentOtpIndex: number;\n  }): void => {\n    if (value && value === ' ') {\n      // React native doesn't support `event.preventDefault()` hence have to add this check to ensure that empty space is not allowed\n      return;\n    }\n    if (inputValue && inputValue.length > 0) {\n      // When OTPInput is controlled, set the otpValue as the consumer passed `inputValue` and append the value on current index based on user's input.\n      // User's input will not reflect on the otp but will trigger `onChange` callback with the user's input appended so that the consumer can take appropriate action.\n      const newOtpValue = Array.from(inputValue);\n      newOtpValue[currentOtpIndex] = value ?? '';\n      setOtpValue(newOtpValue);\n      onChange?.({ name, value: newOtpValue.join('') });\n    } else if (value && value.trim().length > 1) {\n      // When the entered value is more that 1 character (when value is pasted), set the otpValue to the newly received value.\n      // Could have used `onPaste` for web to achieve this but 1. React Native doesn't support onPaste and 2. Safari's autofill on web doesn't trigger onPaste\n      setOtpValue(Array.from(value));\n      onChange?.({ name, value: value.trim().slice(0, otpLength) });\n    } else if (otpValue[currentOtpIndex] !== value?.trim()) {\n      // Set the value at the current index to the entered value\n      // only as long as its not the same as the already existing value (this prevents `onChange` being triggered unnecessarily)\n      const newValue = setOtpValueByIndex({\n        value: value?.trim() ?? '',\n        index: currentOtpIndex,\n      });\n      onChange?.({ name, value: newValue });\n    }\n  };\n\n  const handleOnInput = ({\n    value,\n    currentOtpIndex,\n  }: {\n    value?: string;\n    currentOtpIndex: number;\n  }): void => {\n    // Moves focus to next input whenever a value is entered in the current input\n    if (value && value.trim().length === 1) {\n      focusOnOtpByIndex(++currentOtpIndex);\n    }\n  };\n\n  const handleOnKeyDown = ({\n    key,\n    code,\n    event,\n    currentOtpIndex,\n  }: FormInputOnKeyDownEvent & { currentOtpIndex: number }): void => {\n    if (key === 'Backspace' || code === 'Backspace' || code === 'Delete' || key === 'Delete') {\n      event.preventDefault?.();\n      if (otpValue[currentOtpIndex]) {\n        // Clear the value at the current index if value exists\n        handleOnChange({ value: '', currentOtpIndex });\n      } else {\n        // Move focus to the previous input if the current input is empty\n        // and clear the value at the new active (previous) index\n        focusOnOtpByIndex(--currentOtpIndex);\n        handleOnChange({ value: '', currentOtpIndex });\n      }\n    } else if (key === 'ArrowLeft' || code === 'ArrowLeft') {\n      event.preventDefault?.();\n      focusOnOtpByIndex(--currentOtpIndex);\n    } else if (key === 'ArrowRight' || code === 'ArrowRight') {\n      event.preventDefault?.();\n      focusOnOtpByIndex(++currentOtpIndex);\n    } else if (key === ' ' || code === 'Space') {\n      event.preventDefault?.();\n    }\n  };\n\n  const getHiddenInput = (): React.ReactNode => {\n    if (!isReactNative) {\n      return (\n        <input\n          hidden={true}\n          id={inputId}\n          name={name}\n          value={inputValue ?? otpValue.join('') ?? ''}\n          readOnly\n        />\n      );\n    }\n    return null;\n  };\n\n  const getOTPInputFields = (): React.ReactNode => {\n    const inputs = [];\n    for (let index = 0; index < otpLength; index++) {\n      const currentValue = inputValue ? otpToArray(inputValue)[index] || '' : otpValue[index] || '';\n      const ref = React.createRef<HTMLInputElement>();\n      // if an inputValue is passed (controlled) and isMasked is set, inputType will always be password\n      let currentInputType: 'password' | undefined;\n      if (isMasked) {\n        // if inputValue is passed (controlled component) then the inputType will always be password\n        currentInputType = inputValue ? 'password' : inputType[index];\n      }\n      inputRefs.push(ref);\n      inputs.push(\n        <BaseBox\n          flex={1}\n          marginLeft={index == 0 ? 'spacing.0' : 'spacing.3'}\n          key={`${inputId}-${index}`}\n        >\n          <BaseInput\n            // eslint-disable-next-line jsx-a11y/no-autofocus\n            autoFocus={autoFocus && index === 0}\n            accessibilityLabel={`${index === 0 ? label || accessibilityLabel : ''} character ${\n              index + 1\n            }`}\n            label={label}\n            hideLabelText={true}\n            id={`${inputId}-${index}`}\n            textAlign=\"center\"\n            ref={ref as never}\n            name={name}\n            value={currentValue}\n            maxCharacters={otpValue[index]?.length > 0 ? 1 : undefined}\n            onChange={(formEvent) => handleOnChange({ ...formEvent, currentOtpIndex: index })}\n            onFocus={(formEvent) => onFocus?.({ ...formEvent, inputIndex: index })}\n            onBlur={(formEvent) => onBlur?.({ ...formEvent, inputIndex: index })}\n            onInput={(formEvent) => handleOnInput({ ...formEvent, currentOtpIndex: index })}\n            onKeyDown={(keyboardEvent) =>\n              handleOnKeyDown({ ...keyboardEvent, currentOtpIndex: index })\n            }\n            isDisabled={isDisabled}\n            placeholder={Array.from(placeholder ?? '')[index] ?? ''}\n            isRequired={true}\n            autoCompleteSuggestionType={autoCompleteSuggestionType}\n            keyboardType={keyboardType}\n            keyboardReturnKeyType={keyboardReturnKeyType}\n            validationState={validationState}\n            successText={successText}\n            errorText={errorText}\n            helpText={helpText}\n            hideFormHint={true}\n            type={currentInputType}\n            size={size}\n            valueComponentType=\"heading\"\n            {...makeAnalyticsAttribute(rest)}\n          />\n        </BaseBox>,\n      );\n    }\n    return inputs;\n  };\n\n  return (\n    <BaseBox {...metaAttribute({ name: MetaConstants.OTPInput, testID })} {...getStyledProps(rest)}>\n      <BaseBox\n        display=\"flex\"\n        flexDirection={isLabelLeftPositioned ? 'row' : 'column'}\n        alignItems={isLabelLeftPositioned ? 'center' : undefined}\n        position=\"relative\"\n      >\n        {Boolean(label) && (\n          <FormLabel\n            as=\"label\"\n            position={labelPosition}\n            htmlFor={inputId}\n            size={size}\n            labelSuffix={labelSuffix}\n            labelTrailing={labelTrailing}\n          >\n            {label}\n          </FormLabel>\n        )}\n        <BaseBox display=\"flex\" flexDirection=\"row\">\n          {getHiddenInput()}\n          {getOTPInputFields()}\n        </BaseBox>\n      </BaseBox>\n      {/* the magic number 136 is basically max-width of label i.e 120 and then right margin i.e 16 which is the spacing between label and input field */}\n      {/*Refer `BaseInput`'s implementation of FormHint which uses similar logic */}\n      <BaseBox marginLeft={makeSize(isLabelLeftPositioned ? 136 : 0)}>\n        <FormHint\n          type={getHintType({ validationState, hasHelpText: Boolean(helpText) })}\n          helpText={helpText}\n          errorText={errorText}\n          successText={successText}\n          helpTextId={helpTextId}\n          errorTextId={errorTextId}\n          successTextId={successTextId}\n          size={size}\n        />\n      </BaseBox>\n    </BaseBox>\n  );\n};\n\nconst OTPInput = React.forwardRef<HTMLInputElement[], OTPInputProps>(_OTPInput);\n\nexport type { OTPInputProps };\nexport { OTPInput };\n"],"names":["isReactNative","getPlatformType","otpToArray","code","_code$split","split","Array","fill","_OTPInput","_ref","incomingRef","autoFocus","errorText","helpText","isDisabled","keyboardReturnKeyType","_ref$keyboardType","keyboardType","label","accessibilityLabel","labelPosition","labelSuffix","labelTrailing","name","onChange","onFocus","onBlur","onOTPFilled","_ref$otpLength","otpLength","placeholder","successText","validationState","inputValue","value","isMasked","_ref$autoCompleteSugg","autoCompleteSuggestionType","testID","_ref$size","size","rest","_objectWithoutProperties","_excluded","inputRefs","_useState","useState","_useState2","_slicedToArray","otpValue","setOtpValue","_useState3","_useState4","inputType","setInputType","isLabelLeftPositioned","_useFormId","useFormId","inputId","helpTextId","errorTextId","successTextId","useImperativeHandle","map","ref","current","useEffect","length","slice","join","forEach","otp","index","isEmpty","newInputType","from","undefined","setOtpValueByIndex","_ref2","newOtpValue","focusOnOtpByIndex","_inputRefs$index","_inputRefs$index$curr","focus","_inputRefs$index2","_inputRefs$index2$cur","select","handleOnChange","_ref3","currentOtpIndex","trim","_value$trim","newValue","handleOnInput","_ref4","handleOnKeyDown","_ref5","key","event","preventDefault","getHiddenInput","_ref6","_jsx","hidden","id","readOnly","getOTPInputFields","inputs","_loop","_otpValue$index","_Array$from$index","currentValue","React","createRef","currentInputType","push","BaseBox","flex","marginLeft","children","BaseInput","Object","assign","hideLabelText","textAlign","maxCharacters","formEvent","inputIndex","onInput","onKeyDown","keyboardEvent","isRequired","hideFormHint","type","valueComponentType","makeAnalyticsAttribute","_jsxs","metaAttribute","MetaConstants","OTPInput","getStyledProps","display","flexDirection","alignItems","position","Boolean","FormLabel","as","htmlFor","makeSize","FormHint","getHintType","hasHelpText","forwardRef"],"mappings":"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"}

package/build/lib/native/components/Input/PasswordInput/PasswordInput.js

@@ -22,7 +22,7 @@ import { CharacterCounter } from '../../Form/CharacterCounter/CharacterCounter.j
 import { IconButton } from '../../Button/IconButton/IconButton.js';
 import { assignWithoutSideEffects } from '../../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
 
-var _excluded=["label","accessibilityLabel","labelPosition","showRevealButton","maxCharacters","validationState","errorText","successText","helpText","isDisabled","defaultValue","placeholder","isRequired","necessityIndicator","value","onChange","onFocus","onBlur","onSubmit","name","autoFocus","keyboardReturnKeyType","autoCompleteSuggestionType","testID","size"];var _PasswordInput=function _PasswordInput(_ref,ref){var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,_ref$showRevealButton=_ref.showRevealButton,showRevealButton=_ref$showRevealButton===void 0?true:_ref$showRevealButton,maxCharacters=_ref.maxCharacters,validationState=_ref.validationState,errorText=_ref.errorText,successText=_ref.successText,helpText=_ref.helpText,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,defaultValue=_ref.defaultValue,placeholder=_ref.placeholder,_ref$isRequired=_ref.isRequired,isRequired=_ref$isRequired===void 0?false:_ref$isRequired,_ref$necessityIndicat=_ref.necessityIndicator,necessityIndicator=_ref$necessityIndicat===void 0?'none':_ref$necessityIndicat,value=_ref.value,onChange=_ref.onChange,onFocus=_ref.onFocus,onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,name=_ref.name,_ref$autoFocus=_ref.autoFocus,autoFocus=_ref$autoFocus===void 0?false:_ref$autoFocus,_ref$keyboardReturnKe=_ref.keyboardReturnKeyType,keyboardReturnKeyType=_ref$keyboardReturnKe===void 0?'done':_ref$keyboardReturnKe,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,rest=_objectWithoutProperties(_ref,_excluded);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isRevealed=_React$useState2[0],setIsRevealed=_React$useState2[1];var isEnabled=!isDisabled;var isRevealedAndEnabled=isRevealed&&isEnabled;var toggleIsRevealed=function toggleIsRevealed(){return setIsRevealed(function(revealed){return !revealed;});};var iconAccessibilityLabel=isRevealedAndEnabled?'Hide password':'Show password';var type=isRevealedAndEnabled?'text':'password';var revealButtonIcon=isRevealedAndEnabled?EyeOffIcon:EyeIcon;var revealButton=showRevealButton&&!isDisabled?jsx(IconButton,{size:"medium",icon:revealButtonIcon,onClick:toggleIsRevealed,accessibilityLabel:iconAccessibilityLabel}):null;var trailingFooterSlot=function trailingFooterSlot(value){var _value$length;return maxCharacters?jsx(BaseBox,{marginTop:"spacing.2",marginRight:"spacing.1",children:jsx(CharacterCounter,{currentCount:(_value$length=value==null?void 0:value.length)!=null?_value$length:0,maxCount:maxCharacters})}):null;};return jsx(BaseInput,Object.assign({ref:ref,componentName:MetaConstants.PasswordInput,id:"password-field",label:label,accessibilityLabel:accessibilityLabel,hideLabelText:!Boolean(label),labelPosition:labelPosition,type:type,trailingInteractionElement:revealButton,trailingFooterSlot:trailingFooterSlot,maxCharacters:maxCharacters,validationState:validationState,errorText:errorText,successText:successText,helpText:helpText,isDisabled:isDisabled,defaultValue:defaultValue,placeholder:placeholder,isRequired:isRequired,necessityIndicator:necessityIndicator,value:value,onChange:onChange,onBlur:onBlur,onSubmit:onSubmit,onFocus:onFocus,name:name,autoFocus:autoFocus,autoCompleteSuggestionType:autoCompleteSuggestionType,keyboardReturnKeyType:keyboardReturnKeyType,autoCapitalize:"none",testID:testID,size:size},rest));};var PasswordInput=assignWithoutSideEffects(React__default.forwardRef(_PasswordInput),{displayName:'PasswordInput'});
+var _excluded=["label","accessibilityLabel","labelPosition","showRevealButton","maxCharacters","validationState","errorText","successText","helpText","isDisabled","defaultValue","placeholder","isRequired","necessityIndicator","value","onChange","onFocus","onBlur","onSubmit","name","autoFocus","keyboardReturnKeyType","autoCompleteSuggestionType","testID","size","labelSuffix","labelTrailing"];var _PasswordInput=function _PasswordInput(_ref,ref){var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,_ref$showRevealButton=_ref.showRevealButton,showRevealButton=_ref$showRevealButton===void 0?true:_ref$showRevealButton,maxCharacters=_ref.maxCharacters,validationState=_ref.validationState,errorText=_ref.errorText,successText=_ref.successText,helpText=_ref.helpText,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,defaultValue=_ref.defaultValue,placeholder=_ref.placeholder,_ref$isRequired=_ref.isRequired,isRequired=_ref$isRequired===void 0?false:_ref$isRequired,_ref$necessityIndicat=_ref.necessityIndicator,necessityIndicator=_ref$necessityIndicat===void 0?'none':_ref$necessityIndicat,value=_ref.value,onChange=_ref.onChange,onFocus=_ref.onFocus,onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,name=_ref.name,_ref$autoFocus=_ref.autoFocus,autoFocus=_ref$autoFocus===void 0?false:_ref$autoFocus,_ref$keyboardReturnKe=_ref.keyboardReturnKeyType,keyboardReturnKeyType=_ref$keyboardReturnKe===void 0?'done':_ref$keyboardReturnKe,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,labelSuffix=_ref.labelSuffix,labelTrailing=_ref.labelTrailing,rest=_objectWithoutProperties(_ref,_excluded);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),isRevealed=_React$useState2[0],setIsRevealed=_React$useState2[1];var isEnabled=!isDisabled;var isRevealedAndEnabled=isRevealed&&isEnabled;var toggleIsRevealed=function toggleIsRevealed(){return setIsRevealed(function(revealed){return !revealed;});};var iconAccessibilityLabel=isRevealedAndEnabled?'Hide password':'Show password';var type=isRevealedAndEnabled?'text':'password';var revealButtonIcon=isRevealedAndEnabled?EyeOffIcon:EyeIcon;var revealButton=showRevealButton&&!isDisabled?jsx(IconButton,{size:"medium",icon:revealButtonIcon,onClick:toggleIsRevealed,accessibilityLabel:iconAccessibilityLabel}):null;var trailingFooterSlot=function trailingFooterSlot(value){var _value$length;return maxCharacters?jsx(BaseBox,{marginTop:"spacing.2",marginRight:"spacing.1",children:jsx(CharacterCounter,{currentCount:(_value$length=value==null?void 0:value.length)!=null?_value$length:0,maxCount:maxCharacters})}):null;};return jsx(BaseInput,Object.assign({ref:ref,componentName:MetaConstants.PasswordInput,id:"password-field",label:label,accessibilityLabel:accessibilityLabel,hideLabelText:!Boolean(label),labelPosition:labelPosition,type:type,labelSuffix:labelSuffix,labelTrailing:labelTrailing,trailingInteractionElement:revealButton,trailingFooterSlot:trailingFooterSlot,maxCharacters:maxCharacters,validationState:validationState,errorText:errorText,successText:successText,helpText:helpText,isDisabled:isDisabled,defaultValue:defaultValue,placeholder:placeholder,isRequired:isRequired,necessityIndicator:necessityIndicator,value:value,onChange:onChange,onBlur:onBlur,onSubmit:onSubmit,onFocus:onFocus,name:name,autoFocus:autoFocus,autoCompleteSuggestionType:autoCompleteSuggestionType,keyboardReturnKeyType:keyboardReturnKeyType,autoCapitalize:"none",testID:testID,size:size},rest));};var PasswordInput=assignWithoutSideEffects(React__default.forwardRef(_PasswordInput),{displayName:'PasswordInput'});
 
 export { PasswordInput };
 //# sourceMappingURL=PasswordInput.js.map

package/build/lib/native/components/Input/PasswordInput/PasswordInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"PasswordInput.js","sources":["../../../../../../src/components/Input/PasswordInput/PasswordInput.tsx"],"sourcesContent":["import React from 'react';\nimport type { BaseInputProps } from '../BaseInput';\nimport { BaseInput } from '../BaseInput';\nimport { EyeIcon, EyeOffIcon } from '~components/Icons';\nimport BaseBox from '~components/Box/BaseBox';\nimport { CharacterCounter } from '~components/Form/CharacterCounter';\nimport { IconButton } from '~components/Button/IconButton';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport type { DataAnalyticsAttribute, BladeElementRef } from '~utils/types';\n\ntype PasswordInputExtraProps = {\n  /**\n   * Shows a reveal button to toggle password visibility\n   *\n   * @default true\n   */\n  showRevealButton?: boolean;\n\n  /**\n   * Displays asterisk (`*`) when `isRequired` is enabled\n   *\n   * @default none\n   */\n  necessityIndicator?: Exclude<BaseInputProps['necessityIndicator'], 'optional'>;\n\n  /**\n   * Determines what autoComplete suggestion type to show. Defaults to using platform heuristics.\n   *\n   * It's not recommended to turn this off in favor of safe password practices.\n   * Providing `password` or `newPassword` is more informative to the platform for browser autofill or password managers.\n   *\n   * **Note**: Using `newPassword` on iOS has some [known issue](https://github.com/facebook/react-native/issues/21911) on React Native\n   *\n   * Internally it'll render platform specific attributes:\n   *\n   * - web: `autocomplete`\n   * - iOS: `textContentType`\n   * - android: `autoComplete`\n   *\n   */\n  autoCompleteSuggestionType?: Extract<\n    BaseInputProps['autoCompleteSuggestionType'],\n    'none' | 'password' | 'newPassword'\n  >;\n};\n\ntype PasswordInputCommonProps = Pick<\n  BaseInputProps,\n  | 'label'\n  | 'accessibilityLabel'\n  | 'labelPosition'\n  | 'maxCharacters'\n  | 'validationState'\n  | 'errorText'\n  | 'successText'\n  | 'helpText'\n  | 'isDisabled'\n  | 'defaultValue'\n  | 'placeholder'\n  | 'isRequired'\n  | 'value'\n  | 'onChange'\n  | 'onBlur'\n  | 'onSubmit'\n  | 'onFocus'\n  | 'name'\n  | 'autoFocus'\n  | 'keyboardReturnKeyType'\n  | 'autoCompleteSuggestionType'\n  | 'testID'\n  | 'size'\n  | keyof DataAnalyticsAttribute\n> &\n  PasswordInputExtraProps &\n  StyledPropsBlade;\n\n/*\n  Mandatory accessibilityLabel prop when label is not provided\n*/\ntype PasswordInputPropsWithA11yLabel = {\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 PasswordInputPropsWithLabel = {\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 PasswordInputProps = (PasswordInputPropsWithA11yLabel | PasswordInputPropsWithLabel) &\n  PasswordInputCommonProps;\n\nconst _PasswordInput: React.ForwardRefRenderFunction<BladeElementRef, PasswordInputProps> = (\n  {\n    label,\n    accessibilityLabel,\n    labelPosition = 'top',\n    showRevealButton = true,\n    maxCharacters,\n    validationState,\n    errorText,\n    successText,\n    helpText,\n    isDisabled = false,\n    defaultValue,\n    placeholder,\n    isRequired = false,\n    necessityIndicator = 'none',\n    value,\n    onChange,\n    onFocus,\n    onBlur,\n    onSubmit,\n    name,\n    autoFocus = false,\n    keyboardReturnKeyType = 'done',\n    autoCompleteSuggestionType,\n    testID,\n    size = 'medium',\n    ...rest\n  },\n  ref,\n) => {\n  const [isRevealed, setIsRevealed] = React.useState(false);\n  const isEnabled = !isDisabled;\n\n  // If input is disabled reveal button shouldn't be present and input should be masked\n  const isRevealedAndEnabled = isRevealed && isEnabled;\n\n  const toggleIsRevealed = (): void => setIsRevealed((revealed) => !revealed);\n  const iconAccessibilityLabel = isRevealedAndEnabled ? 'Hide password' : 'Show password';\n  const type = isRevealedAndEnabled ? 'text' : 'password';\n\n  const revealButtonIcon = isRevealedAndEnabled ? EyeOffIcon : EyeIcon;\n  const revealButton =\n    showRevealButton && !isDisabled ? (\n      <IconButton\n        size=\"medium\"\n        icon={revealButtonIcon}\n        onClick={toggleIsRevealed}\n        accessibilityLabel={iconAccessibilityLabel}\n      />\n    ) : null;\n\n  const trailingFooterSlot = (value?: string): React.ReactNode =>\n    maxCharacters ? (\n      <BaseBox marginTop=\"spacing.2\" marginRight=\"spacing.1\">\n        <CharacterCounter currentCount={value?.length ?? 0} maxCount={maxCharacters} />\n      </BaseBox>\n    ) : null;\n\n  return (\n    <BaseInput\n      ref={ref}\n      componentName={MetaConstants.PasswordInput}\n      id=\"password-field\"\n      label={label as string}\n      accessibilityLabel={accessibilityLabel}\n      hideLabelText={!Boolean(label)}\n      labelPosition={labelPosition}\n      type={type}\n      trailingInteractionElement={revealButton}\n      trailingFooterSlot={trailingFooterSlot}\n      maxCharacters={maxCharacters}\n      validationState={validationState}\n      errorText={errorText}\n      successText={successText}\n      helpText={helpText}\n      isDisabled={isDisabled}\n      defaultValue={defaultValue}\n      placeholder={placeholder}\n      isRequired={isRequired}\n      necessityIndicator={necessityIndicator}\n      value={value}\n      onChange={onChange}\n      onBlur={onBlur}\n      onSubmit={onSubmit}\n      onFocus={onFocus}\n      name={name}\n      // eslint-disable-next-line jsx-a11y/no-autofocus\n      autoFocus={autoFocus}\n      autoCompleteSuggestionType={autoCompleteSuggestionType}\n      keyboardReturnKeyType={keyboardReturnKeyType}\n      autoCapitalize=\"none\"\n      testID={testID}\n      size={size}\n      {...rest}\n    />\n  );\n};\n\n// nosemgrep\nconst PasswordInput = assignWithoutSideEffects(React.forwardRef(_PasswordInput), {\n  displayName: 'PasswordInput',\n});\n\nexport type { PasswordInputProps };\nexport { PasswordInput };\n"],"names":["_PasswordInput","_ref","ref","label","accessibilityLabel","_ref$labelPosition","labelPosition","_ref$showRevealButton","showRevealButton","maxCharacters","validationState","errorText","successText","helpText","_ref$isDisabled","isDisabled","defaultValue","placeholder","_ref$isRequired","isRequired","_ref$necessityIndicat","necessityIndicator","value","onChange","onFocus","onBlur","onSubmit","name","_ref$autoFocus","autoFocus","_ref$keyboardReturnKe","keyboardReturnKeyType","autoCompleteSuggestionType","testID","_ref$size","size","rest","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","isRevealed","setIsRevealed","isEnabled","isRevealedAndEnabled","toggleIsRevealed","revealed","iconAccessibilityLabel","type","revealButtonIcon","EyeOffIcon","EyeIcon","revealButton","_jsx","IconButton","icon","onClick","trailingFooterSlot","_value$length","BaseBox","marginTop","marginRight","children","CharacterCounter","currentCount","length","maxCount","BaseInput","Object","assign","componentName","MetaConstants","PasswordInput","id","hideLabelText","Boolean","trailingInteractionElement","autoCapitalize","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}
+{"version":3,"file":"PasswordInput.js","sources":["../../../../../../src/components/Input/PasswordInput/PasswordInput.tsx"],"sourcesContent":["import React from 'react';\nimport type { BaseInputProps } from '../BaseInput';\nimport { BaseInput } from '../BaseInput';\nimport { EyeIcon, EyeOffIcon } from '~components/Icons';\nimport BaseBox from '~components/Box/BaseBox';\nimport { CharacterCounter } from '~components/Form/CharacterCounter';\nimport { IconButton } from '~components/Button/IconButton';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport type { DataAnalyticsAttribute, BladeElementRef } from '~utils/types';\n\ntype PasswordInputExtraProps = {\n  /**\n   * Shows a reveal button to toggle password visibility\n   *\n   * @default true\n   */\n  showRevealButton?: boolean;\n\n  /**\n   * Displays asterisk (`*`) when `isRequired` is enabled\n   *\n   * @default none\n   */\n  necessityIndicator?: Exclude<BaseInputProps['necessityIndicator'], 'optional'>;\n\n  /**\n   * Determines what autoComplete suggestion type to show. Defaults to using platform heuristics.\n   *\n   * It's not recommended to turn this off in favor of safe password practices.\n   * Providing `password` or `newPassword` is more informative to the platform for browser autofill or password managers.\n   *\n   * **Note**: Using `newPassword` on iOS has some [known issue](https://github.com/facebook/react-native/issues/21911) on React Native\n   *\n   * Internally it'll render platform specific attributes:\n   *\n   * - web: `autocomplete`\n   * - iOS: `textContentType`\n   * - android: `autoComplete`\n   *\n   */\n  autoCompleteSuggestionType?: Extract<\n    BaseInputProps['autoCompleteSuggestionType'],\n    'none' | 'password' | 'newPassword'\n  >;\n};\n\ntype PasswordInputCommonProps = Pick<\n  BaseInputProps,\n  | 'label'\n  | 'accessibilityLabel'\n  | 'labelPosition'\n  | 'labelSuffix'\n  | 'labelTrailing'\n  | 'maxCharacters'\n  | 'validationState'\n  | 'errorText'\n  | 'successText'\n  | 'helpText'\n  | 'isDisabled'\n  | 'defaultValue'\n  | 'placeholder'\n  | 'isRequired'\n  | 'value'\n  | 'onChange'\n  | 'onBlur'\n  | 'onSubmit'\n  | 'onFocus'\n  | 'name'\n  | 'autoFocus'\n  | 'keyboardReturnKeyType'\n  | 'autoCompleteSuggestionType'\n  | 'testID'\n  | 'size'\n  | keyof DataAnalyticsAttribute\n> &\n  PasswordInputExtraProps &\n  StyledPropsBlade;\n\n/*\n  Mandatory accessibilityLabel prop when label is not provided\n*/\ntype PasswordInputPropsWithA11yLabel = {\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 PasswordInputPropsWithLabel = {\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 PasswordInputProps = (PasswordInputPropsWithA11yLabel | PasswordInputPropsWithLabel) &\n  PasswordInputCommonProps;\n\nconst _PasswordInput: React.ForwardRefRenderFunction<BladeElementRef, PasswordInputProps> = (\n  {\n    label,\n    accessibilityLabel,\n    labelPosition = 'top',\n    showRevealButton = true,\n    maxCharacters,\n    validationState,\n    errorText,\n    successText,\n    helpText,\n    isDisabled = false,\n    defaultValue,\n    placeholder,\n    isRequired = false,\n    necessityIndicator = 'none',\n    value,\n    onChange,\n    onFocus,\n    onBlur,\n    onSubmit,\n    name,\n    autoFocus = false,\n    keyboardReturnKeyType = 'done',\n    autoCompleteSuggestionType,\n    testID,\n    size = 'medium',\n    labelSuffix,\n    labelTrailing,\n    ...rest\n  },\n  ref,\n) => {\n  const [isRevealed, setIsRevealed] = React.useState(false);\n  const isEnabled = !isDisabled;\n\n  // If input is disabled reveal button shouldn't be present and input should be masked\n  const isRevealedAndEnabled = isRevealed && isEnabled;\n\n  const toggleIsRevealed = (): void => setIsRevealed((revealed) => !revealed);\n  const iconAccessibilityLabel = isRevealedAndEnabled ? 'Hide password' : 'Show password';\n  const type = isRevealedAndEnabled ? 'text' : 'password';\n\n  const revealButtonIcon = isRevealedAndEnabled ? EyeOffIcon : EyeIcon;\n  const revealButton =\n    showRevealButton && !isDisabled ? (\n      <IconButton\n        size=\"medium\"\n        icon={revealButtonIcon}\n        onClick={toggleIsRevealed}\n        accessibilityLabel={iconAccessibilityLabel}\n      />\n    ) : null;\n\n  const trailingFooterSlot = (value?: string): React.ReactNode =>\n    maxCharacters ? (\n      <BaseBox marginTop=\"spacing.2\" marginRight=\"spacing.1\">\n        <CharacterCounter currentCount={value?.length ?? 0} maxCount={maxCharacters} />\n      </BaseBox>\n    ) : null;\n\n  return (\n    <BaseInput\n      ref={ref}\n      componentName={MetaConstants.PasswordInput}\n      id=\"password-field\"\n      label={label as string}\n      accessibilityLabel={accessibilityLabel}\n      hideLabelText={!Boolean(label)}\n      labelPosition={labelPosition}\n      type={type}\n      labelSuffix={labelSuffix}\n      labelTrailing={labelTrailing}\n      trailingInteractionElement={revealButton}\n      trailingFooterSlot={trailingFooterSlot}\n      maxCharacters={maxCharacters}\n      validationState={validationState}\n      errorText={errorText}\n      successText={successText}\n      helpText={helpText}\n      isDisabled={isDisabled}\n      defaultValue={defaultValue}\n      placeholder={placeholder}\n      isRequired={isRequired}\n      necessityIndicator={necessityIndicator}\n      value={value}\n      onChange={onChange}\n      onBlur={onBlur}\n      onSubmit={onSubmit}\n      onFocus={onFocus}\n      name={name}\n      // eslint-disable-next-line jsx-a11y/no-autofocus\n      autoFocus={autoFocus}\n      autoCompleteSuggestionType={autoCompleteSuggestionType}\n      keyboardReturnKeyType={keyboardReturnKeyType}\n      autoCapitalize=\"none\"\n      testID={testID}\n      size={size}\n      {...rest}\n    />\n  );\n};\n\n// nosemgrep\nconst PasswordInput = assignWithoutSideEffects(React.forwardRef(_PasswordInput), {\n  displayName: 'PasswordInput',\n});\n\nexport type { PasswordInputProps };\nexport { PasswordInput };\n"],"names":["_PasswordInput","_ref","ref","label","accessibilityLabel","_ref$labelPosition","labelPosition","_ref$showRevealButton","showRevealButton","maxCharacters","validationState","errorText","successText","helpText","_ref$isDisabled","isDisabled","defaultValue","placeholder","_ref$isRequired","isRequired","_ref$necessityIndicat","necessityIndicator","value","onChange","onFocus","onBlur","onSubmit","name","_ref$autoFocus","autoFocus","_ref$keyboardReturnKe","keyboardReturnKeyType","autoCompleteSuggestionType","testID","_ref$size","size","labelSuffix","labelTrailing","rest","_objectWithoutProperties","_excluded","_React$useState","React","useState","_React$useState2","_slicedToArray","isRevealed","setIsRevealed","isEnabled","isRevealedAndEnabled","toggleIsRevealed","revealed","iconAccessibilityLabel","type","revealButtonIcon","EyeOffIcon","EyeIcon","revealButton","_jsx","IconButton","icon","onClick","trailingFooterSlot","_value$length","BaseBox","marginTop","marginRight","children","CharacterCounter","currentCount","length","maxCount","BaseInput","Object","assign","componentName","MetaConstants","PasswordInput","id","hideLabelText","Boolean","trailingInteractionElement","autoCapitalize","assignWithoutSideEffects","forwardRef","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA,SAAA,CAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,eAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,WAAA,CAAA,aAAA,CAAA,UAAA,CAAA,YAAA,CAAA,cAAA,CAAA,aAAA,CAAA,YAAA,CAAA,oBAAA,CAAA,OAAA,CAAA,UAAA,CAAA,SAAA,CAAA,QAAA,CAAA,UAAA,CAAA,MAAA,CAAA,WAAA,CAAA,uBAAA,CAAA,4BAAA,CAAA,QAAA,CAAA,MAAA,CAAA,aAAA,CAAA,eAAA,CAAA,CA+GA,IAAMA,cAAmF,CAAG,SAAtFA,cAAmFA,CAAAC,IAAA,CA+BvFC,GAAG,CACA,CA9BD,IAAAC,KAAK,CAAAF,IAAA,CAALE,KAAK,CACLC,kBAAkB,CAAAH,IAAA,CAAlBG,kBAAkB,CAAAC,kBAAA,CAAAJ,IAAA,CAClBK,aAAa,CAAbA,aAAa,CAAAD,kBAAA,GAAA,KAAA,CAAA,CAAG,KAAK,CAAAA,kBAAA,CAAAE,qBAAA,CAAAN,IAAA,CACrBO,gBAAgB,CAAhBA,gBAAgB,CAAAD,qBAAA,GAAG,KAAA,CAAA,CAAA,IAAI,CAAAA,qBAAA,CACvBE,aAAa,CAAAR,IAAA,CAAbQ,aAAa,CACbC,eAAe,CAAAT,IAAA,CAAfS,eAAe,CACfC,SAAS,CAAAV,IAAA,CAATU,SAAS,CACTC,WAAW,CAAAX,IAAA,CAAXW,WAAW,CACXC,QAAQ,CAAAZ,IAAA,CAARY,QAAQ,CAAAC,eAAA,CAAAb,IAAA,CACRc,UAAU,CAAVA,UAAU,CAAAD,eAAA,GAAA,KAAA,CAAA,CAAG,KAAK,CAAAA,eAAA,CAClBE,YAAY,CAAAf,IAAA,CAAZe,YAAY,CACZC,WAAW,CAAAhB,IAAA,CAAXgB,WAAW,CAAAC,eAAA,CAAAjB,IAAA,CACXkB,UAAU,CAAVA,UAAU,CAAAD,eAAA,GAAG,KAAA,CAAA,CAAA,KAAK,CAAAA,eAAA,CAAAE,qBAAA,CAAAnB,IAAA,CAClBoB,kBAAkB,CAAlBA,kBAAkB,CAAAD,qBAAA,GAAA,KAAA,CAAA,CAAG,MAAM,CAAAA,qBAAA,CAC3BE,KAAK,CAAArB,IAAA,CAALqB,KAAK,CACLC,QAAQ,CAAAtB,IAAA,CAARsB,QAAQ,CACRC,OAAO,CAAAvB,IAAA,CAAPuB,OAAO,CACPC,MAAM,CAAAxB,IAAA,CAANwB,MAAM,CACNC,QAAQ,CAAAzB,IAAA,CAARyB,QAAQ,CACRC,IAAI,CAAA1B,IAAA,CAAJ0B,IAAI,CAAAC,cAAA,CAAA3B,IAAA,CACJ4B,SAAS,CAATA,SAAS,CAAAD,cAAA,GAAA,KAAA,CAAA,CAAG,KAAK,CAAAA,cAAA,CAAAE,qBAAA,CAAA7B,IAAA,CACjB8B,qBAAqB,CAArBA,qBAAqB,CAAAD,qBAAA,GAAG,KAAA,CAAA,CAAA,MAAM,CAAAA,qBAAA,CAC9BE,0BAA0B,CAAA/B,IAAA,CAA1B+B,0BAA0B,CAC1BC,MAAM,CAAAhC,IAAA,CAANgC,MAAM,CAAAC,SAAA,CAAAjC,IAAA,CACNkC,IAAI,CAAJA,IAAI,CAAAD,SAAA,GAAA,KAAA,CAAA,CAAG,QAAQ,CAAAA,SAAA,CACfE,WAAW,CAAAnC,IAAA,CAAXmC,WAAW,CACXC,aAAa,CAAApC,IAAA,CAAboC,aAAa,CACVC,IAAI,CAAAC,wBAAA,CAAAtC,IAAA,CAAAuC,SAAA,CAIT,CAAA,IAAAC,eAAA,CAAoCC,cAAK,CAACC,QAAQ,CAAC,KAAK,CAAC,CAAAC,gBAAA,CAAAC,cAAA,CAAAJ,eAAA,CAAA,CAAA,CAAA,CAAlDK,UAAU,CAAAF,gBAAA,CAAEG,CAAAA,CAAAA,CAAAA,aAAa,CAAAH,gBAAA,IAChC,IAAMI,SAAS,CAAG,CAACjC,UAAU,CAG7B,IAAMkC,oBAAoB,CAAGH,UAAU,EAAIE,SAAS,CAEpD,IAAME,gBAAgB,CAAG,SAAnBA,gBAAgBA,EAAe,CAAA,OAAAH,aAAa,CAAC,SAACI,QAAQ,CAAA,CAAA,OAAK,CAACA,QAAQ,CAAA,CAAA,CAAC,CAC3E,CAAA,CAAA,IAAMC,sBAAsB,CAAGH,oBAAoB,CAAG,eAAe,CAAG,eAAe,CACvF,IAAMI,IAAI,CAAGJ,oBAAoB,CAAG,MAAM,CAAG,UAAU,CAEvD,IAAMK,gBAAgB,CAAGL,oBAAoB,CAAGM,UAAU,CAAGC,OAAO,CACpE,IAAMC,YAAY,CAChBjD,gBAAgB,EAAI,CAACO,UAAU,CAC7B2C,GAAA,CAACC,UAAU,CACTxB,CAAAA,IAAI,CAAC,QAAQ,CACbyB,IAAI,CAAEN,gBAAiB,CACvBO,OAAO,CAAEX,gBAAiB,CAC1B9C,kBAAkB,CAAEgD,sBAAuB,CAC5C,CAAC,CACA,IAAI,CAEV,IAAMU,kBAAkB,CAAG,SAArBA,kBAAkBA,CAAIxC,KAAc,CAAAyC,CAAAA,IAAAA,aAAA,CACxC,OAAAtD,aAAa,CACXiD,GAAA,CAACM,OAAO,EAACC,SAAS,CAAC,WAAW,CAACC,WAAW,CAAC,WAAW,CAAAC,QAAA,CACpDT,GAAA,CAACU,gBAAgB,CAAA,CAACC,YAAY,CAAAN,CAAAA,aAAA,CAAEzC,KAAK,cAALA,KAAK,CAAEgD,MAAM,GAAA,IAAA,CAAAP,aAAA,CAAI,CAAE,CAACQ,QAAQ,CAAE9D,aAAc,CAAE,CAAC,CACxE,CAAC,CACR,IAAI,CAEV,CAAA,CAAA,OACEiD,GAAA,CAACc,SAAS,CAAAC,MAAA,CAAAC,MAAA,CACRxE,CAAAA,GAAG,CAAEA,GAAI,CACTyE,aAAa,CAAEC,aAAa,CAACC,aAAc,CAC3CC,EAAE,CAAC,gBAAgB,CACnB3E,KAAK,CAAEA,KAAgB,CACvBC,kBAAkB,CAAEA,kBAAmB,CACvC2E,aAAa,CAAE,CAACC,OAAO,CAAC7E,KAAK,CAAE,CAC/BG,aAAa,CAAEA,aAAc,CAC7B+C,IAAI,CAAEA,IAAK,CACXjB,WAAW,CAAEA,WAAY,CACzBC,aAAa,CAAEA,aAAc,CAC7B4C,0BAA0B,CAAExB,YAAa,CACzCK,kBAAkB,CAAEA,kBAAmB,CACvCrD,aAAa,CAAEA,aAAc,CAC7BC,eAAe,CAAEA,eAAgB,CACjCC,SAAS,CAAEA,SAAU,CACrBC,WAAW,CAAEA,WAAY,CACzBC,QAAQ,CAAEA,QAAS,CACnBE,UAAU,CAAEA,UAAW,CACvBC,YAAY,CAAEA,YAAa,CAC3BC,WAAW,CAAEA,WAAY,CACzBE,UAAU,CAAEA,UAAW,CACvBE,kBAAkB,CAAEA,kBAAmB,CACvCC,KAAK,CAAEA,KAAM,CACbC,QAAQ,CAAEA,QAAS,CACnBE,MAAM,CAAEA,MAAO,CACfC,QAAQ,CAAEA,QAAS,CACnBF,OAAO,CAAEA,OAAQ,CACjBG,IAAI,CAAEA,IAAK,CAEXE,SAAS,CAAEA,SAAU,CACrBG,0BAA0B,CAAEA,0BAA2B,CACvDD,qBAAqB,CAAEA,qBAAsB,CAC7CmD,cAAc,CAAC,MAAM,CACrBjD,MAAM,CAAEA,MAAO,CACfE,IAAI,CAAEA,IAAK,CAAA,CACPG,IAAI,CACT,CAAC,CAEN,CAAC,CAGK,IAAAuC,aAAa,CAAGM,wBAAwB,CAACzC,cAAK,CAAC0C,UAAU,CAACpF,cAAc,CAAC,CAAE,CAC/EqF,WAAW,CAAE,eACf,CAAC;;;;"}

package/build/lib/native/components/Input/SearchInput/SearchInput.js

@@ -37,7 +37,7 @@ import { InputDropdownButton } from '../../Dropdown/InputDropdownButton.native.j
 import { Divider } from '../../Divider/Divider.js';
 import { getComponentId } from '../../../utils/isValidAllowedChildren/isValidAllowedChildren.js';
 
-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});
+var _excluded=["label","accessibilityLabel","labelPosition","placeholder","defaultValue","name","value","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","labelSuffix","labelTrailing","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,labelSuffix=_ref.labelSuffix,labelTrailing=_ref.labelTrailing,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,labelSuffix:labelSuffix,labelTrailing:labelTrailing,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});
 
 export { SearchInput };
 //# sourceMappingURL=SearchInput.js.map

package/build/lib/native/components/Input/SearchInput/SearchInput.js.map

@@ -1 +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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"}
+{"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  | 'labelSuffix'\n  | 'labelTrailing'\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    labelSuffix,\n    labelTrailing,\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        labelSuffix={labelSuffix}\n        labelTrailing={labelTrailing}\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","labelSuffix","labelTrailing","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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"}

package/build/lib/native/components/Input/TextArea/TextArea.js

@@ -26,7 +26,7 @@ import { assignWithoutSideEffects } from '../../../utils/assignWithoutSideEffect
 import { useMergeRefs } from '../../../utils/useMergeRefs.js';
 import { hintMarginTop } from '../../Form/formTokens.js';
 
-var _excluded=["label","accessibilityLabel","labelPosition","necessityIndicator","errorText","helpText","successText","validationState","defaultValue","isDisabled","isRequired","name","onChange","onFocus","onBlur","onSubmit","onKeyDown","placeholder","value","maxCharacters","showClearButton","onClearButtonClick","autoFocus","numberOfLines","testID","size","isTaggedInput","tags","onTagChange"];var isReactNative=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var _TextArea=function _TextArea(_ref,ref){var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,labelPosition=_ref.labelPosition,necessityIndicator=_ref.necessityIndicator,errorText=_ref.errorText,helpText=_ref.helpText,successText=_ref.successText,validationState=_ref.validationState,defaultValue=_ref.defaultValue,isDisabled=_ref.isDisabled,isRequired=_ref.isRequired,name=_ref.name,_onChange=_ref.onChange,_onFocus=_ref.onFocus,_onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,_onKeyDown=_ref.onKeyDown,placeholder=_ref.placeholder,value=_ref.value,maxCharacters=_ref.maxCharacters,showClearButton=_ref.showClearButton,onClearButtonClick=_ref.onClearButtonClick,autoFocus=_ref.autoFocus,_ref$numberOfLines=_ref.numberOfLines,numberOfLines=_ref$numberOfLines===void 0?2:_ref$numberOfLines,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,isTaggedInput=_ref.isTaggedInput,tags=_ref.tags,onTagChange=_ref.onTagChange,rest=_objectWithoutProperties(_ref,_excluded);var inputRef=React__default.useRef(null);var mergedRef=useMergeRefs(ref,inputRef);var _React$useState=React__default.useState(autoFocus!=null?autoFocus:false),_React$useState2=_slicedToArray(_React$useState,2),isInputFocussed=_React$useState2[0],setIsInputFocussed=_React$useState2[1];var _useTaggedInput=useTaggedInput({tags:tags,onTagChange:onTagChange,isDisabled:isDisabled,inputRef:inputRef,isTaggedInput:isTaggedInput,name:name,value:value,onChange:_onChange}),activeTagIndex=_useTaggedInput.activeTagIndex,setActiveTagIndex=_useTaggedInput.setActiveTagIndex,getTags=_useTaggedInput.getTags,handleTaggedInputKeydown=_useTaggedInput.handleTaggedInputKeydown,handleTaggedInputChange=_useTaggedInput.handleTaggedInputChange,handleTagsClear=_useTaggedInput.handleTagsClear;var _React$useState3=React__default.useState(false),_React$useState4=_slicedToArray(_React$useState3,2),shouldShowClearButton=_React$useState4[0],setShouldShowClearButton=_React$useState4[1];React__default.useEffect(function(){setShouldShowClearButton(Boolean(showClearButton&&((value==null?void 0:value.length)||(defaultValue==null?void 0:defaultValue.length))));},[showClearButton,defaultValue,value]);var renderInteractionElement=function renderInteractionElement(){if(shouldShowClearButton){return jsx(BaseBox,{paddingTop:"spacing.3",marginTop:"spacing.1",children:jsx(IconButton,{icon:CloseIcon,accessibilityLabel:"Clear textarea content",onClick:function onClick(){var _inputRef$current;if(isEmpty(value)&&inputRef.current){if(isReactNative(inputRef.current)){inputRef.current.clear();inputRef.current.focus();}else if(inputRef.current instanceof HTMLTextAreaElement){inputRef.current.value='';inputRef.current.focus();}}handleTagsClear();onClearButtonClick==null?void 0:onClearButtonClick();inputRef==null?void 0:(_inputRef$current=inputRef.current)==null?void 0:_inputRef$current.focus();setShouldShowClearButton(false);}})});}return null;};return jsx(BaseInput,Object.assign({as:"textarea",id:"textarea",maxTagRows:"multiple",componentName:MetaConstants.TextArea,autoFocus:autoFocus,ref:mergedRef,label:label,tags:isTaggedInput?getTags({size:size}):undefined,activeTagIndex:activeTagIndex,setActiveTagIndex:setActiveTagIndex,isDropdownTrigger:isTaggedInput,showAllTags:isInputFocussed,accessibilityLabel:accessibilityLabel,hideLabelText:!Boolean(label),labelPosition:labelPosition,necessityIndicator:necessityIndicator,errorText:errorText,helpText:helpText,successText:successText,validationState:validationState,isDisabled:isDisabled,isRequired:isRequired,name:name,maxCharacters:maxCharacters,placeholder:placeholder,trailingInteractionElement:renderInteractionElement(),defaultValue:defaultValue,value:value,numberOfLines:numberOfLines,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});},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);_onKeyDown==null?void 0:_onKeyDown({name:e.name,value:e.event.currentTarget.value,event:e.event});},onSubmit:onSubmit,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})}):null;},testID:testID,size:size},rest));};var TextArea=assignWithoutSideEffects(React__default.forwardRef(_TextArea),{displayName:'TextArea'});
+var _excluded=["label","accessibilityLabel","labelPosition","labelSuffix","labelTrailing","necessityIndicator","errorText","helpText","successText","validationState","defaultValue","isDisabled","isRequired","name","onChange","onFocus","onBlur","onSubmit","onKeyDown","placeholder","value","maxCharacters","showClearButton","onClearButtonClick","autoFocus","numberOfLines","testID","size","isTaggedInput","tags","onTagChange"];var isReactNative=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var _TextArea=function _TextArea(_ref,ref){var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,labelPosition=_ref.labelPosition,labelSuffix=_ref.labelSuffix,labelTrailing=_ref.labelTrailing,necessityIndicator=_ref.necessityIndicator,errorText=_ref.errorText,helpText=_ref.helpText,successText=_ref.successText,validationState=_ref.validationState,defaultValue=_ref.defaultValue,isDisabled=_ref.isDisabled,isRequired=_ref.isRequired,name=_ref.name,_onChange=_ref.onChange,_onFocus=_ref.onFocus,_onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,_onKeyDown=_ref.onKeyDown,placeholder=_ref.placeholder,value=_ref.value,maxCharacters=_ref.maxCharacters,showClearButton=_ref.showClearButton,onClearButtonClick=_ref.onClearButtonClick,autoFocus=_ref.autoFocus,_ref$numberOfLines=_ref.numberOfLines,numberOfLines=_ref$numberOfLines===void 0?2:_ref$numberOfLines,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,isTaggedInput=_ref.isTaggedInput,tags=_ref.tags,onTagChange=_ref.onTagChange,rest=_objectWithoutProperties(_ref,_excluded);var inputRef=React__default.useRef(null);var mergedRef=useMergeRefs(ref,inputRef);var _React$useState=React__default.useState(autoFocus!=null?autoFocus:false),_React$useState2=_slicedToArray(_React$useState,2),isInputFocussed=_React$useState2[0],setIsInputFocussed=_React$useState2[1];var _useTaggedInput=useTaggedInput({tags:tags,onTagChange:onTagChange,isDisabled:isDisabled,inputRef:inputRef,isTaggedInput:isTaggedInput,name:name,value:value,onChange:_onChange}),activeTagIndex=_useTaggedInput.activeTagIndex,setActiveTagIndex=_useTaggedInput.setActiveTagIndex,getTags=_useTaggedInput.getTags,handleTaggedInputKeydown=_useTaggedInput.handleTaggedInputKeydown,handleTaggedInputChange=_useTaggedInput.handleTaggedInputChange,handleTagsClear=_useTaggedInput.handleTagsClear;var _React$useState3=React__default.useState(false),_React$useState4=_slicedToArray(_React$useState3,2),shouldShowClearButton=_React$useState4[0],setShouldShowClearButton=_React$useState4[1];React__default.useEffect(function(){setShouldShowClearButton(Boolean(showClearButton&&((value==null?void 0:value.length)||(defaultValue==null?void 0:defaultValue.length))));},[showClearButton,defaultValue,value]);var renderInteractionElement=function renderInteractionElement(){if(shouldShowClearButton){return jsx(BaseBox,{paddingTop:"spacing.3",marginTop:"spacing.1",children:jsx(IconButton,{icon:CloseIcon,accessibilityLabel:"Clear textarea content",onClick:function onClick(){var _inputRef$current;if(isEmpty(value)&&inputRef.current){if(isReactNative(inputRef.current)){inputRef.current.clear();inputRef.current.focus();}else if(inputRef.current instanceof HTMLTextAreaElement){inputRef.current.value='';inputRef.current.focus();}}handleTagsClear();onClearButtonClick==null?void 0:onClearButtonClick();inputRef==null?void 0:(_inputRef$current=inputRef.current)==null?void 0:_inputRef$current.focus();setShouldShowClearButton(false);}})});}return null;};return jsx(BaseInput,Object.assign({as:"textarea",id:"textarea",maxTagRows:"multiple",componentName:MetaConstants.TextArea,autoFocus:autoFocus,ref:mergedRef,label:label,tags:isTaggedInput?getTags({size:size}):undefined,activeTagIndex:activeTagIndex,setActiveTagIndex:setActiveTagIndex,isDropdownTrigger:isTaggedInput,showAllTags:isInputFocussed,accessibilityLabel:accessibilityLabel,hideLabelText:!Boolean(label),labelPosition:labelPosition,labelSuffix:labelSuffix,labelTrailing:labelTrailing,necessityIndicator:necessityIndicator,errorText:errorText,helpText:helpText,successText:successText,validationState:validationState,isDisabled:isDisabled,isRequired:isRequired,name:name,maxCharacters:maxCharacters,placeholder:placeholder,trailingInteractionElement:renderInteractionElement(),defaultValue:defaultValue,value:value,numberOfLines:numberOfLines,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});},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);_onKeyDown==null?void 0:_onKeyDown({name:e.name,value:e.event.currentTarget.value,event:e.event});},onSubmit:onSubmit,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})}):null;},testID:testID,size:size},rest));};var TextArea=assignWithoutSideEffects(React__default.forwardRef(_TextArea),{displayName:'TextArea'});
 
 export { TextArea };
 //# sourceMappingURL=TextArea.js.map

package/build/lib/native/components/Input/TextArea/TextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","sources":["../../../../../../src/components/Input/TextArea/TextArea.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-autofocus */\nimport React from 'react';\nimport type { TextInput as TextInputReactNative } from 'react-native';\nimport type { BaseInputProps } from '../BaseInput';\nimport { BaseInput } from '../BaseInput';\nimport type { TaggedInputProps } from '../BaseInput/useTaggedInput';\nimport { useTaggedInput } from '../BaseInput/useTaggedInput';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { CloseIcon } from '~components/Icons';\nimport { IconButton } from '~components/Button/IconButton';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { CharacterCounter } from '~components/Form/CharacterCounter';\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 { hintMarginTop } from '~components/Form/formTokens';\nimport type { FormInputOnKeyDownEvent } from '~components/Form/FormTypes';\n\ntype TextAreaCommonProps = Pick<\n  BaseInputProps,\n  | 'label'\n  | 'accessibilityLabel'\n  | 'labelPosition'\n  | 'necessityIndicator'\n  | 'validationState'\n  | 'helpText'\n  | 'errorText'\n  | 'successText'\n  | 'placeholder'\n  | 'defaultValue'\n  | 'name'\n  | 'onChange'\n  | 'onFocus'\n  | 'onBlur'\n  | 'onSubmit'\n  | 'value'\n  | 'isDisabled'\n  | 'isRequired'\n  | 'maxCharacters'\n  | 'autoFocus'\n  | 'numberOfLines'\n  | 'testID'\n  | 'size'\n  | keyof DataAnalyticsAttribute\n> & {\n  /**\n   * Decides whether to render a clear icon button\n   */\n  showClearButton?: boolean;\n  /**\n   * Event handler to handle the onClick event for clear button. Used when `showClearButton` is `true`\n   */\n  onClearButtonClick?: () => void;\n\n  onKeyDown?: ({\n    name,\n    value,\n    event,\n  }: {\n    name?: FormInputOnKeyDownEvent['name'];\n    value: string;\n    event: FormInputOnKeyDownEvent['event'];\n  }) => void;\n} & TaggedInputProps &\n  StyledPropsBlade;\n\n/*\n  Mandatory accessibilityLabel prop when label is not provided\n*/\ntype TextAreaPropsWithA11yLabel = {\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 TextAreaPropsWithLabel = {\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 TextAreaProps = (TextAreaPropsWithA11yLabel | TextAreaPropsWithLabel) & TextAreaCommonProps;\n\n// need to do this to tell TS to infer type as TextInput 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 _TextArea: React.ForwardRefRenderFunction<BladeElementRef, TextAreaProps> = (\n  {\n    label,\n    accessibilityLabel,\n    labelPosition,\n    necessityIndicator,\n    errorText,\n    helpText,\n    successText,\n    validationState,\n    defaultValue,\n    isDisabled,\n    isRequired,\n    name,\n    onChange,\n    onFocus,\n    onBlur,\n    onSubmit,\n    onKeyDown,\n    placeholder,\n    value,\n    maxCharacters,\n    showClearButton,\n    onClearButtonClick,\n    autoFocus,\n    numberOfLines = 2,\n    testID,\n    size = 'medium',\n    isTaggedInput,\n    tags,\n    onTagChange,\n    ...rest\n  },\n  ref,\n) => {\n  const inputRef = React.useRef<BladeElementRefWithValue>(null);\n  const mergedRef = useMergeRefs(ref, inputRef);\n  const [isInputFocussed, setIsInputFocussed] = React.useState(autoFocus ?? false);\n  const {\n    activeTagIndex,\n    setActiveTagIndex,\n    getTags,\n    handleTaggedInputKeydown,\n    handleTaggedInputChange,\n    handleTagsClear,\n  } = useTaggedInput({\n    tags,\n    onTagChange,\n    isDisabled,\n    inputRef,\n    isTaggedInput,\n    name,\n    value,\n    onChange,\n  });\n\n  const [shouldShowClearButton, setShouldShowClearButton] = React.useState(false);\n\n  React.useEffect(() => {\n    setShouldShowClearButton(Boolean(showClearButton && (value?.length || defaultValue?.length)));\n  }, [showClearButton, defaultValue, value]);\n\n  const renderInteractionElement = (): React.ReactNode => {\n    if (shouldShowClearButton) {\n      return (\n        <BaseBox paddingTop=\"spacing.3\" marginTop=\"spacing.1\">\n          <IconButton\n            icon={CloseIcon}\n            accessibilityLabel=\"Clear textarea content\"\n            onClick={() => {\n              if (isEmpty(value) && inputRef.current) {\n                // when the input field is uncontrolled take the ref and clear the input and then call the onClearButtonClick function\n                if (isReactNative(inputRef.current)) {\n                  inputRef.current.clear();\n                  inputRef.current.focus();\n                } else if (inputRef.current instanceof HTMLTextAreaElement) {\n                  inputRef.current.value = '';\n                  inputRef.current.focus();\n                }\n              }\n              handleTagsClear();\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              inputRef?.current?.focus();\n              setShouldShowClearButton(false);\n            }}\n          />\n        </BaseBox>\n      );\n    }\n\n    return null;\n  };\n\n  return (\n    <BaseInput\n      as=\"textarea\"\n      id=\"textarea\"\n      maxTagRows=\"multiple\"\n      componentName={MetaConstants.TextArea}\n      autoFocus={autoFocus}\n      ref={mergedRef}\n      label={label as string}\n      tags={isTaggedInput ? getTags({ size }) : undefined}\n      activeTagIndex={activeTagIndex}\n      setActiveTagIndex={setActiveTagIndex}\n      isDropdownTrigger={isTaggedInput}\n      showAllTags={isInputFocussed}\n      accessibilityLabel={accessibilityLabel}\n      hideLabelText={!Boolean(label)}\n      labelPosition={labelPosition}\n      necessityIndicator={necessityIndicator}\n      errorText={errorText}\n      helpText={helpText}\n      successText={successText}\n      validationState={validationState}\n      isDisabled={isDisabled}\n      isRequired={isRequired}\n      name={name}\n      maxCharacters={maxCharacters}\n      placeholder={placeholder}\n      trailingInteractionElement={renderInteractionElement()}\n      defaultValue={defaultValue}\n      value={value}\n      numberOfLines={numberOfLines}\n      onChange={({ name, value }) => {\n        if (showClearButton && 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        handleTaggedInputChange({ name, value });\n        onChange?.({ name, value });\n      }}\n      onFocus={(e) => {\n        setIsInputFocussed(true);\n        onFocus?.(e);\n      }}\n      onBlur={(e) => {\n        setIsInputFocussed(false);\n        onBlur?.(e);\n      }}\n      onKeyDown={(e) => {\n        handleTaggedInputKeydown(e);\n        onKeyDown?.({\n          name: e.name,\n          value: e.event.currentTarget.value,\n          event: e.event,\n        });\n      }}\n      onSubmit={onSubmit}\n      trailingFooterSlot={(value) => {\n        return maxCharacters ? (\n          <BaseBox marginTop={hintMarginTop[size]} marginRight=\"spacing.1\">\n            <CharacterCounter currentCount={value?.length ?? 0} maxCount={maxCharacters} />\n          </BaseBox>\n        ) : null;\n      }}\n      testID={testID}\n      size={size}\n      {...rest}\n    />\n  );\n};\n\nconst TextArea = assignWithoutSideEffects(React.forwardRef(_TextArea), {\n  displayName: 'TextArea',\n});\n\nexport type { TextAreaProps };\nexport { TextArea };\n"],"names":["isReactNative","_textInputRef","getPlatformType","_TextArea","_ref","ref","label","accessibilityLabel","labelPosition","necessityIndicator","errorText","helpText","successText","validationState","defaultValue","isDisabled","isRequired","name","onChange","onFocus","onBlur","onSubmit","onKeyDown","placeholder","value","maxCharacters","showClearButton","onClearButtonClick","autoFocus","_ref$numberOfLines","numberOfLines","testID","_ref$size","size","isTaggedInput","tags","onTagChange","rest","_objectWithoutProperties","_excluded","inputRef","React","useRef","mergedRef","useMergeRefs","_React$useState","useState","_React$useState2","_slicedToArray","isInputFocussed","setIsInputFocussed","_useTaggedInput","useTaggedInput","activeTagIndex","setActiveTagIndex","getTags","handleTaggedInputKeydown","handleTaggedInputChange","handleTagsClear","_React$useState3","_React$useState4","shouldShowClearButton","setShouldShowClearButton","useEffect","Boolean","length","renderInteractionElement","_jsx","BaseBox","paddingTop","marginTop","children","IconButton","icon","CloseIcon","onClick","_inputRef$current","isEmpty","current","clear","focus","HTMLTextAreaElement","BaseInput","Object","assign","as","id","maxTagRows","componentName","MetaConstants","TextArea","undefined","isDropdownTrigger","showAllTags","hideLabelText","trailingInteractionElement","_ref2","e","event","currentTarget","trailingFooterSlot","_value$length","hintMarginTop","marginRight","CharacterCounter","currentCount","maxCount","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}
+{"version":3,"file":"TextArea.js","sources":["../../../../../../src/components/Input/TextArea/TextArea.tsx"],"sourcesContent":["/* eslint-disable jsx-a11y/no-autofocus */\nimport React from 'react';\nimport type { TextInput as TextInputReactNative } from 'react-native';\nimport type { BaseInputProps } from '../BaseInput';\nimport { BaseInput } from '../BaseInput';\nimport type { TaggedInputProps } from '../BaseInput/useTaggedInput';\nimport { useTaggedInput } from '../BaseInput/useTaggedInput';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { CloseIcon } from '~components/Icons';\nimport { IconButton } from '~components/Button/IconButton';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { CharacterCounter } from '~components/Form/CharacterCounter';\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 { hintMarginTop } from '~components/Form/formTokens';\nimport type { FormInputOnKeyDownEvent } from '~components/Form/FormTypes';\n\ntype TextAreaCommonProps = Pick<\n  BaseInputProps,\n  | 'label'\n  | 'accessibilityLabel'\n  | 'labelPosition'\n  | 'labelSuffix'\n  | 'labelTrailing'\n  | 'necessityIndicator'\n  | 'validationState'\n  | 'helpText'\n  | 'errorText'\n  | 'successText'\n  | 'placeholder'\n  | 'defaultValue'\n  | 'name'\n  | 'onChange'\n  | 'onFocus'\n  | 'onBlur'\n  | 'onSubmit'\n  | 'value'\n  | 'isDisabled'\n  | 'isRequired'\n  | 'maxCharacters'\n  | 'autoFocus'\n  | 'numberOfLines'\n  | 'testID'\n  | 'size'\n  | keyof DataAnalyticsAttribute\n> & {\n  /**\n   * Decides whether to render a clear icon button\n   */\n  showClearButton?: boolean;\n  /**\n   * Event handler to handle the onClick event for clear button. Used when `showClearButton` is `true`\n   */\n  onClearButtonClick?: () => void;\n\n  onKeyDown?: ({\n    name,\n    value,\n    event,\n  }: {\n    name?: FormInputOnKeyDownEvent['name'];\n    value: string;\n    event: FormInputOnKeyDownEvent['event'];\n  }) => void;\n} & TaggedInputProps &\n  StyledPropsBlade;\n\n/*\n  Mandatory accessibilityLabel prop when label is not provided\n*/\ntype TextAreaPropsWithA11yLabel = {\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 TextAreaPropsWithLabel = {\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 TextAreaProps = (TextAreaPropsWithA11yLabel | TextAreaPropsWithLabel) & TextAreaCommonProps;\n\n// need to do this to tell TS to infer type as TextInput 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 _TextArea: React.ForwardRefRenderFunction<BladeElementRef, TextAreaProps> = (\n  {\n    label,\n    accessibilityLabel,\n    labelPosition,\n    labelSuffix,\n    labelTrailing,\n    necessityIndicator,\n    errorText,\n    helpText,\n    successText,\n    validationState,\n    defaultValue,\n    isDisabled,\n    isRequired,\n    name,\n    onChange,\n    onFocus,\n    onBlur,\n    onSubmit,\n    onKeyDown,\n    placeholder,\n    value,\n    maxCharacters,\n    showClearButton,\n    onClearButtonClick,\n    autoFocus,\n    numberOfLines = 2,\n    testID,\n    size = 'medium',\n    isTaggedInput,\n    tags,\n    onTagChange,\n    ...rest\n  },\n  ref,\n) => {\n  const inputRef = React.useRef<BladeElementRefWithValue>(null);\n  const mergedRef = useMergeRefs(ref, inputRef);\n  const [isInputFocussed, setIsInputFocussed] = React.useState(autoFocus ?? false);\n  const {\n    activeTagIndex,\n    setActiveTagIndex,\n    getTags,\n    handleTaggedInputKeydown,\n    handleTaggedInputChange,\n    handleTagsClear,\n  } = useTaggedInput({\n    tags,\n    onTagChange,\n    isDisabled,\n    inputRef,\n    isTaggedInput,\n    name,\n    value,\n    onChange,\n  });\n\n  const [shouldShowClearButton, setShouldShowClearButton] = React.useState(false);\n\n  React.useEffect(() => {\n    setShouldShowClearButton(Boolean(showClearButton && (value?.length || defaultValue?.length)));\n  }, [showClearButton, defaultValue, value]);\n\n  const renderInteractionElement = (): React.ReactNode => {\n    if (shouldShowClearButton) {\n      return (\n        <BaseBox paddingTop=\"spacing.3\" marginTop=\"spacing.1\">\n          <IconButton\n            icon={CloseIcon}\n            accessibilityLabel=\"Clear textarea content\"\n            onClick={() => {\n              if (isEmpty(value) && inputRef.current) {\n                // when the input field is uncontrolled take the ref and clear the input and then call the onClearButtonClick function\n                if (isReactNative(inputRef.current)) {\n                  inputRef.current.clear();\n                  inputRef.current.focus();\n                } else if (inputRef.current instanceof HTMLTextAreaElement) {\n                  inputRef.current.value = '';\n                  inputRef.current.focus();\n                }\n              }\n              handleTagsClear();\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              inputRef?.current?.focus();\n              setShouldShowClearButton(false);\n            }}\n          />\n        </BaseBox>\n      );\n    }\n\n    return null;\n  };\n\n  return (\n    <BaseInput\n      as=\"textarea\"\n      id=\"textarea\"\n      maxTagRows=\"multiple\"\n      componentName={MetaConstants.TextArea}\n      autoFocus={autoFocus}\n      ref={mergedRef}\n      label={label as string}\n      tags={isTaggedInput ? getTags({ size }) : undefined}\n      activeTagIndex={activeTagIndex}\n      setActiveTagIndex={setActiveTagIndex}\n      isDropdownTrigger={isTaggedInput}\n      showAllTags={isInputFocussed}\n      accessibilityLabel={accessibilityLabel}\n      hideLabelText={!Boolean(label)}\n      labelPosition={labelPosition}\n      labelSuffix={labelSuffix}\n      labelTrailing={labelTrailing}\n      necessityIndicator={necessityIndicator}\n      errorText={errorText}\n      helpText={helpText}\n      successText={successText}\n      validationState={validationState}\n      isDisabled={isDisabled}\n      isRequired={isRequired}\n      name={name}\n      maxCharacters={maxCharacters}\n      placeholder={placeholder}\n      trailingInteractionElement={renderInteractionElement()}\n      defaultValue={defaultValue}\n      value={value}\n      numberOfLines={numberOfLines}\n      onChange={({ name, value }) => {\n        if (showClearButton && 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        handleTaggedInputChange({ name, value });\n        onChange?.({ name, value });\n      }}\n      onFocus={(e) => {\n        setIsInputFocussed(true);\n        onFocus?.(e);\n      }}\n      onBlur={(e) => {\n        setIsInputFocussed(false);\n        onBlur?.(e);\n      }}\n      onKeyDown={(e) => {\n        handleTaggedInputKeydown(e);\n        onKeyDown?.({\n          name: e.name,\n          value: e.event.currentTarget.value,\n          event: e.event,\n        });\n      }}\n      onSubmit={onSubmit}\n      trailingFooterSlot={(value) => {\n        return maxCharacters ? (\n          <BaseBox marginTop={hintMarginTop[size]} marginRight=\"spacing.1\">\n            <CharacterCounter currentCount={value?.length ?? 0} maxCount={maxCharacters} />\n          </BaseBox>\n        ) : null;\n      }}\n      testID={testID}\n      size={size}\n      {...rest}\n    />\n  );\n};\n\nconst TextArea = assignWithoutSideEffects(React.forwardRef(_TextArea), {\n  displayName: 'TextArea',\n});\n\nexport type { TextAreaProps };\nexport { TextArea };\n"],"names":["isReactNative","_textInputRef","getPlatformType","_TextArea","_ref","ref","label","accessibilityLabel","labelPosition","labelSuffix","labelTrailing","necessityIndicator","errorText","helpText","successText","validationState","defaultValue","isDisabled","isRequired","name","onChange","onFocus","onBlur","onSubmit","onKeyDown","placeholder","value","maxCharacters","showClearButton","onClearButtonClick","autoFocus","_ref$numberOfLines","numberOfLines","testID","_ref$size","size","isTaggedInput","tags","onTagChange","rest","_objectWithoutProperties","_excluded","inputRef","React","useRef","mergedRef","useMergeRefs","_React$useState","useState","_React$useState2","_slicedToArray","isInputFocussed","setIsInputFocussed","_useTaggedInput","useTaggedInput","activeTagIndex","setActiveTagIndex","getTags","handleTaggedInputKeydown","handleTaggedInputChange","handleTagsClear","_React$useState3","_React$useState4","shouldShowClearButton","setShouldShowClearButton","useEffect","Boolean","length","renderInteractionElement","_jsx","BaseBox","paddingTop","marginTop","children","IconButton","icon","CloseIcon","onClick","_inputRef$current","isEmpty","current","clear","focus","HTMLTextAreaElement","BaseInput","Object","assign","as","id","maxTagRows","componentName","MetaConstants","TextArea","undefined","isDropdownTrigger","showAllTags","hideLabelText","trailingInteractionElement","_ref2","e","event","currentTarget","trailingFooterSlot","_value$length","hintMarginTop","marginRight","CharacterCounter","currentCount","maxCount","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}

package/build/lib/native/components/Input/TextInput/TextInput.js

@@ -37,7 +37,7 @@ import '../../Dropdown/DropdownLink.js';
 import '../../Dropdown/DropdownIconButton.js';
 import '../../Dropdown/DropdownHeaderFooter.js';
 
-var _excluded=["label","accessibilityLabel","labelPosition","placeholder","type","defaultValue","name","value","maxCharacters","format","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,_ref4;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,format=_ref.format,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];if(__DEV__){if(format){var hasAlphanumeric=/[a-zA-Z0-9]/.test(format);if(hasAlphanumeric){throw new Error(`[Blade: TextInput] Invalid format "${format}". Only # and special characters allowed, no letters/numbers.`);}}}var formattingResult=useFormattedInput({format:format,onChange:onChange,value:value,defaultValue:defaultValue});var inputValue=format?formattingResult.formattedValue:value;var effectiveMaxCharacters=format?formattingResult.maxLength:maxCharacters;var handleOnChange=React__default.useCallback(function(_ref2){var name=_ref2.name,inputValue=_ref2.value;if(format){formattingResult.handleChange({name:name,value:inputValue});}else {onChange==null?void 0:onChange({name:name,value:inputValue});}},[format,formattingResult.handleChange,onChange]);var _useTaggedInput=useTaggedInput({isTaggedInput:isTaggedInput,tags:tags,onTagChange:onTagChange,isDisabled:isDisabled,onChange:handleOnChange,name:name,value:inputValue,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:inputValue)));},[showClearButton,defaultValue,inputValue]);var renderClearButton=function renderClearButton(){return jsx(IconButton,{size:"medium",icon:CloseIcon,onClick:function onClick(){var _textInputRef$current;if(isEmpty(inputValue)&&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:format?value!==undefined&&defaultValue!==undefined?defaultValue:undefined:defaultValue,value:format?inputValue:value,name:name,maxCharacters:effectiveMaxCharacters,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(_ref3){var name=_ref3.name,value=_ref3.value;if(showClearButton&&value!=null&&value.length){setShouldShowClearButton(true);}if(shouldShowClearButton&&!(value!=null&&value.length)){setShouldShowClearButton(false);}handleTaggedInputChange({name:name,value:value});handleOnChange({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);if(format){formattingResult.handleKeyDown(e.event);}},onSubmit:onSubmit,isDisabled:isDisabled,necessityIndicator:necessityIndicator,isRequired:isRequired,leadingIcon:(_ref4=_leadingIcon!=null?_leadingIcon:leadingIcon)!=null?_ref4: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 format?null:effectiveMaxCharacters?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:effectiveMaxCharacters,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'});
+var _excluded=["label","accessibilityLabel","labelPosition","placeholder","type","defaultValue","name","value","maxCharacters","format","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","labelSuffix","labelTrailing"];var isReactNative=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var _TextInput=function _TextInput(_ref,ref){var _leading$name,_trailing$name,_ref4;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,format=_ref.format,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,labelSuffix=_ref.labelSuffix,labelTrailing=_ref.labelTrailing,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];if(__DEV__){if(format){var hasAlphanumeric=/[a-zA-Z0-9]/.test(format);if(hasAlphanumeric){throw new Error(`[Blade: TextInput] Invalid format "${format}". Only # and special characters allowed, no letters/numbers.`);}}}var formattingResult=useFormattedInput({format:format,onChange:onChange,value:value,defaultValue:defaultValue});var inputValue=format?formattingResult.formattedValue:value;var effectiveMaxCharacters=format?formattingResult.maxLength:maxCharacters;var handleOnChange=React__default.useCallback(function(_ref2){var name=_ref2.name,inputValue=_ref2.value;if(format){formattingResult.handleChange({name:name,value:inputValue});}else {onChange==null?void 0:onChange({name:name,value:inputValue});}},[format,formattingResult.handleChange,onChange]);var _useTaggedInput=useTaggedInput({isTaggedInput:isTaggedInput,tags:tags,onTagChange:onTagChange,isDisabled:isDisabled,onChange:handleOnChange,name:name,value:inputValue,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:inputValue)));},[showClearButton,defaultValue,inputValue]);var renderClearButton=function renderClearButton(){return jsx(IconButton,{size:"medium",icon:CloseIcon,onClick:function onClick(){var _textInputRef$current;if(isEmpty(inputValue)&&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,labelSuffix:labelSuffix,labelTrailing:labelTrailing,accessibilityLabel:accessibilityLabel,hideLabelText:!Boolean(label),labelPosition:labelPosition,placeholder:placeholder,defaultValue:format?value!==undefined&&defaultValue!==undefined?defaultValue:undefined:defaultValue,value:format?inputValue:value,name:name,maxCharacters:effectiveMaxCharacters,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(_ref3){var name=_ref3.name,value=_ref3.value;if(showClearButton&&value!=null&&value.length){setShouldShowClearButton(true);}if(shouldShowClearButton&&!(value!=null&&value.length)){setShouldShowClearButton(false);}handleTaggedInputChange({name:name,value:value});handleOnChange({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);if(format){formattingResult.handleKeyDown(e.event);}},onSubmit:onSubmit,isDisabled:isDisabled,necessityIndicator:necessityIndicator,isRequired:isRequired,leadingIcon:(_ref4=_leadingIcon!=null?_leadingIcon:leadingIcon)!=null?_ref4: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 format?null:effectiveMaxCharacters?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:effectiveMaxCharacters,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'});
 
 export { TextInput };
 //# sourceMappingURL=TextInput.js.map