@razorpay/blade 11.11.0 → 11.12.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';\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> & {\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    ...styledProps\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      handleOnChange({ value: '', currentOtpIndex });\n      focusOnOtpByIndex(--currentOtpIndex);\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          />\n        </BaseBox>,\n      );\n    }\n    return inputs;\n  };\n\n  return (\n    <BaseBox\n      {...metaAttribute({ name: MetaConstants.OTPInput, testID })}\n      {...getStyledProps(styledProps)}\n    >\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","styledProps","_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","hideLabelText","textAlign","maxCharacters","formEvent","Object","assign","inputIndex","onInput","onKeyDown","keyboardEvent","isRequired","hideFormHint","type","valueComponentType","_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';\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> & {\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    ...styledProps\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      handleOnChange({ value: '', currentOtpIndex });\n      focusOnOtpByIndex(--currentOtpIndex);\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          />\n        </BaseBox>,\n      );\n    }\n    return inputs;\n  };\n\n  return (\n    <BaseBox\n      {...metaAttribute({ name: MetaConstants.OTPInput, testID })}\n      {...getStyledProps(styledProps)}\n    >\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","styledProps","_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","hideLabelText","textAlign","maxCharacters","formEvent","Object","assign","inputIndex","onInput","onKeyDown","keyboardEvent","isRequired","hideFormHint","type","valueComponentType","_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/TextArea/TextArea.js

@@ -2,6 +2,7 @@ import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import React__default from 'react';
 import { BaseInput } from '../BaseInput/BaseInput.js';
+import { useTaggedInput } from '../BaseInput/useTaggedInput.js';
 import isEmpty from '../../../utils/lodashButBetter/isEmpty.js';
 import 'react-native-svg';
 import '@babel/runtime/helpers/defineProperty';
@@ -25,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","placeholder","value","maxCharacters","showClearButton","onClearButtonClick","autoFocus","numberOfLines","testID","size"];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,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,styledProps=_objectWithoutProperties(_ref,_excluded);var inputRef=React__default.useRef(null);var mergedRef=useMergeRefs(ref,inputRef);var _React$useState=React__default.useState(false),_React$useState2=_slicedToArray(_React$useState,2),shouldShowClearButton=_React$useState2[0],setShouldShowClearButton=_React$useState2[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();}}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",componentName:MetaConstants.TextArea,autoFocus:autoFocus,ref:mergedRef,label:label,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);}_onChange==null?void 0:_onChange({name:name,value:value});},onFocus:onFocus,onBlur:onBlur,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},styledProps));};var TextArea=assignWithoutSideEffects(React__default.forwardRef(_TextArea),{displayName:'TextArea'});
+var _excluded=["label","accessibilityLabel","labelPosition","necessityIndicator","errorText","helpText","successText","validationState","defaultValue","isDisabled","isRequired","name","onChange","onFocus","onBlur","onSubmit","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,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,styledProps=_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);},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},styledProps));};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 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 { BladeElementRef } from '~utils/types';\nimport { hintMarginTop } from '~components/Form/formTokens';\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> & {\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} & 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    placeholder,\n    value,\n    maxCharacters,\n    showClearButton,\n    onClearButtonClick,\n    autoFocus,\n    numberOfLines = 2,\n    testID,\n    size = 'medium',\n    ...styledProps\n  },\n  ref,\n) => {\n  const inputRef = React.useRef<BladeElementRef>(null);\n  const mergedRef = useMergeRefs(ref, inputRef);\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              // 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      componentName={MetaConstants.TextArea}\n      autoFocus={autoFocus}\n      ref={mergedRef}\n      label={label as string}\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        onChange?.({ name, value });\n      }}\n      onFocus={onFocus}\n      onBlur={onBlur}\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      {...styledProps}\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","placeholder","value","maxCharacters","showClearButton","onClearButtonClick","autoFocus","_ref$numberOfLines","numberOfLines","testID","_ref$size","size","styledProps","_objectWithoutProperties","_excluded","inputRef","React","useRef","mergedRef","useMergeRefs","_React$useState","useState","_React$useState2","_slicedToArray","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","componentName","MetaConstants","TextArea","hideLabelText","trailingInteractionElement","_ref2","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 { BladeElementRef, BladeElementRefWithValue } from '~utils/types';\nimport { hintMarginTop } from '~components/Form/formTokens';\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> & {\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} & 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    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    ...styledProps\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      }}\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      {...styledProps}\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","placeholder","value","maxCharacters","showClearButton","onClearButtonClick","autoFocus","_ref$numberOfLines","numberOfLines","testID","_ref$size","size","isTaggedInput","tags","onTagChange","styledProps","_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","onKeyDown","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

@@ -3,6 +3,7 @@ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProper
 import React__default, { useState } from 'react';
 import { BaseInput } from '../BaseInput/BaseInput.js';
 import { getKeyboardAndAutocompleteProps } from '../BaseInput/utils.js';
+import { useTaggedInput } from '../BaseInput/useTaggedInput.js';
 import isEmpty from '../../../utils/lodashButBetter/isEmpty.js';
 import 'react-native-svg';
 import '@babel/runtime/helpers/defineProperty';
@@ -27,7 +28,7 @@ import { assignWithoutSideEffects } from '../../../utils/assignWithoutSideEffect
 import { useMergeRefs } from '../../../utils/useMergeRefs.js';
 import { hintMarginTop } from '../../Form/formTokens.js';
 
-var _excluded=["label","accessibilityLabel","labelPosition","placeholder","type","defaultValue","name","value","maxCharacters","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","icon","prefix","showClearButton","onClearButtonClick","isLoading","suffix","autoFocus","keyboardReturnKeyType","autoCompleteSuggestionType","autoCapitalize","testID","size","leadingIcon","trailingIcon"];var isReactNative=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var _TextInput=function _TextInput(_ref,ref){var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,placeholder=_ref.placeholder,_ref$type=_ref.type,type=_ref$type===void 0?'text':_ref$type,defaultValue=_ref.defaultValue,name=_ref.name,value=_ref.value,maxCharacters=_ref.maxCharacters,_onChange=_ref.onChange,onClick=_ref.onClick,onFocus=_ref.onFocus,onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,isDisabled=_ref.isDisabled,necessityIndicator=_ref.necessityIndicator,validationState=_ref.validationState,errorText=_ref.errorText,helpText=_ref.helpText,successText=_ref.successText,isRequired=_ref.isRequired,icon=_ref.icon,prefix=_ref.prefix,showClearButton=_ref.showClearButton,onClearButtonClick=_ref.onClearButtonClick,isLoading=_ref.isLoading,suffix=_ref.suffix,autoFocus=_ref.autoFocus,keyboardReturnKeyType=_ref.keyboardReturnKeyType,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType,autoCapitalize=_ref.autoCapitalize,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,leadingIcon=_ref.leadingIcon,trailingIcon=_ref.trailingIcon,styledProps=_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];React__default.useEffect(function(){setShouldShowClearButton(Boolean(showClearButton&&(defaultValue!=null?defaultValue:value)));},[showClearButton,defaultValue,value]);var renderInteractionElement=function renderInteractionElement(){if(isLoading){return jsx(Spinner,{accessibilityLabel:"Loading Content",color:"primary"});}if(shouldShowClearButton){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"});}return null;};return jsx(BaseInput,Object.assign({id:"textinput",componentName:MetaConstants.TextInput,ref:mergedRef,label:label,accessibilityLabel:accessibilityLabel,hideLabelText:!Boolean(label),labelPosition:labelPosition,placeholder:placeholder,defaultValue:defaultValue,value:value,name:name,maxCharacters:maxCharacters,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);}_onChange==null?void 0:_onChange({name:name,value:value});},onClick:onClick,onFocus:onFocus,onBlur:onBlur,onSubmit:onSubmit,isDisabled:isDisabled,necessityIndicator:necessityIndicator,isRequired:isRequired,leadingIcon:leadingIcon!=null?leadingIcon:icon,prefix:prefix,trailingInteractionElement:renderInteractionElement(),trailingIcon:trailingIcon,suffix:suffix,validationState:validationState,errorText:errorText,helpText:helpText,successText:successText,trailingFooterSlot:function trailingFooterSlot(value){var _value$length;return maxCharacters?jsx(BaseBox,{marginTop:hintMarginTop[size],marginRight:"spacing.1",children:jsx(CharacterCounter,{currentCount:(_value$length=value==null?void 0:value.length)!=null?_value$length:0,maxCount:maxCharacters,size:size})}):null;},autoFocus:autoFocus,testID:testID},getKeyboardAndAutocompleteProps({type:type,keyboardReturnKeyType:keyboardReturnKeyType,autoCompleteSuggestionType:autoCompleteSuggestionType,autoCapitalize:autoCapitalize}),{size:size},styledProps));};var TextInput=assignWithoutSideEffects(React__default.forwardRef(_TextInput),{displayName:'TextInput'});
+var _excluded=["label","accessibilityLabel","labelPosition","placeholder","type","defaultValue","name","value","maxCharacters","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","icon","prefix","showClearButton","onClearButtonClick","isLoading","suffix","autoFocus","keyboardReturnKeyType","autoCompleteSuggestionType","autoCapitalize","testID","size","leadingIcon","trailingIcon","isTaggedInput","tags","onTagChange"];var isReactNative=function isReactNative(_textInputRef){return getPlatformType()==='react-native';};var _TextInput=function _TextInput(_ref,ref){var label=_ref.label,accessibilityLabel=_ref.accessibilityLabel,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,placeholder=_ref.placeholder,_ref$type=_ref.type,type=_ref$type===void 0?'text':_ref$type,defaultValue=_ref.defaultValue,name=_ref.name,value=_ref.value,maxCharacters=_ref.maxCharacters,_onChange=_ref.onChange,onClick=_ref.onClick,_onFocus=_ref.onFocus,_onBlur=_ref.onBlur,onSubmit=_ref.onSubmit,isDisabled=_ref.isDisabled,necessityIndicator=_ref.necessityIndicator,validationState=_ref.validationState,errorText=_ref.errorText,helpText=_ref.helpText,successText=_ref.successText,isRequired=_ref.isRequired,icon=_ref.icon,prefix=_ref.prefix,showClearButton=_ref.showClearButton,onClearButtonClick=_ref.onClearButtonClick,isLoading=_ref.isLoading,suffix=_ref.suffix,autoFocus=_ref.autoFocus,keyboardReturnKeyType=_ref.keyboardReturnKeyType,autoCompleteSuggestionType=_ref.autoCompleteSuggestionType,autoCapitalize=_ref.autoCapitalize,testID=_ref.testID,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,leadingIcon=_ref.leadingIcon,trailingIcon=_ref.trailingIcon,isTaggedInput=_ref.isTaggedInput,tags=_ref.tags,onTagChange=_ref.onTagChange,styledProps=_objectWithoutProperties(_ref,_excluded);var textInputRef=React__default.useRef(null);var mergedRef=useMergeRefs(ref,textInputRef);var _useState=useState(false),_useState2=_slicedToArray(_useState,2),shouldShowClearButton=_useState2[0],setShouldShowClearButton=_useState2[1];var _useState3=useState(autoFocus!=null?autoFocus:false),_useState4=_slicedToArray(_useState3,2),isInputFocussed=_useState4[0],setIsInputFocussed=_useState4[1];var _useTaggedInput=useTaggedInput({isTaggedInput:isTaggedInput,tags:tags,onTagChange:onTagChange,isDisabled:isDisabled,onChange:_onChange,name:name,value:value,inputRef:textInputRef}),activeTagIndex=_useTaggedInput.activeTagIndex,setActiveTagIndex=_useTaggedInput.setActiveTagIndex,getTags=_useTaggedInput.getTags,handleTaggedInputKeydown=_useTaggedInput.handleTaggedInputKeydown,handleTaggedInputChange=_useTaggedInput.handleTaggedInputChange,handleTagsClear=_useTaggedInput.handleTagsClear;React__default.useEffect(function(){setShouldShowClearButton(Boolean(showClearButton&&(defaultValue!=null?defaultValue:value)));},[showClearButton,defaultValue,value]);var renderInteractionElement=function renderInteractionElement(){if(isLoading){return jsx(Spinner,{accessibilityLabel:"Loading Content",color:"primary"});}if(shouldShowClearButton){return jsx(IconButton,{size:"medium",icon:CloseIcon,onClick:function onClick(){var _textInputRef$current;if(isEmpty(value)&&textInputRef.current){if(isReactNative(textInputRef.current)){textInputRef.current.clear();textInputRef.current.focus();}else if(textInputRef.current instanceof HTMLInputElement){textInputRef.current.value='';textInputRef.current.focus();}}handleTagsClear();onClearButtonClick==null?void 0:onClearButtonClick();textInputRef==null?void 0:(_textInputRef$current=textInputRef.current)==null?void 0:_textInputRef$current.focus();setShouldShowClearButton(false);},isDisabled:isDisabled,accessibilityLabel:"Clear Input Content"});}return null;};return jsx(BaseInput,Object.assign({id:"textinput",componentName:MetaConstants.TextInput,ref:mergedRef,label:label,accessibilityLabel:accessibilityLabel,hideLabelText:!Boolean(label),labelPosition:labelPosition,placeholder:placeholder,defaultValue:defaultValue,value:value,name:name,maxCharacters:maxCharacters,isDropdownTrigger:isTaggedInput,tags:isTaggedInput?getTags({size:size}):undefined,showAllTags:isInputFocussed,maxTagRows:"single",activeTagIndex:activeTagIndex,setActiveTagIndex:setActiveTagIndex,onChange:function onChange(_ref2){var name=_ref2.name,value=_ref2.value;if(showClearButton&&value!=null&&value.length){setShouldShowClearButton(true);}if(shouldShowClearButton&&!(value!=null&&value.length)){setShouldShowClearButton(false);}handleTaggedInputChange({name:name,value:value});_onChange==null?void 0:_onChange({name:name,value:value});},onClick:onClick,onFocus:function onFocus(e){setIsInputFocussed(true);_onFocus==null?void 0:_onFocus(e);},onBlur:function onBlur(e){setIsInputFocussed(false);_onBlur==null?void 0:_onBlur(e);},onKeyDown:function onKeyDown(e){handleTaggedInputKeydown(e);},onSubmit:onSubmit,isDisabled:isDisabled,necessityIndicator:necessityIndicator,isRequired:isRequired,leadingIcon:leadingIcon!=null?leadingIcon:icon,prefix:prefix,trailingInteractionElement:renderInteractionElement(),trailingIcon:trailingIcon,suffix:suffix,validationState:validationState,errorText:errorText,helpText:helpText,successText:successText,trailingFooterSlot:function trailingFooterSlot(value){var _value$length;return maxCharacters?jsx(BaseBox,{marginTop:hintMarginTop[size],marginRight:"spacing.1",children:jsx(CharacterCounter,{currentCount:(_value$length=value==null?void 0:value.length)!=null?_value$length:0,maxCount:maxCharacters,size:size})}):null;},autoFocus:autoFocus,testID:testID},getKeyboardAndAutocompleteProps({type:type,keyboardReturnKeyType:keyboardReturnKeyType,autoCompleteSuggestionType:autoCompleteSuggestionType,autoCapitalize:autoCapitalize}),{size:size},styledProps));};var TextInput=assignWithoutSideEffects(React__default.forwardRef(_TextInput),{displayName:'TextInput'});
 
 export { TextInput };
 //# sourceMappingURL=TextInput.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"TextInput.js","sources":["../../../../../../src/components/Input/TextInput/TextInput.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport type { ReactElement, ReactNode } from 'react';\nimport type { TextInput as TextInputReactNative } from 'react-native';\nimport type { BaseInputProps } from '../BaseInput';\nimport { BaseInput } from '../BaseInput';\nimport { getKeyboardAndAutocompleteProps } from '../BaseInput/utils';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport type { IconComponent } from '~components/Icons';\nimport { CloseIcon } from '~components/Icons';\nimport { IconButton } from '~components/Button/IconButton';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { CharacterCounter } from '~components/Form/CharacterCounter';\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 { BladeElementRef } from '~utils/types';\nimport { hintMarginTop } from '~components/Form/formTokens';\n\n// Users should use PasswordInput for input type password\ntype Type = Exclude<BaseInputProps['type'], 'password'>;\n\ntype TextInputCommonProps = 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  | 'value'\n  | 'isDisabled'\n  | 'isRequired'\n  | 'prefix'\n  | 'suffix'\n  | 'maxCharacters'\n  | 'autoFocus'\n  | 'keyboardReturnKeyType'\n  | 'autoCompleteSuggestionType'\n  | 'onSubmit'\n  | 'autoCapitalize'\n  | 'testID'\n  | 'onClick'\n  | 'size'\n  | 'leadingIcon'\n  | 'trailingButton'\n  | 'trailingIcon'\n> & {\n  /**\n   * Decides whether to render a clear icon button\n   */\n  showClearButton?: boolean;\n\n  /**\n   * Event handler to handle the onClick event for clear button. Used when `showClearButton` is `true`\n   */\n  onClearButtonClick?: () => void;\n\n  /**\n   * Decides whether to show a loading spinner for the input field.\n   */\n  isLoading?: boolean;\n\n  /**\n   * Icon that will be rendered at the beginning of the input field\n   * @deprecated Use `leadingIcon` instead. This prop will be removed in the next major version.\n   */\n  icon?: IconComponent;\n  /**\n   * Type of Input Field to be rendered. Use `PasswordInput` for type `password`\n   *\n   *\n   * **Note on number type**\n   *\n   * `type=\"number\"` internally uses `inputMode=\"numeric\"` instead of HTML's `type=\"number\"` which also allows text characters.\n   * If you have a usecase where you only want to support number input, you can handle it on validations end.\n   *\n   * Check out [Why the GOV.UK Design System team changed the input type for numbers](https://technology.blog.gov.uk/2020/02/24/why-the-gov-uk-design-system-team-changed-the-input-type-for-numbers/) for reasoning\n   *\n   * @default text\n   */\n  type?: Type;\n} & StyledPropsBlade;\n\n/*\n  Mandatory accessibilityLabel prop when label is not provided\n*/\ntype TextInputPropsWithA11yLabel = {\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 TextInputPropsWithLabel = {\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 TextInputProps = (TextInputPropsWithA11yLabel | TextInputPropsWithLabel) &\n  TextInputCommonProps;\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 _TextInput: React.ForwardRefRenderFunction<BladeElementRef, TextInputProps> = (\n  {\n    label,\n    accessibilityLabel,\n    labelPosition = 'top',\n    placeholder,\n    type = 'text',\n    defaultValue,\n    name,\n    value,\n    maxCharacters,\n    onChange,\n    onClick,\n    onFocus,\n    onBlur,\n    onSubmit,\n    isDisabled,\n    necessityIndicator,\n    validationState,\n    errorText,\n    helpText,\n    successText,\n    isRequired,\n    icon,\n    prefix,\n    showClearButton,\n    onClearButtonClick,\n    isLoading,\n    suffix,\n    autoFocus,\n    keyboardReturnKeyType,\n    autoCompleteSuggestionType,\n    autoCapitalize,\n    testID,\n    size = 'medium',\n    leadingIcon,\n    trailingIcon,\n    ...styledProps\n  },\n  ref,\n): ReactElement => {\n  const textInputRef = React.useRef<BladeElementRef>(null);\n  const mergedRef = useMergeRefs(ref, textInputRef);\n  const [shouldShowClearButton, setShouldShowClearButton] = useState(false);\n\n  React.useEffect(() => {\n    setShouldShowClearButton(Boolean(showClearButton && (defaultValue ?? value)));\n  }, [showClearButton, defaultValue, value]);\n\n  const renderInteractionElement = (): ReactNode => {\n    if (isLoading) {\n      return <Spinner accessibilityLabel=\"Loading Content\" color=\"primary\" />;\n    }\n\n    if (shouldShowClearButton) {\n      return (\n        <IconButton\n          size=\"medium\"\n          icon={CloseIcon}\n          onClick={() => {\n            if (isEmpty(value) && textInputRef.current) {\n              // when the input field is uncontrolled take the ref and clear the input and then call the onClearButtonClick function\n              if (isReactNative(textInputRef.current)) {\n                textInputRef.current.clear();\n                textInputRef.current.focus();\n              } else if (textInputRef.current instanceof HTMLInputElement) {\n                textInputRef.current.value = '';\n                textInputRef.current.focus();\n              }\n            }\n            // if the input field is controlled just call the click handler and the value change shall be left upto the consumer\n            onClearButtonClick?.();\n            textInputRef?.current?.focus();\n            setShouldShowClearButton(false);\n          }}\n          isDisabled={isDisabled}\n          accessibilityLabel=\"Clear Input Content\"\n        />\n      );\n    }\n\n    return null;\n  };\n\n  return (\n    <BaseInput\n      id=\"textinput\"\n      componentName={MetaConstants.TextInput}\n      ref={mergedRef}\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      maxCharacters={maxCharacters}\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        onChange?.({ name, value });\n      }}\n      onClick={onClick}\n      onFocus={onFocus}\n      onBlur={onBlur}\n      onSubmit={onSubmit}\n      isDisabled={isDisabled}\n      necessityIndicator={necessityIndicator}\n      isRequired={isRequired}\n      leadingIcon={leadingIcon ?? icon}\n      prefix={prefix}\n      trailingInteractionElement={renderInteractionElement()}\n      trailingIcon={trailingIcon}\n      suffix={suffix}\n      validationState={validationState}\n      errorText={errorText}\n      helpText={helpText}\n      successText={successText}\n      trailingFooterSlot={(value) => {\n        return maxCharacters ? (\n          <BaseBox marginTop={hintMarginTop[size]} marginRight=\"spacing.1\">\n            <CharacterCounter\n              currentCount={value?.length ?? 0}\n              maxCount={maxCharacters}\n              size={size}\n            />\n          </BaseBox>\n        ) : null;\n      }}\n      // eslint-disable-next-line jsx-a11y/no-autofocus\n      autoFocus={autoFocus}\n      testID={testID}\n      {...getKeyboardAndAutocompleteProps({\n        type,\n        keyboardReturnKeyType,\n        autoCompleteSuggestionType,\n        autoCapitalize,\n      })}\n      size={size}\n      {...styledProps}\n    />\n  );\n};\n\nconst TextInput = assignWithoutSideEffects(React.forwardRef(_TextInput), {\n  displayName: 'TextInput',\n});\n\nexport type { TextInputProps };\nexport { TextInput };\n"],"names":["isReactNative","_textInputRef","getPlatformType","_TextInput","_ref","ref","label","accessibilityLabel","_ref$labelPosition","labelPosition","placeholder","_ref$type","type","defaultValue","name","value","maxCharacters","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","icon","prefix","showClearButton","onClearButtonClick","isLoading","suffix","autoFocus","keyboardReturnKeyType","autoCompleteSuggestionType","autoCapitalize","testID","_ref$size","size","leadingIcon","trailingIcon","styledProps","_objectWithoutProperties","_excluded","textInputRef","React","useRef","mergedRef","useMergeRefs","_useState","useState","_useState2","_slicedToArray","shouldShowClearButton","setShouldShowClearButton","useEffect","Boolean","renderInteractionElement","_jsx","Spinner","color","IconButton","CloseIcon","_textInputRef$current","isEmpty","current","clear","focus","HTMLInputElement","BaseInput","Object","assign","id","componentName","MetaConstants","TextInput","hideLabelText","_ref2","length","trailingInteractionElement","trailingFooterSlot","_value$length","BaseBox","marginTop","hintMarginTop","marginRight","children","CharacterCounter","currentCount","maxCount","getKeyboardAndAutocompleteProps","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}
+{"version":3,"file":"TextInput.js","sources":["../../../../../../src/components/Input/TextInput/TextInput.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport type { ReactElement, ReactNode } from 'react';\nimport type { TextInput as TextInputReactNative } from 'react-native';\nimport type { BaseInputProps } from '../BaseInput';\nimport { BaseInput } from '../BaseInput';\nimport { getKeyboardAndAutocompleteProps } from '../BaseInput/utils';\nimport type { TaggedInputProps } from '../BaseInput/useTaggedInput';\nimport { useTaggedInput } from '../BaseInput/useTaggedInput';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport type { IconComponent } from '~components/Icons';\nimport { CloseIcon } from '~components/Icons';\nimport { IconButton } from '~components/Button/IconButton';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { CharacterCounter } from '~components/Form/CharacterCounter';\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 { BladeElementRef, BladeElementRefWithValue } from '~utils/types';\nimport { hintMarginTop } from '~components/Form/formTokens';\n\n// Users should use PasswordInput for input type password\ntype Type = Exclude<BaseInputProps['type'], 'password'>;\n\ntype TextInputCommonProps = 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  | 'value'\n  | 'isDisabled'\n  | 'isRequired'\n  | 'prefix'\n  | 'suffix'\n  | 'maxCharacters'\n  | 'autoFocus'\n  | 'keyboardReturnKeyType'\n  | 'autoCompleteSuggestionType'\n  | 'onSubmit'\n  | 'autoCapitalize'\n  | 'testID'\n  | 'onClick'\n  | 'size'\n  | 'leadingIcon'\n  | 'trailingButton'\n  | 'trailingIcon'\n> & {\n  /**\n   * Decides whether to render a clear icon button\n   */\n  showClearButton?: boolean;\n\n  /**\n   * Event handler to handle the onClick event for clear button. Used when `showClearButton` is `true`\n   */\n  onClearButtonClick?: () => void;\n\n  /**\n   * Decides whether to show a loading spinner for the input field.\n   */\n  isLoading?: boolean;\n\n  /**\n   * Icon that will be rendered at the beginning of the input field\n   * @deprecated Use `leadingIcon` instead. This prop will be removed in the next major version.\n   */\n  icon?: IconComponent;\n  /**\n   * Type of Input Field to be rendered. Use `PasswordInput` for type `password`\n   *\n   *\n   * **Note on number type**\n   *\n   * `type=\"number\"` internally uses `inputMode=\"numeric\"` instead of HTML's `type=\"number\"` which also allows text characters.\n   * If you have a usecase where you only want to support number input, you can handle it on validations end.\n   *\n   * Check out [Why the GOV.UK Design System team changed the input type for numbers](https://technology.blog.gov.uk/2020/02/24/why-the-gov-uk-design-system-team-changed-the-input-type-for-numbers/) for reasoning\n   *\n   * @default text\n   */\n  type?: Type;\n} & TaggedInputProps &\n  StyledPropsBlade;\n\n/*\n  Mandatory accessibilityLabel prop when label is not provided\n*/\ntype TextInputPropsWithA11yLabel = {\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 TextInputPropsWithLabel = {\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 TextInputProps = (TextInputPropsWithA11yLabel | TextInputPropsWithLabel) &\n  TextInputCommonProps;\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 _TextInput: React.ForwardRefRenderFunction<BladeElementRef, TextInputProps> = (\n  {\n    label,\n    accessibilityLabel,\n    labelPosition = 'top',\n    placeholder,\n    type = 'text',\n    defaultValue,\n    name,\n    value,\n    maxCharacters,\n    onChange,\n    onClick,\n    onFocus,\n    onBlur,\n    onSubmit,\n    isDisabled,\n    necessityIndicator,\n    validationState,\n    errorText,\n    helpText,\n    successText,\n    isRequired,\n    icon,\n    prefix,\n    showClearButton,\n    onClearButtonClick,\n    isLoading,\n    suffix,\n    autoFocus,\n    keyboardReturnKeyType,\n    autoCompleteSuggestionType,\n    autoCapitalize,\n    testID,\n    size = 'medium',\n    leadingIcon,\n    trailingIcon,\n    isTaggedInput,\n    tags,\n    onTagChange,\n    ...styledProps\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 [isInputFocussed, setIsInputFocussed] = useState(autoFocus ?? false);\n  const {\n    activeTagIndex,\n    setActiveTagIndex,\n    getTags,\n    handleTaggedInputKeydown,\n    handleTaggedInputChange,\n    handleTagsClear,\n  } = useTaggedInput({\n    isTaggedInput,\n    tags,\n    onTagChange,\n    isDisabled,\n    onChange,\n    name,\n    value,\n    inputRef: textInputRef,\n  });\n\n  React.useEffect(() => {\n    setShouldShowClearButton(Boolean(showClearButton && (defaultValue ?? value)));\n  }, [showClearButton, defaultValue, value]);\n\n  const renderInteractionElement = (): ReactNode => {\n    if (isLoading) {\n      return <Spinner accessibilityLabel=\"Loading Content\" color=\"primary\" />;\n    }\n\n    if (shouldShowClearButton) {\n      return (\n        <IconButton\n          size=\"medium\"\n          icon={CloseIcon}\n          onClick={() => {\n            if (isEmpty(value) && textInputRef.current) {\n              // when the input field is uncontrolled take the ref and clear the input and then call the onClearButtonClick function\n              if (isReactNative(textInputRef.current)) {\n                textInputRef.current.clear();\n                textInputRef.current.focus();\n              } else if (textInputRef.current instanceof HTMLInputElement) {\n                textInputRef.current.value = '';\n                textInputRef.current.focus();\n              }\n            }\n            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            textInputRef?.current?.focus();\n            setShouldShowClearButton(false);\n          }}\n          isDisabled={isDisabled}\n          accessibilityLabel=\"Clear Input Content\"\n        />\n      );\n    }\n\n    return null;\n  };\n\n  return (\n    <BaseInput\n      id=\"textinput\"\n      componentName={MetaConstants.TextInput}\n      ref={mergedRef}\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      maxCharacters={maxCharacters}\n      isDropdownTrigger={isTaggedInput}\n      tags={isTaggedInput ? getTags({ size }) : undefined}\n      showAllTags={isInputFocussed}\n      maxTagRows=\"single\"\n      activeTagIndex={activeTagIndex}\n      setActiveTagIndex={setActiveTagIndex}\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      onClick={onClick}\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      }}\n      onSubmit={onSubmit}\n      isDisabled={isDisabled}\n      necessityIndicator={necessityIndicator}\n      isRequired={isRequired}\n      leadingIcon={leadingIcon ?? icon}\n      prefix={prefix}\n      trailingInteractionElement={renderInteractionElement()}\n      trailingIcon={trailingIcon}\n      suffix={suffix}\n      validationState={validationState}\n      errorText={errorText}\n      helpText={helpText}\n      successText={successText}\n      trailingFooterSlot={(value) => {\n        return maxCharacters ? (\n          <BaseBox marginTop={hintMarginTop[size]} marginRight=\"spacing.1\">\n            <CharacterCounter\n              currentCount={value?.length ?? 0}\n              maxCount={maxCharacters}\n              size={size}\n            />\n          </BaseBox>\n        ) : null;\n      }}\n      // eslint-disable-next-line jsx-a11y/no-autofocus\n      autoFocus={autoFocus}\n      testID={testID}\n      {...getKeyboardAndAutocompleteProps({\n        type,\n        keyboardReturnKeyType,\n        autoCompleteSuggestionType,\n        autoCapitalize,\n      })}\n      size={size}\n      {...styledProps}\n    />\n  );\n};\n\nconst TextInput = assignWithoutSideEffects(React.forwardRef(_TextInput), {\n  displayName: 'TextInput',\n});\n\nexport type { TextInputProps };\nexport { TextInput };\n"],"names":["isReactNative","_textInputRef","getPlatformType","_TextInput","_ref","ref","label","accessibilityLabel","_ref$labelPosition","labelPosition","placeholder","_ref$type","type","defaultValue","name","value","maxCharacters","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","icon","prefix","showClearButton","onClearButtonClick","isLoading","suffix","autoFocus","keyboardReturnKeyType","autoCompleteSuggestionType","autoCapitalize","testID","_ref$size","size","leadingIcon","trailingIcon","isTaggedInput","tags","onTagChange","styledProps","_objectWithoutProperties","_excluded","textInputRef","React","useRef","mergedRef","useMergeRefs","_useState","useState","_useState2","_slicedToArray","shouldShowClearButton","setShouldShowClearButton","_useState3","_useState4","isInputFocussed","setIsInputFocussed","_useTaggedInput","useTaggedInput","inputRef","activeTagIndex","setActiveTagIndex","getTags","handleTaggedInputKeydown","handleTaggedInputChange","handleTagsClear","useEffect","Boolean","renderInteractionElement","_jsx","Spinner","color","IconButton","CloseIcon","_textInputRef$current","isEmpty","current","clear","focus","HTMLInputElement","BaseInput","Object","assign","id","componentName","MetaConstants","TextInput","hideLabelText","isDropdownTrigger","undefined","showAllTags","maxTagRows","_ref2","length","e","onKeyDown","trailingInteractionElement","trailingFooterSlot","_value$length","BaseBox","marginTop","hintMarginTop","marginRight","children","CharacterCounter","currentCount","maxCount","getKeyboardAndAutocompleteProps","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}

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

@@ -18,7 +18,7 @@ import '../../tokens/global/motion.js';
 import { size } from '../../tokens/global/size.js';
 import { getFloatingPlacementParts } from '../../utils/getFloatingPlacementParts.js';
 
-var StyledSvg=styled(Svg)(function(_ref){var styles=_ref.styles;return styles;});var PopupArrow=React.forwardRef(function(_ref2,ref){var context=_ref2.context,width=_ref2.width,height=_ref2.height,fillColor=_ref2.fillColor,strokeColor=_ref2.strokeColor;var _useTheme=useTheme(),theme=_useTheme.theme;var placement=context.placement,floating=context.elements.floating,arrow=context.middlewareData.arrow;var strokeWidth=theme.border.width.thin*2;if(__DEV__){if(!ref){logger({type:'warn',moduleName:'PopupArrow',message:'Floating UI: The `ref` prop is required for the `FloatingArrow` component.'});}}if(!floating){return jsx(Fragment,{});}var _getFloatingPlacement=getFloatingPlacementParts(placement),_getFloatingPlacement2=_slicedToArray(_getFloatingPlacement,1),side=_getFloatingPlacement2[0];var svgX=width/2;var svgY=0;var dValue='M0,0'+` H${width}`+` L${width-svgX},${height-svgY}`+` Q${width/2},${height} ${svgX},${height-svgY}`+' Z';var staticSide={top:'bottom',right:'left',bottom:'top',left:'right'}[side];var rotation={top:0,bottom:180,left:-90,right:90}[side];var newStyles={};if(arrow){var _newStyles;var x=arrow.x,y=arrow.y;newStyles=(_newStyles={width:makeSize(size[20]),height:makeSize(size[20]),position:'absolute',left:x!=null?`${x}px`:undefined,top:y!=null?`${y}px`:undefined,right:undefined,bottom:undefined},_defineProperty(_newStyles,staticSide,`${-width}px`),_defineProperty(_newStyles,"transform",`rotate(${rotation}deg)`),_newStyles);}return jsx(View,{pointerEvents:"none",collapsable:false,style:{position:'absolute',left:0,right:0,top:0,bottom:0},children:jsxs(StyledSvg,{ref:ref,width:`${width}px`,height:`${width}px`,viewBox:`0 0 ${width} ${width}`,styles:newStyles,children:[jsx(Path,{fill:"none",stroke:strokeColor,strokeWidth:`${strokeWidth}px`,d:dValue}),jsx(Path,{fill:fillColor,stroke:"none",d:dValue})]})});});
+var StyledSvg=styled(Svg)(function(_ref){var styles=_ref.styles;return styles;});var PopupArrow=React.forwardRef(function(_ref2,ref){var context=_ref2.context,width=_ref2.width,height=_ref2.height,fillColor=_ref2.fillColor,strokeColor=_ref2.strokeColor;var _useTheme=useTheme(),theme=_useTheme.theme;var placement=context.placement,floating=context.elements.floating,arrow=context.middlewareData.arrow;var strokeWidth=theme.border.width.thin*2;if(__DEV__){if(!ref){logger({type:'warn',moduleName:'PopupArrow',message:'Floating UI: The `ref` prop is required for the `FloatingArrow` component.'});}}if(!floating){return jsx(Fragment,{});}var _getFloatingPlacement=getFloatingPlacementParts(placement),_getFloatingPlacement2=_slicedToArray(_getFloatingPlacement,1),side=_getFloatingPlacement2[0];var svgX=width/2;var svgY=0;var dValue='M0,0'+` H${width}`+` L${width-svgX},${height-svgY}`+` Q${width/2},${height} ${svgX},${height-svgY}`+' Z';var staticSide={top:'bottom',right:'left',bottom:'top',left:'right'}[side];var rotation={top:0,bottom:180,left:-90,right:90}[side];var newStyles={};if(arrow){var x=arrow.x,y=arrow.y;newStyles=_defineProperty(_defineProperty({width:makeSize(size[20]),height:makeSize(size[20]),position:'absolute',left:x!=null?`${x}px`:undefined,top:y!=null?`${y}px`:undefined,right:undefined,bottom:undefined},staticSide,`${-width}px`),"transform",`rotate(${rotation}deg)`);}return jsx(View,{pointerEvents:"none",collapsable:false,style:{position:'absolute',left:0,right:0,top:0,bottom:0},children:jsxs(StyledSvg,{ref:ref,width:`${width}px`,height:`${width}px`,viewBox:`0 0 ${width} ${width}`,styles:newStyles,children:[jsx(Path,{fill:"none",stroke:strokeColor,strokeWidth:`${strokeWidth}px`,d:dValue}),jsx(Path,{fill:fillColor,stroke:"none",d:dValue})]})});});
 
 export { PopupArrow };
 //# sourceMappingURL=PopupArrow.native.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"PopupArrow.native.js","sources":["../../../../../src/components/PopupArrow/PopupArrow.native.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-useless-fragment */\nimport * as React from 'react';\nimport styled from 'styled-components/native';\nimport { View } from 'react-native';\nimport type { CSSObject } from 'styled-components';\nimport type { PopupArrowProps } from './types';\nimport Svg, { Path } from '~components/Icons/_Svg';\nimport { useTheme } from '~components/BladeProvider';\nimport type { SvgProps } from '~components/Icons/_Svg/Svg/types';\nimport { makeSize } from '~utils';\nimport { size } from '~tokens/global';\nimport { logger } from '~utils/logger';\nimport { getFloatingPlacementParts } from '~utils/getFloatingPlacementParts';\n\nconst StyledSvg = styled(Svg)<{ styles?: CSSObject }>(({ styles }) => {\n  return styles;\n});\n\n// modified version of FloatingArrow\n// https://github.com/floating-ui/floating-ui/blob/master/packages/react/src/components/FloatingArrow.tsx\nconst PopupArrow = React.forwardRef<SvgProps, PopupArrowProps>(\n  ({ context, width, height, fillColor, strokeColor }, ref): React.ReactElement => {\n    const { theme } = useTheme();\n\n    const {\n      placement,\n      elements: { floating },\n      middlewareData: { arrow },\n    } = context;\n    const strokeWidth = theme.border.width.thin * 2;\n\n    if (__DEV__) {\n      if (!ref) {\n        logger({\n          type: 'warn',\n          moduleName: 'PopupArrow',\n          message: 'Floating UI: The `ref` prop is required for the `FloatingArrow` component.',\n        });\n      }\n    }\n\n    if (!floating) {\n      return <></>;\n    }\n\n    const [side] = getFloatingPlacementParts(placement);\n\n    const svgX = width / 2;\n    const svgY = 0;\n    const dValue =\n      'M0,0' +\n      ` H${width}` +\n      ` L${width - svgX},${height - svgY}` +\n      ` Q${width / 2},${height} ${svgX},${height - svgY}` +\n      ' Z';\n\n    const staticSide = {\n      top: 'bottom',\n      right: 'left',\n      bottom: 'top',\n      left: 'right',\n    }[side];\n\n    const rotation = {\n      top: 0,\n      bottom: 180,\n      left: -90,\n      right: 90,\n    }[side];\n\n    let newStyles = {};\n    if (arrow) {\n      const { x, y } = arrow;\n      newStyles = {\n        width: makeSize(size[20]),\n        height: makeSize(size[20]),\n        position: 'absolute',\n        left: x != null ? `${x}px` : undefined,\n        top: y != null ? `${y}px` : undefined,\n        // Ensure the static side gets unset when\n        // flipping to other placements' axes.\n        right: undefined,\n        bottom: undefined,\n        [staticSide]: `${-width}px`,\n        transform: `rotate(${rotation}deg)`,\n      };\n    }\n\n    return (\n      <View\n        pointerEvents=\"none\"\n        collapsable={false}\n        style={{ position: 'absolute', left: 0, right: 0, top: 0, bottom: 0 }}\n      >\n        <StyledSvg\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error\n          // @ts-ignore this file is native only\n          ref={ref}\n          width={`${width}px`}\n          height={`${width}px`}\n          viewBox={`0 0 ${width} ${width}`}\n          styles={newStyles}\n        >\n          <Path fill=\"none\" stroke={strokeColor} strokeWidth={`${strokeWidth}px`} d={dValue} />\n          <Path fill={fillColor} stroke=\"none\" d={dValue} />\n        </StyledSvg>\n      </View>\n    );\n  },\n);\n\nexport { PopupArrow };\n"],"names":["StyledSvg","styled","Svg","_ref","styles","PopupArrow","React","forwardRef","_ref2","ref","context","width","height","fillColor","strokeColor","_useTheme","useTheme","theme","placement","floating","elements","arrow","middlewareData","strokeWidth","border","thin","__DEV__","logger","type","moduleName","message","_jsx","_Fragment","_getFloatingPlacement","getFloatingPlacementParts","_getFloatingPlacement2","_slicedToArray","side","svgX","svgY","dValue","staticSide","top","right","bottom","left","rotation","newStyles","_newStyles","x","y","makeSize","size","position","undefined","_defineProperty","View","pointerEvents","collapsable","style","children","_jsxs","viewBox","Path","fill","stroke","d"],"mappings":"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"}
+{"version":3,"file":"PopupArrow.native.js","sources":["../../../../../src/components/PopupArrow/PopupArrow.native.tsx"],"sourcesContent":["/* eslint-disable react/jsx-no-useless-fragment */\nimport * as React from 'react';\nimport styled from 'styled-components/native';\nimport { View } from 'react-native';\nimport type { CSSObject } from 'styled-components';\nimport type { PopupArrowProps } from './types';\nimport Svg, { Path } from '~components/Icons/_Svg';\nimport { useTheme } from '~components/BladeProvider';\nimport type { SvgProps } from '~components/Icons/_Svg/Svg/types';\nimport { makeSize } from '~utils';\nimport { size } from '~tokens/global';\nimport { logger } from '~utils/logger';\nimport { getFloatingPlacementParts } from '~utils/getFloatingPlacementParts';\n\nconst StyledSvg = styled(Svg)<{ styles?: CSSObject }>(({ styles }) => {\n  return styles;\n});\n\n// modified version of FloatingArrow\n// https://github.com/floating-ui/floating-ui/blob/master/packages/react/src/components/FloatingArrow.tsx\nconst PopupArrow = React.forwardRef<SvgProps, PopupArrowProps>(\n  ({ context, width, height, fillColor, strokeColor }, ref): React.ReactElement => {\n    const { theme } = useTheme();\n\n    const {\n      placement,\n      elements: { floating },\n      middlewareData: { arrow },\n    } = context;\n    const strokeWidth = theme.border.width.thin * 2;\n\n    if (__DEV__) {\n      if (!ref) {\n        logger({\n          type: 'warn',\n          moduleName: 'PopupArrow',\n          message: 'Floating UI: The `ref` prop is required for the `FloatingArrow` component.',\n        });\n      }\n    }\n\n    if (!floating) {\n      return <></>;\n    }\n\n    const [side] = getFloatingPlacementParts(placement);\n\n    const svgX = width / 2;\n    const svgY = 0;\n    const dValue =\n      'M0,0' +\n      ` H${width}` +\n      ` L${width - svgX},${height - svgY}` +\n      ` Q${width / 2},${height} ${svgX},${height - svgY}` +\n      ' Z';\n\n    const staticSide = {\n      top: 'bottom',\n      right: 'left',\n      bottom: 'top',\n      left: 'right',\n    }[side];\n\n    const rotation = {\n      top: 0,\n      bottom: 180,\n      left: -90,\n      right: 90,\n    }[side];\n\n    let newStyles = {};\n    if (arrow) {\n      const { x, y } = arrow;\n      newStyles = {\n        width: makeSize(size[20]),\n        height: makeSize(size[20]),\n        position: 'absolute',\n        left: x != null ? `${x}px` : undefined,\n        top: y != null ? `${y}px` : undefined,\n        // Ensure the static side gets unset when\n        // flipping to other placements' axes.\n        right: undefined,\n        bottom: undefined,\n        [staticSide]: `${-width}px`,\n        transform: `rotate(${rotation}deg)`,\n      };\n    }\n\n    return (\n      <View\n        pointerEvents=\"none\"\n        collapsable={false}\n        style={{ position: 'absolute', left: 0, right: 0, top: 0, bottom: 0 }}\n      >\n        <StyledSvg\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment, @typescript-eslint/prefer-ts-expect-error\n          // @ts-ignore this file is native only\n          ref={ref}\n          width={`${width}px`}\n          height={`${width}px`}\n          viewBox={`0 0 ${width} ${width}`}\n          styles={newStyles}\n        >\n          <Path fill=\"none\" stroke={strokeColor} strokeWidth={`${strokeWidth}px`} d={dValue} />\n          <Path fill={fillColor} stroke=\"none\" d={dValue} />\n        </StyledSvg>\n      </View>\n    );\n  },\n);\n\nexport { PopupArrow };\n"],"names":["StyledSvg","styled","Svg","_ref","styles","PopupArrow","React","forwardRef","_ref2","ref","context","width","height","fillColor","strokeColor","_useTheme","useTheme","theme","placement","floating","elements","arrow","middlewareData","strokeWidth","border","thin","__DEV__","logger","type","moduleName","message","_jsx","_Fragment","_getFloatingPlacement","getFloatingPlacementParts","_getFloatingPlacement2","_slicedToArray","side","svgX","svgY","dValue","staticSide","top","right","bottom","left","rotation","newStyles","x","y","_defineProperty","makeSize","size","position","undefined","View","pointerEvents","collapsable","style","children","_jsxs","viewBox","Path","fill","stroke","d"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"Tabs.native.js","sources":["../../../../../src/components/Tabs/Tabs.native.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/no-non-null-asserted-optional-chain */\n/* eslint-disable babel/new-cap */\n/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport React from 'react';\nimport { TabBar, TabView } from 'react-native-tab-view';\nimport { Dimensions } from 'react-native';\nimport type { TabsProps } from './types';\nimport { TabsContext } from './TabsContext';\nimport { StyledTabButton } from './TabItem.native';\nimport { iconColor, textColor, trackColor } from './tabTokens';\nimport { iconSizeMap, useTabsItemPropRestriction } from './utils';\nimport { TabIndicator } from './TabIndicator';\nimport { SafeSceneMap } from './SafeSceneMap.native';\nimport { getComponentId } from '~utils/isValidAllowedChildren';\nimport { Text } from '~components/Typography';\nimport { Box } from '~components/Box';\nimport { useTheme } from '~components/BladeProvider';\nimport { useControllableState } from '~utils/useControllable';\nimport { Divider } from '~components/Divider';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport getIn from '~utils/lodashButBetter/get';\n\nconst initialLayout = {\n  height: 0,\n  width: Dimensions.get('window').width,\n};\n\nconst getTabs = (node: React.ReactNode): React.ReactElement[] => {\n  const children = React.Children.toArray(node);\n  const tabList = children.find((child) => getComponentId(child) === 'TabList');\n  if (!tabList || !React.isValidElement(tabList)) {\n    throw new Error('TabList is required');\n  }\n\n  return tabList.props.children;\n};\n\nconst getTabPanels = (node: React.ReactNode): Record<string, () => React.ReactElement> => {\n  const children = React.Children.toArray(node) as React.ReactElement[];\n  return children\n    .filter((child) => getComponentId(child) === 'TabPanel')\n    .reduce((prev, curr) => {\n      return { ...prev, [curr.props.value]: () => curr.props.children };\n    }, {});\n};\n\nconst getRoutes = (tabs: React.ReactElement[]) => {\n  return tabs.map((TabComponent, index) => ({\n    index,\n    title: TabComponent.props.children,\n    key: TabComponent.props.value,\n    value: TabComponent.props.value,\n    leading: TabComponent.props.leading,\n    trailing: TabComponent.props.trailing,\n  }));\n};\n\ntype Route = {\n  value?: string;\n  index?: number;\n};\n\nconst getRouteIndexFromValue = ({ value, routes }: { value?: string; routes: Route[] }) =>\n  routes.findIndex((route) => route.value === value);\n\nconst getRouteValueFromIndex = ({ index, routes }: { index?: number; routes: Route[] }) =>\n  routes.find((route) => route.index === index)?.value!;\n\nconst Tabs = ({\n  children,\n  defaultValue,\n  value,\n  onChange,\n  size = 'medium',\n  variant = 'bordered',\n  isFullWidthTabItem = false,\n  isLazy = false,\n}: TabsProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const tabs = getTabs(children);\n  const panels = getTabPanels(children);\n  const routes = getRoutes(tabs);\n  const isFilled = variant === 'filled';\n\n  const [selectedValue, setSelectedValue] = useControllableState({\n    defaultValue,\n    value,\n    onChange: (value) => {\n      onChange?.(value);\n    },\n  });\n\n  const routeIndex = getRouteIndexFromValue({\n    value: selectedValue,\n    routes,\n  });\n\n  const setIndex = React.useCallback(\n    (index: number, skipUpdate = false) => {\n      const value = getRouteValueFromIndex({ index, routes });\n      // If skipUpdate is true, useControlledState will not call the onChange callback\n      // This is useful when we want to set the initial value\n      setSelectedValue(() => value, skipUpdate);\n    },\n    [routes, setSelectedValue],\n  );\n\n  // In mobile we can't have vertical tabs because of the lack of screen space\n  // So we always set it to false\n  const isVertical = false;\n  const contextValue = {\n    baseId: '',\n    selectedValue,\n    isVertical,\n    size,\n    variant,\n    isFullWidthTabItem,\n  };\n\n  // Set initial value\n  React.useLayoutEffect(() => {\n    if (selectedValue) return;\n    setIndex(0, true);\n  }, [selectedValue, setIndex]);\n\n  const renderTabLabel = React.useCallback(\n    ({ route, focused }) => {\n      const { title, leading: Leading, trailing } = route;\n      const selectedState = focused ? 'selected' : 'unselected';\n      // eslint-disable-next-line react-hooks/rules-of-hooks\n      const validatedTrailingComponent = useTabsItemPropRestriction(trailing, size);\n\n      return (\n        <StyledTabButton\n          size={size}\n          variant={variant}\n          isFullWidthTabItem={!isFullWidthTabItem && !isFilled}\n          {...metaAttribute({ name: MetaConstants.TabItem })}\n        >\n          <Box display=\"flex\" alignItems=\"center\" flexDirection=\"row\" gap=\"spacing.3\">\n            {Leading ? (\n              <Leading size={iconSizeMap[size]} color={iconColor[selectedState].default} />\n            ) : null}\n            <Text\n              color={textColor[selectedState].default}\n              size={size === 'medium' ? 'medium' : 'large'}\n              weight=\"semibold\"\n            >\n              {title}\n            </Text>\n            {validatedTrailingComponent}\n          </Box>\n        </StyledTabButton>\n      );\n    },\n    [isFullWidthTabItem, isFilled, size, variant],\n  );\n\n  const renderTabBar = React.useCallback(\n    (props) => (\n      <TabBar\n        {...props}\n        {...metaAttribute({ name: MetaConstants.TabList })}\n        gap={0}\n        android_ripple={{ borderless: true, color: 'transparent' }}\n        scrollEnabled={!isFullWidthTabItem && !isFilled}\n        tabStyle={{\n          padding: 0,\n          margin: 0,\n          minHeight: 0,\n        }}\n        style={{\n          ...(isFilled\n            ? {\n                shadowOpacity: 0,\n                shadowColor: 'transparent',\n                borderRadius: theme.border.radius.small,\n                borderWidth: theme.border.width.thick,\n                borderColor: theme.colors.interactive.border.gray.faded,\n                backgroundColor: theme.colors.surface.background.gray.intense,\n                padding: theme.spacing[2],\n              }\n            : {\n                shadowOpacity: 0,\n                shadowColor: 'transparent',\n                backgroundColor: 'transparent',\n                ...(variant !== 'borderless' && {\n                  borderBottomColor: getIn(theme.colors, trackColor),\n                  borderBottomWidth: theme.border.width.thin,\n                }),\n              }),\n        }}\n        renderIndicator={TabIndicator}\n        renderLabel={renderTabLabel}\n        // This is a bit hacky, but this is the only way to put a divider between tabs\n        // Since there is no way to use tablist.map() to render the tabs\n        renderBadge={() => {\n          if (!isFilled) return null;\n          if (routeIndex === 0) {\n            return null;\n          }\n          return (\n            <Divider\n              left=\"1px\"\n              height=\"20px\"\n              variant=\"normal\"\n              orientation=\"vertical\"\n              // again, hacky but no way to get exact height of the tabbar\n              // Since we already know the height of large,medium size tabs, I just hardcode it here.\n              top={size === 'large' ? '6px' : '4px'}\n            />\n          );\n        }}\n      />\n    ),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [isFullWidthTabItem, isFilled, renderTabLabel],\n  );\n\n  return (\n    <TabsContext.Provider value={contextValue}>\n      <TabView\n        navigationState={{\n          index: routeIndex,\n          routes,\n        }}\n        renderScene={SafeSceneMap(panels)}\n        renderTabBar={renderTabBar}\n        onIndexChange={(idx) => {\n          setIndex(idx);\n        }}\n        initialLayout={initialLayout}\n        lazy={isLazy}\n      />\n    </TabsContext.Provider>\n  );\n};\n\nexport { Tabs };\n"],"names":["initialLayout","height","width","Dimensions","get","getTabs","node","children","React","Children","toArray","tabList","find","child","getComponentId","isValidElement","Error","props","getTabPanels","filter","reduce","prev","curr","Object","assign","_defineProperty","value","getRoutes","tabs","map","TabComponent","index","title","key","leading","trailing","getRouteIndexFromValue","_ref","routes","findIndex","route","getRouteValueFromIndex","_ref2","_routes$find","Tabs","_ref3","defaultValue","onChange","_ref3$size","size","_ref3$variant","variant","_ref3$isFullWidthTabI","isFullWidthTabItem","_ref3$isLazy","isLazy","_useTheme","useTheme","theme","panels","isFilled","_useControllableState","useControllableState","_useControllableState2","_slicedToArray","selectedValue","setSelectedValue","routeIndex","setIndex","useCallback","skipUpdate","arguments","length","undefined","isVertical","contextValue","baseId","useLayoutEffect","renderTabLabel","_ref4","focused","Leading","selectedState","validatedTrailingComponent","useTabsItemPropRestriction","_jsx","StyledTabButton","metaAttribute","name","MetaConstants","TabItem","_jsxs","Box","display","alignItems","flexDirection","gap","iconSizeMap","color","iconColor","default","Text","textColor","weight","renderTabBar","TabBar","TabList","android_ripple","borderless","scrollEnabled","tabStyle","padding","margin","minHeight","style","shadowOpacity","shadowColor","borderRadius","border","radius","small","borderWidth","thick","borderColor","colors","interactive","gray","faded","backgroundColor","surface","background","intense","spacing","borderBottomColor","getIn","trackColor","borderBottomWidth","thin","renderIndicator","TabIndicator","renderLabel","renderBadge","Divider","left","orientation","top","TabsContext","Provider","TabView","navigationState","renderScene","SafeSceneMap","onIndexChange","idx","lazy"],"mappings":"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"}
+{"version":3,"file":"Tabs.native.js","sources":["../../../../../src/components/Tabs/Tabs.native.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/no-non-null-asserted-optional-chain */\n/* eslint-disable babel/new-cap */\n/* eslint-disable @typescript-eslint/explicit-function-return-type */\nimport React from 'react';\nimport { TabBar, TabView } from 'react-native-tab-view';\nimport { Dimensions } from 'react-native';\nimport type { TabsProps } from './types';\nimport { TabsContext } from './TabsContext';\nimport { StyledTabButton } from './TabItem.native';\nimport { iconColor, textColor, trackColor } from './tabTokens';\nimport { iconSizeMap, useTabsItemPropRestriction } from './utils';\nimport { TabIndicator } from './TabIndicator';\nimport { SafeSceneMap } from './SafeSceneMap.native';\nimport { getComponentId } from '~utils/isValidAllowedChildren';\nimport { Text } from '~components/Typography';\nimport { Box } from '~components/Box';\nimport { useTheme } from '~components/BladeProvider';\nimport { useControllableState } from '~utils/useControllable';\nimport { Divider } from '~components/Divider';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport getIn from '~utils/lodashButBetter/get';\n\nconst initialLayout = {\n  height: 0,\n  width: Dimensions.get('window').width,\n};\n\nconst getTabs = (node: React.ReactNode): React.ReactElement[] => {\n  const children = React.Children.toArray(node);\n  const tabList = children.find((child) => getComponentId(child) === 'TabList');\n  if (!tabList || !React.isValidElement(tabList)) {\n    throw new Error('TabList is required');\n  }\n\n  return tabList.props.children;\n};\n\nconst getTabPanels = (node: React.ReactNode): Record<string, () => React.ReactElement> => {\n  const children = React.Children.toArray(node) as React.ReactElement[];\n  return children\n    .filter((child) => getComponentId(child) === 'TabPanel')\n    .reduce((prev, curr) => {\n      return { ...prev, [curr.props.value]: () => curr.props.children };\n    }, {});\n};\n\nconst getRoutes = (tabs: React.ReactElement[]) => {\n  return tabs.map((TabComponent, index) => ({\n    index,\n    title: TabComponent.props.children,\n    key: TabComponent.props.value,\n    value: TabComponent.props.value,\n    leading: TabComponent.props.leading,\n    trailing: TabComponent.props.trailing,\n  }));\n};\n\ntype Route = {\n  value?: string;\n  index?: number;\n};\n\nconst getRouteIndexFromValue = ({ value, routes }: { value?: string; routes: Route[] }) =>\n  routes.findIndex((route) => route.value === value);\n\nconst getRouteValueFromIndex = ({ index, routes }: { index?: number; routes: Route[] }) =>\n  routes.find((route) => route.index === index)?.value!;\n\nconst Tabs = ({\n  children,\n  defaultValue,\n  value,\n  onChange,\n  size = 'medium',\n  variant = 'bordered',\n  isFullWidthTabItem = false,\n  isLazy = false,\n}: TabsProps): React.ReactElement => {\n  const { theme } = useTheme();\n  const tabs = getTabs(children);\n  const panels = getTabPanels(children);\n  const routes = getRoutes(tabs);\n  const isFilled = variant === 'filled';\n\n  const [selectedValue, setSelectedValue] = useControllableState({\n    defaultValue,\n    value,\n    onChange: (value) => {\n      onChange?.(value);\n    },\n  });\n\n  const routeIndex = getRouteIndexFromValue({\n    value: selectedValue,\n    routes,\n  });\n\n  const setIndex = React.useCallback(\n    (index: number, skipUpdate = false) => {\n      const value = getRouteValueFromIndex({ index, routes });\n      // If skipUpdate is true, useControlledState will not call the onChange callback\n      // This is useful when we want to set the initial value\n      setSelectedValue(() => value, skipUpdate);\n    },\n    [routes, setSelectedValue],\n  );\n\n  // In mobile we can't have vertical tabs because of the lack of screen space\n  // So we always set it to false\n  const isVertical = false;\n  const contextValue = {\n    baseId: '',\n    selectedValue,\n    isVertical,\n    size,\n    variant,\n    isFullWidthTabItem,\n  };\n\n  // Set initial value\n  React.useLayoutEffect(() => {\n    if (selectedValue) return;\n    setIndex(0, true);\n  }, [selectedValue, setIndex]);\n\n  const renderTabLabel = React.useCallback(\n    ({\n      route,\n      focused,\n    }: {\n      route: { title: string; leading?: React.ComponentType<any>; trailing?: React.ReactNode };\n      focused: boolean;\n    }) => {\n      const { title, leading: Leading, trailing } = route;\n      const selectedState = focused ? 'selected' : 'unselected';\n      // eslint-disable-next-line react-hooks/rules-of-hooks\n      const validatedTrailingComponent = useTabsItemPropRestriction(trailing, size);\n\n      return (\n        <StyledTabButton\n          size={size}\n          variant={variant}\n          isFullWidthTabItem={!isFullWidthTabItem && !isFilled}\n          {...metaAttribute({ name: MetaConstants.TabItem })}\n        >\n          <Box display=\"flex\" alignItems=\"center\" flexDirection=\"row\" gap=\"spacing.3\">\n            {Leading ? (\n              <Leading size={iconSizeMap[size]} color={iconColor[selectedState].default} />\n            ) : null}\n            <Text\n              color={textColor[selectedState].default}\n              size={size === 'medium' ? 'medium' : 'large'}\n              weight=\"semibold\"\n            >\n              {title}\n            </Text>\n            {validatedTrailingComponent}\n          </Box>\n        </StyledTabButton>\n      );\n    },\n    [isFullWidthTabItem, isFilled, size, variant],\n  );\n\n  const renderTabBar = React.useCallback(\n    (props: any) => (\n      <TabBar\n        {...props}\n        {...metaAttribute({ name: MetaConstants.TabList })}\n        gap={0}\n        android_ripple={{ borderless: true, color: 'transparent' }}\n        scrollEnabled={!isFullWidthTabItem && !isFilled}\n        tabStyle={{\n          padding: 0,\n          margin: 0,\n          minHeight: 0,\n        }}\n        style={{\n          ...(isFilled\n            ? {\n                shadowOpacity: 0,\n                shadowColor: 'transparent',\n                borderRadius: theme.border.radius.small,\n                borderWidth: theme.border.width.thick,\n                borderColor: theme.colors.interactive.border.gray.faded,\n                backgroundColor: theme.colors.surface.background.gray.intense,\n                padding: theme.spacing[2],\n              }\n            : {\n                shadowOpacity: 0,\n                shadowColor: 'transparent',\n                backgroundColor: 'transparent',\n                ...(variant !== 'borderless' && {\n                  borderBottomColor: getIn(theme.colors, trackColor),\n                  borderBottomWidth: theme.border.width.thin,\n                }),\n              }),\n        }}\n        renderIndicator={TabIndicator}\n        renderLabel={renderTabLabel}\n        // This is a bit hacky, but this is the only way to put a divider between tabs\n        // Since there is no way to use tablist.map() to render the tabs\n        renderBadge={() => {\n          if (!isFilled) return null;\n          if (routeIndex === 0) {\n            return null;\n          }\n          return (\n            <Divider\n              left=\"1px\"\n              height=\"20px\"\n              variant=\"normal\"\n              orientation=\"vertical\"\n              // again, hacky but no way to get exact height of the tabbar\n              // Since we already know the height of large,medium size tabs, I just hardcode it here.\n              top={size === 'large' ? '6px' : '4px'}\n            />\n          );\n        }}\n      />\n    ),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [isFullWidthTabItem, isFilled, renderTabLabel],\n  );\n\n  return (\n    <TabsContext.Provider value={contextValue}>\n      <TabView\n        navigationState={{\n          index: routeIndex,\n          routes,\n        }}\n        renderScene={SafeSceneMap(panels)}\n        renderTabBar={renderTabBar}\n        onIndexChange={(idx) => {\n          setIndex(idx);\n        }}\n        initialLayout={initialLayout}\n        lazy={isLazy}\n      />\n    </TabsContext.Provider>\n  );\n};\n\nexport { Tabs };\n"],"names":["initialLayout","height","width","Dimensions","get","getTabs","node","children","React","Children","toArray","tabList","find","child","getComponentId","isValidElement","Error","props","getTabPanels","filter","reduce","prev","curr","Object","assign","_defineProperty","value","getRoutes","tabs","map","TabComponent","index","title","key","leading","trailing","getRouteIndexFromValue","_ref","routes","findIndex","route","getRouteValueFromIndex","_ref2","_routes$find","Tabs","_ref3","defaultValue","onChange","_ref3$size","size","_ref3$variant","variant","_ref3$isFullWidthTabI","isFullWidthTabItem","_ref3$isLazy","isLazy","_useTheme","useTheme","theme","panels","isFilled","_useControllableState","useControllableState","_useControllableState2","_slicedToArray","selectedValue","setSelectedValue","routeIndex","setIndex","useCallback","skipUpdate","arguments","length","undefined","isVertical","contextValue","baseId","useLayoutEffect","renderTabLabel","_ref4","focused","Leading","selectedState","validatedTrailingComponent","useTabsItemPropRestriction","_jsx","StyledTabButton","metaAttribute","name","MetaConstants","TabItem","_jsxs","Box","display","alignItems","flexDirection","gap","iconSizeMap","color","iconColor","default","Text","textColor","weight","renderTabBar","TabBar","TabList","android_ripple","borderless","scrollEnabled","tabStyle","padding","margin","minHeight","style","shadowOpacity","shadowColor","borderRadius","border","radius","small","borderWidth","thick","borderColor","colors","interactive","gray","faded","backgroundColor","surface","background","intense","spacing","borderBottomColor","getIn","trackColor","borderBottomWidth","thin","renderIndicator","TabIndicator","renderLabel","renderBadge","Divider","left","orientation","top","TabsContext","Provider","TabView","navigationState","renderScene","SafeSceneMap","onIndexChange","idx","lazy"],"mappings":"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"}