@razorpay/blade 11.8.2 → 11.9.0

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 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';\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> & {\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   */\n  icon?: IconComponent;\n\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\ntype TextInputKeyboardAndAutoComplete = Pick<\n  BaseInputProps,\n  'keyboardType' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType' | 'autoCapitalize'\n> & {\n  type: Type;\n};\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\nconst getKeyboardAndAutocompleteProps = ({\n  type = 'text',\n  keyboardReturnKeyType,\n  autoCompleteSuggestionType,\n  autoCapitalize,\n}: TextInputKeyboardAndAutoComplete): TextInputKeyboardAndAutoComplete => {\n  const keyboardAndAutocompleteProps: TextInputKeyboardAndAutoComplete = {\n    type,\n    keyboardType: 'text',\n    keyboardReturnKeyType: 'default',\n    autoCompleteSuggestionType: 'none',\n    autoCapitalize,\n  };\n\n  const keyboardConfigMap = {\n    text: {\n      keyboardType: 'text',\n      keyboardReturnKeyType: 'default',\n      autoCompleteSuggestionType: 'none',\n      autoCapitalize: undefined,\n    },\n    telephone: {\n      keyboardType: 'telephone',\n      keyboardReturnKeyType: 'done',\n      autoCompleteSuggestionType: 'telephone',\n      autoCapitalize: undefined,\n    },\n    email: {\n      keyboardType: 'email',\n      keyboardReturnKeyType: 'done',\n      autoCompleteSuggestionType: 'email',\n      autoCapitalize: 'none',\n    },\n    url: {\n      keyboardType: 'url',\n      keyboardReturnKeyType: 'go',\n      autoCompleteSuggestionType: 'none',\n      autoCapitalize: 'none',\n    },\n    number: {\n      keyboardType: 'decimal',\n      keyboardReturnKeyType: 'done',\n      autoCompleteSuggestionType: 'none',\n      autoCapitalize: undefined,\n    },\n    search: {\n      keyboardType: 'search',\n      keyboardReturnKeyType: 'search',\n      autoCompleteSuggestionType: 'none',\n      autoCapitalize: undefined,\n    },\n  } as const;\n\n  const keyboardConfig = keyboardConfigMap[type];\n\n  keyboardAndAutocompleteProps.keyboardType = keyboardConfig.keyboardType;\n\n  keyboardAndAutocompleteProps.keyboardReturnKeyType =\n    keyboardReturnKeyType ?? keyboardConfig.keyboardReturnKeyType;\n\n  keyboardAndAutocompleteProps.autoCompleteSuggestionType =\n    autoCompleteSuggestionType ?? keyboardConfig.autoCompleteSuggestionType;\n\n  keyboardAndAutocompleteProps.autoCapitalize = keyboardConfig.autoCapitalize;\n\n  if (type === 'number') {\n    /* the default keyboardType:numeric shows alphanumeric keyboard on iOS but number pad on android. making it type:text and keyboardType:decimal fixes this on all platforms.\n     * source: https://css-tricks.com/everything-you-ever-wanted-to-know-about-keyboardType/#aa-decimal\n     */\n    keyboardAndAutocompleteProps.type = 'text';\n  }\n\n  if (type === 'search') {\n    /* when input type:search is provided at that time browser adds a weird close button which collides with our clear button and then we have 2 clear buttons\n     * source: https://github.com/razorpay/blade/issues/857#issue-1457367160\n     */\n    keyboardAndAutocompleteProps.type = 'text';\n  }\n\n  return keyboardAndAutocompleteProps;\n};\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    ...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\" />;\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          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={icon}\n      prefix={prefix}\n      interactionElement={renderInteractionElement()}\n      suffix={suffix}\n      validationState={validationState}\n      errorText={errorText}\n      helpText={helpText}\n      successText={successText}\n      trailingFooterSlot={(value) => {\n        return maxCharacters ? (\n          <BaseBox marginTop=\"spacing.2\" marginRight=\"spacing.1\">\n            <CharacterCounter currentCount={value?.length ?? 0} maxCount={maxCharacters} />\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      {...styledProps}\n    />\n  );\n};\n\nconst TextInput = assignWithoutSideEffects(React.forwardRef(_TextInput), {\n  displayName: 'TextInput',\n});\n\nexport type { TextInputProps };\nexport { TextInput };\n"],"names":["getKeyboardAndAutocompleteProps","_ref","_ref$type","type","keyboardReturnKeyType","autoCompleteSuggestionType","autoCapitalize","keyboardAndAutocompleteProps","keyboardType","keyboardConfigMap","text","undefined","telephone","email","url","number","search","keyboardConfig","isReactNative","_textInputRef","getPlatformType","_TextInput","_ref2","ref","label","accessibilityLabel","_ref2$labelPosition","labelPosition","placeholder","_ref2$type","defaultValue","name","value","maxCharacters","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","icon","prefix","showClearButton","onClearButtonClick","isLoading","suffix","autoFocus","testID","styledProps","_objectWithoutProperties","_excluded","textInputRef","React","useRef","mergedRef","useMergeRefs","_useState","useState","_useState2","_slicedToArray","shouldShowClearButton","setShouldShowClearButton","useEffect","Boolean","renderInteractionElement","_jsx","Spinner","IconButton","size","CloseIcon","_textInputRef$current","isEmpty","current","clear","focus","HTMLInputElement","BaseInput","Object","assign","id","componentName","MetaConstants","TextInput","hideLabelText","_ref3","length","leadingIcon","interactionElement","trailingFooterSlot","_value$length","BaseBox","marginTop","marginRight","children","CharacterCounter","currentCount","maxCount","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 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\ntype TextInputKeyboardAndAutoComplete = Pick<\n  BaseInputProps,\n  'keyboardType' | 'keyboardReturnKeyType' | 'autoCompleteSuggestionType' | 'autoCapitalize'\n> & {\n  type: Type;\n};\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\nconst getKeyboardAndAutocompleteProps = ({\n  type = 'text',\n  keyboardReturnKeyType,\n  autoCompleteSuggestionType,\n  autoCapitalize,\n}: TextInputKeyboardAndAutoComplete): TextInputKeyboardAndAutoComplete => {\n  const keyboardAndAutocompleteProps: TextInputKeyboardAndAutoComplete = {\n    type,\n    keyboardType: 'text',\n    keyboardReturnKeyType: 'default',\n    autoCompleteSuggestionType: 'none',\n    autoCapitalize,\n  };\n\n  const keyboardConfigMap = {\n    text: {\n      keyboardType: 'text',\n      keyboardReturnKeyType: 'default',\n      autoCompleteSuggestionType: 'none',\n      autoCapitalize: undefined,\n    },\n    telephone: {\n      keyboardType: 'telephone',\n      keyboardReturnKeyType: 'done',\n      autoCompleteSuggestionType: 'telephone',\n      autoCapitalize: undefined,\n    },\n    email: {\n      keyboardType: 'email',\n      keyboardReturnKeyType: 'done',\n      autoCompleteSuggestionType: 'email',\n      autoCapitalize: 'none',\n    },\n    url: {\n      keyboardType: 'url',\n      keyboardReturnKeyType: 'go',\n      autoCompleteSuggestionType: 'none',\n      autoCapitalize: 'none',\n    },\n    number: {\n      keyboardType: 'decimal',\n      keyboardReturnKeyType: 'done',\n      autoCompleteSuggestionType: 'none',\n      autoCapitalize: undefined,\n    },\n    search: {\n      keyboardType: 'search',\n      keyboardReturnKeyType: 'search',\n      autoCompleteSuggestionType: 'none',\n      autoCapitalize: undefined,\n    },\n  } as const;\n\n  const keyboardConfig = keyboardConfigMap[type];\n\n  keyboardAndAutocompleteProps.keyboardType = keyboardConfig.keyboardType;\n\n  keyboardAndAutocompleteProps.keyboardReturnKeyType =\n    keyboardReturnKeyType ?? keyboardConfig.keyboardReturnKeyType;\n\n  keyboardAndAutocompleteProps.autoCompleteSuggestionType =\n    autoCompleteSuggestionType ?? keyboardConfig.autoCompleteSuggestionType;\n\n  keyboardAndAutocompleteProps.autoCapitalize = keyboardConfig.autoCapitalize;\n\n  if (type === 'number') {\n    /* the default keyboardType:numeric shows alphanumeric keyboard on iOS but number pad on android. making it type:text and keyboardType:decimal fixes this on all platforms.\n     * source: https://css-tricks.com/everything-you-ever-wanted-to-know-about-keyboardType/#aa-decimal\n     */\n    keyboardAndAutocompleteProps.type = 'text';\n  }\n\n  if (type === 'search') {\n    /* when input type:search is provided at that time browser adds a weird close button which collides with our clear button and then we have 2 clear buttons\n     * source: https://github.com/razorpay/blade/issues/857#issue-1457367160\n     */\n    keyboardAndAutocompleteProps.type = 'text';\n  }\n\n  return keyboardAndAutocompleteProps;\n};\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      interactionElement={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":["getKeyboardAndAutocompleteProps","_ref","_ref$type","type","keyboardReturnKeyType","autoCompleteSuggestionType","autoCapitalize","keyboardAndAutocompleteProps","keyboardType","keyboardConfigMap","text","undefined","telephone","email","url","number","search","keyboardConfig","isReactNative","_textInputRef","getPlatformType","_TextInput","_ref2","ref","label","accessibilityLabel","_ref2$labelPosition","labelPosition","placeholder","_ref2$type","defaultValue","name","value","maxCharacters","onChange","onClick","onFocus","onBlur","onSubmit","isDisabled","necessityIndicator","validationState","errorText","helpText","successText","isRequired","icon","prefix","showClearButton","onClearButtonClick","isLoading","suffix","autoFocus","testID","_ref2$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","_ref3","length","interactionElement","trailingFooterSlot","_value$length","BaseBox","marginTop","hintMarginTop","marginRight","children","CharacterCounter","currentCount","maxCount","assignWithoutSideEffects","forwardRef","displayName"],"mappings":"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"}

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

@@ -3,7 +3,7 @@ import React__default from 'react';
 import { useRadio } from './useRadio.js';
 import { RadioIcon } from './RadioIcon/RadioIcon.js';
 import { useRadioGroupContext } from './RadioGroup/RadioContext.js';
-import { radioHoverTokens } from './radioTokens.js';
+import { radioSizes, radioHoverTokens } from './radioTokens.js';
 import isEmpty from '../../utils/lodashButBetter/isEmpty.js';
 import { SelectorLabel } from '../Form/Selector/SelectorLabel.native.js';
 import { BaseBox } from '../Box/BaseBox/BaseBox.native.js';
@@ -17,13 +17,14 @@ import '../../tokens/global/typography.js';
 import '../../tokens/global/motion.js';
 import { getPlatformType } from '../../utils/getPlatformType/getPlatformType.js';
 import { throwBladeError } from '../../utils/logger/logger.js';
-import '../BladeProvider/useTheme.js';
+import { makeSize } from '../../utils/makeSize/makeSize.js';
+import useTheme from '../BladeProvider/useTheme.js';
 import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
 import '@babel/runtime/helpers/defineProperty';
 import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-var _excluded=["value","children","helpText","isDisabled","size","testID"];var _Radio=function _Radio(_ref,ref){var _groupProps$state,_groupProps$size;var value=_ref.value,children=_ref.children,helpText=_ref.helpText,isDisabled=_ref.isDisabled,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded);var groupProps=useRadioGroupContext();var isInsideGroup=!isEmpty(groupProps);if(__DEV__){if(!isInsideGroup){throwBladeError({moduleName:'Radio',message:'Cannot use <Radio /> outside of <RadioGroup />'});}}var isChecked=groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var defaultChecked=(groupProps==null?void 0:groupProps.defaultValue)===undefined?undefined:(groupProps==null?void 0:groupProps.defaultValue)===value;var validationState=groupProps==null?void 0:groupProps.validationState;var hasError=validationState==='error';var _isDisabled=isDisabled!=null?isDisabled:groupProps==null?void 0:groupProps.isDisabled;var _isRequired=(groupProps==null?void 0:groupProps.isRequired)||(groupProps==null?void 0:groupProps.necessityIndicator)==='required';var name=groupProps==null?void 0:groupProps.name;var showHelpText=!hasError&&helpText;var isReactNative=getPlatformType()==='react-native';var _size=(_groupProps$size=groupProps.size)!=null?_groupProps$size:size;var isSmall=_size==='small';var handleChange=function handleChange(_ref2){var isChecked=_ref2.isChecked,value=_ref2.value;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.setValue(value);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue();}};var _useRadio=useRadio({defaultChecked:defaultChecked,isChecked:isChecked,hasError:hasError,isDisabled:_isDisabled,isRequired:_isRequired,name:name,value:value,onChange:handleChange}),state=_useRadio.state,ids=_useRadio.ids,inputProps=_useRadio.inputProps;return jsx(BaseBox,Object.assign({},getStyledProps(styledProps),{children:jsx(SelectorLabel,{componentName:MetaConstants.RadioLabel,inputProps:isReactNative?inputProps:{},testID:testID,children:jsxs(BaseBox,{display:"flex",flexDirection:"column",children:[jsxs(BaseBox,{display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(SelectorInput,{hoverTokens:radioHoverTokens,isChecked:state.isChecked,isDisabled:_isDisabled,hasError:hasError,inputProps:inputProps,ref:ref}),jsx(RadioIcon,{size:_size,isChecked:state.isChecked,isDisabled:_isDisabled,isNegative:hasError}),children?jsx(SelectorTitle,{size:_size,isDisabled:_isDisabled,children:children}):null]}),showHelpText&&jsx(BaseBox,{marginLeft:isSmall?'spacing.6':'spacing.7',children:jsx(SelectorSupportText,{isNegative:true,id:ids==null?void 0:ids.helpTextId,children:helpText})})]})})}));};var Radio=assignWithoutSideEffects(React__default.forwardRef(_Radio),{displayName:'Radio'});
+var _excluded=["value","children","helpText","isDisabled","size","testID"];var _Radio=function _Radio(_ref,ref){var _groupProps$state,_groupProps$size;var value=_ref.value,children=_ref.children,helpText=_ref.helpText,isDisabled=_ref.isDisabled,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded);var _useTheme=useTheme(),theme=_useTheme.theme;var groupProps=useRadioGroupContext();var isInsideGroup=!isEmpty(groupProps);if(__DEV__){if(!isInsideGroup){throwBladeError({moduleName:'Radio',message:'Cannot use <Radio /> outside of <RadioGroup />'});}}var isChecked=groupProps==null?void 0:(_groupProps$state=groupProps.state)==null?void 0:_groupProps$state.isChecked(value);var defaultChecked=(groupProps==null?void 0:groupProps.defaultValue)===undefined?undefined:(groupProps==null?void 0:groupProps.defaultValue)===value;var validationState=groupProps==null?void 0:groupProps.validationState;var hasError=validationState==='error';var _isDisabled=isDisabled!=null?isDisabled:groupProps==null?void 0:groupProps.isDisabled;var _isRequired=(groupProps==null?void 0:groupProps.isRequired)||(groupProps==null?void 0:groupProps.necessityIndicator)==='required';var name=groupProps==null?void 0:groupProps.name;var showHelpText=!hasError&&helpText;var isReactNative=getPlatformType()==='react-native';var _size=(_groupProps$size=groupProps.size)!=null?_groupProps$size:size;var handleChange=function handleChange(_ref2){var isChecked=_ref2.isChecked,value=_ref2.value;if(isChecked){var _groupProps$state2;groupProps==null?void 0:(_groupProps$state2=groupProps.state)==null?void 0:_groupProps$state2.setValue(value);}else {var _groupProps$state3;groupProps==null?void 0:(_groupProps$state3=groupProps.state)==null?void 0:_groupProps$state3.removeValue();}};var _useRadio=useRadio({defaultChecked:defaultChecked,isChecked:isChecked,hasError:hasError,isDisabled:_isDisabled,isRequired:_isRequired,name:name,value:value,onChange:handleChange}),state=_useRadio.state,ids=_useRadio.ids,inputProps=_useRadio.inputProps;var helpTextLeftSpacing=makeSize(radioSizes.icon[size].width+theme.spacing[3]);return jsx(BaseBox,Object.assign({},getStyledProps(styledProps),{children:jsx(SelectorLabel,{componentName:MetaConstants.RadioLabel,inputProps:isReactNative?inputProps:{},testID:testID,children:jsxs(BaseBox,{display:"flex",flexDirection:"column",children:[jsxs(BaseBox,{display:"flex",alignItems:"center",flexDirection:"row",children:[jsx(SelectorInput,{hoverTokens:radioHoverTokens,isChecked:state.isChecked,isDisabled:_isDisabled,hasError:hasError,inputProps:inputProps,ref:ref}),jsx(RadioIcon,{size:_size,isChecked:state.isChecked,isDisabled:_isDisabled,isNegative:hasError}),children?jsx(SelectorTitle,{size:_size,isDisabled:_isDisabled,children:children}):null]}),showHelpText&&jsx(BaseBox,{marginLeft:helpTextLeftSpacing,children:jsx(SelectorSupportText,{size:_size,isNegative:true,id:ids==null?void 0:ids.helpTextId,children:helpText})})]})})}));};var Radio=assignWithoutSideEffects(React__default.forwardRef(_Radio),{displayName:'Radio'});
 
 export { Radio };
 //# sourceMappingURL=Radio.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Radio.js","sources":["../../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-shadow */\nimport React from 'react';\nimport type { OnChange } from './useRadio';\nimport { useRadio } from './useRadio';\nimport { RadioIcon } from './RadioIcon/RadioIcon';\nimport { useRadioGroupContext } from './RadioGroup/RadioContext';\nimport { radioHoverTokens } from './radioTokens';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorTitle } from '~components/Form/Selector/SelectorTitle';\nimport { SelectorSupportText } from '~components/Form/Selector/SelectorSupportText';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { BladeElementRef, StringChildrenType, TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getPlatformType } from '~utils';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { throwBladeError } from '~utils/logger';\n\ntype RadioProps = {\n  /**\n   * Sets the label text of the Radio\n   */\n  children?: StringChildrenType;\n  /**\n   * Help text for the Radio\n   */\n  helpText?: string;\n  /**\n   * The value to be used in the Radio input.\n   * This is the value that will be returned on form submission.\n   */\n  value: string;\n  /**\n   * If `true`, the Radio will be disabled\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Size of the radios\n   *\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium';\n} & TestID &\n  StyledPropsBlade;\n\nconst _Radio: React.ForwardRefRenderFunction<BladeElementRef, RadioProps> = (\n  { value, children, helpText, isDisabled, size = 'medium', testID, ...styledProps },\n  ref,\n) => {\n  const groupProps = useRadioGroupContext();\n  const isInsideGroup = !isEmpty(groupProps);\n\n  if (__DEV__) {\n    if (!isInsideGroup) {\n      throwBladeError({\n        moduleName: 'Radio',\n        message: 'Cannot use <Radio /> outside of <RadioGroup />',\n      });\n    }\n  }\n\n  const isChecked = groupProps?.state?.isChecked(value);\n  const defaultChecked =\n    groupProps?.defaultValue === undefined ? undefined : groupProps?.defaultValue === value;\n  const validationState = groupProps?.validationState;\n  const hasError = validationState === 'error';\n  const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n  const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n  const name = groupProps?.name;\n  const showHelpText = !hasError && helpText;\n  const isReactNative = getPlatformType() === 'react-native';\n  const _size = groupProps.size ?? size;\n  const isSmall = _size === 'small';\n\n  const handleChange: OnChange = ({ isChecked, value }) => {\n    if (isChecked) {\n      groupProps?.state?.setValue(value!);\n    } else {\n      groupProps?.state?.removeValue();\n    }\n  };\n\n  const { state, ids, inputProps } = useRadio({\n    defaultChecked,\n    isChecked,\n    hasError,\n    isDisabled: _isDisabled,\n    isRequired: _isRequired,\n    name,\n    value,\n    onChange: handleChange,\n  });\n\n  return (\n    <BaseBox {...getStyledProps(styledProps)}>\n      <SelectorLabel\n        componentName={MetaConstants.RadioLabel}\n        inputProps={isReactNative ? inputProps : {}}\n        testID={testID}\n      >\n        <BaseBox display=\"flex\" flexDirection=\"column\">\n          <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n            <SelectorInput\n              hoverTokens={radioHoverTokens}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              hasError={hasError}\n              inputProps={inputProps}\n              ref={ref}\n            />\n            <RadioIcon\n              size={_size}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              isNegative={hasError}\n            />\n            {children ? (\n              <SelectorTitle size={_size} isDisabled={_isDisabled}>\n                {children}\n              </SelectorTitle>\n            ) : null}\n          </BaseBox>\n          {showHelpText && (\n            <BaseBox marginLeft={isSmall ? 'spacing.6' : 'spacing.7'}>\n              <SelectorSupportText isNegative={true} id={ids?.helpTextId}>\n                {helpText}\n              </SelectorSupportText>\n            </BaseBox>\n          )}\n        </BaseBox>\n      </SelectorLabel>\n    </BaseBox>\n  );\n};\n\nconst Radio = assignWithoutSideEffects(React.forwardRef(_Radio), { displayName: 'Radio' });\n\nexport type { RadioProps };\nexport { Radio };\n"],"names":["_Radio","_ref","ref","_groupProps$state","_groupProps$size","value","children","helpText","isDisabled","_ref$size","size","testID","styledProps","_objectWithoutProperties","_excluded","groupProps","useRadioGroupContext","isInsideGroup","isEmpty","__DEV__","throwBladeError","moduleName","message","isChecked","state","defaultChecked","defaultValue","undefined","validationState","hasError","_isDisabled","_isRequired","isRequired","necessityIndicator","name","showHelpText","isReactNative","getPlatformType","_size","isSmall","handleChange","_ref2","_groupProps$state2","setValue","_groupProps$state3","removeValue","_useRadio","useRadio","onChange","ids","inputProps","_jsx","BaseBox","Object","assign","getStyledProps","SelectorLabel","componentName","MetaConstants","RadioLabel","_jsxs","display","flexDirection","alignItems","SelectorInput","hoverTokens","radioHoverTokens","RadioIcon","isNegative","SelectorTitle","marginLeft","SelectorSupportText","id","helpTextId","Radio","assignWithoutSideEffects","React","forwardRef","displayName"],"mappings":"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"}
+{"version":3,"file":"Radio.js","sources":["../../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\n/* eslint-disable @typescript-eslint/no-shadow */\nimport React from 'react';\nimport type { OnChange } from './useRadio';\nimport { useRadio } from './useRadio';\nimport { RadioIcon } from './RadioIcon/RadioIcon';\nimport { useRadioGroupContext } from './RadioGroup/RadioContext';\nimport { radioHoverTokens, radioSizes } from './radioTokens';\nimport isEmpty from '~utils/lodashButBetter/isEmpty';\nimport { SelectorLabel } from '~components/Form/Selector/SelectorLabel';\nimport BaseBox from '~components/Box/BaseBox';\nimport { SelectorTitle } from '~components/Form/Selector/SelectorTitle';\nimport { SelectorSupportText } from '~components/Form/Selector/SelectorSupportText';\nimport { SelectorInput } from '~components/Form/Selector/SelectorInput';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { BladeElementRef, StringChildrenType, TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { getPlatformType, makeSize, useTheme } from '~utils';\nimport { MetaConstants } from '~utils/metaAttribute';\nimport { throwBladeError } from '~utils/logger';\n\ntype RadioProps = {\n  /**\n   * Sets the label text of the Radio\n   */\n  children?: StringChildrenType;\n  /**\n   * Help text for the Radio\n   */\n  helpText?: string;\n  /**\n   * The value to be used in the Radio input.\n   * This is the value that will be returned on form submission.\n   */\n  value: string;\n  /**\n   * If `true`, the Radio will be disabled\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Size of the radios\n   *\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium' | 'large';\n} & TestID &\n  StyledPropsBlade;\n\nconst _Radio: React.ForwardRefRenderFunction<BladeElementRef, RadioProps> = (\n  { value, children, helpText, isDisabled, size = 'medium', testID, ...styledProps },\n  ref,\n) => {\n  const { theme } = useTheme();\n  const groupProps = useRadioGroupContext();\n  const isInsideGroup = !isEmpty(groupProps);\n\n  if (__DEV__) {\n    if (!isInsideGroup) {\n      throwBladeError({\n        moduleName: 'Radio',\n        message: 'Cannot use <Radio /> outside of <RadioGroup />',\n      });\n    }\n  }\n\n  const isChecked = groupProps?.state?.isChecked(value);\n  const defaultChecked =\n    groupProps?.defaultValue === undefined ? undefined : groupProps?.defaultValue === value;\n  const validationState = groupProps?.validationState;\n  const hasError = validationState === 'error';\n  const _isDisabled = isDisabled ?? groupProps?.isDisabled;\n  const _isRequired = groupProps?.isRequired || groupProps?.necessityIndicator === 'required';\n  const name = groupProps?.name;\n  const showHelpText = !hasError && helpText;\n  const isReactNative = getPlatformType() === 'react-native';\n  const _size = groupProps.size ?? size;\n\n  const handleChange: OnChange = ({ isChecked, value }) => {\n    if (isChecked) {\n      groupProps?.state?.setValue(value!);\n    } else {\n      groupProps?.state?.removeValue();\n    }\n  };\n\n  const { state, ids, inputProps } = useRadio({\n    defaultChecked,\n    isChecked,\n    hasError,\n    isDisabled: _isDisabled,\n    isRequired: _isRequired,\n    name,\n    value,\n    onChange: handleChange,\n  });\n\n  // radio icon's size & margin + margin-left of SelectorTitle which is 2\n  const helpTextLeftSpacing = makeSize(radioSizes.icon[size].width + theme.spacing[3]);\n\n  return (\n    <BaseBox {...getStyledProps(styledProps)}>\n      <SelectorLabel\n        componentName={MetaConstants.RadioLabel}\n        inputProps={isReactNative ? inputProps : {}}\n        testID={testID}\n      >\n        <BaseBox display=\"flex\" flexDirection=\"column\">\n          <BaseBox display=\"flex\" alignItems=\"center\" flexDirection=\"row\">\n            <SelectorInput\n              hoverTokens={radioHoverTokens}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              hasError={hasError}\n              inputProps={inputProps}\n              ref={ref}\n            />\n            <RadioIcon\n              size={_size}\n              isChecked={state.isChecked}\n              isDisabled={_isDisabled}\n              isNegative={hasError}\n            />\n            {children ? (\n              <SelectorTitle size={_size} isDisabled={_isDisabled}>\n                {children}\n              </SelectorTitle>\n            ) : null}\n          </BaseBox>\n          {showHelpText && (\n            <BaseBox marginLeft={helpTextLeftSpacing}>\n              <SelectorSupportText size={_size} isNegative={true} id={ids?.helpTextId}>\n                {helpText}\n              </SelectorSupportText>\n            </BaseBox>\n          )}\n        </BaseBox>\n      </SelectorLabel>\n    </BaseBox>\n  );\n};\n\nconst Radio = assignWithoutSideEffects(React.forwardRef(_Radio), { displayName: 'Radio' });\n\nexport type { RadioProps };\nexport { Radio };\n"],"names":["_Radio","_ref","ref","_groupProps$state","_groupProps$size","value","children","helpText","isDisabled","_ref$size","size","testID","styledProps","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","groupProps","useRadioGroupContext","isInsideGroup","isEmpty","__DEV__","throwBladeError","moduleName","message","isChecked","state","defaultChecked","defaultValue","undefined","validationState","hasError","_isDisabled","_isRequired","isRequired","necessityIndicator","name","showHelpText","isReactNative","getPlatformType","_size","handleChange","_ref2","_groupProps$state2","setValue","_groupProps$state3","removeValue","_useRadio","useRadio","onChange","ids","inputProps","helpTextLeftSpacing","makeSize","radioSizes","icon","width","spacing","_jsx","BaseBox","Object","assign","getStyledProps","SelectorLabel","componentName","MetaConstants","RadioLabel","_jsxs","display","flexDirection","alignItems","SelectorInput","hoverTokens","radioHoverTokens","RadioIcon","isNegative","SelectorTitle","marginLeft","SelectorSupportText","id","helpTextId","Radio","assignWithoutSideEffects","React","forwardRef","displayName"],"mappings":"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"}

package/build/lib/native/components/Radio/RadioGroup/RadioGroup.js

@@ -21,7 +21,7 @@ import 'react-native-gesture-handler';
 import '../../BottomSheet/BottomSheetStack.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-var _excluded=["children","label","helpText","isDisabled","isRequired","necessityIndicator","labelPosition","validationState","errorText","name","defaultValue","onChange","value","size","testID"];var RadioGroup=function RadioGroup(_ref){var children=_ref.children,label=_ref.label,helpText=_ref.helpText,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,_ref$isRequired=_ref.isRequired,isRequired=_ref$isRequired===void 0?false:_ref$isRequired,_ref$necessityIndicat=_ref.necessityIndicator,necessityIndicator=_ref$necessityIndicat===void 0?'none':_ref$necessityIndicat,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,_ref$validationState=_ref.validationState,validationState=_ref$validationState===void 0?'none':_ref$validationState,errorText=_ref.errorText,name=_ref.name,defaultValue=_ref.defaultValue,onChange=_ref.onChange,value=_ref.value,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded);var _useRadioGroup=useRadioGroup({defaultValue:defaultValue,isDisabled:isDisabled,isRequired:isRequired,labelPosition:labelPosition,name:name,necessityIndicator:necessityIndicator,onChange:onChange,validationState:validationState,value:value,size:size}),contextValue=_useRadioGroup.contextValue,ids=_useRadioGroup.ids;var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;var showError=validationState==='error'&&errorText;var showHelpText=!showError&&helpText;var accessibilityText=`${showError?errorText:''} ${showHelpText?helpText:''}`.trim();var gap=radioSizes.group.gap[size][matchedDeviceType];var childCount=React__default.Children.count(children);return jsx(RadioGroupProvider,{value:contextValue,children:jsx(BaseBox,Object.assign({},getStyledProps(styledProps),{children:jsxs(SelectorGroupField,{position:labelPosition,labelledBy:ids.labelId,accessibilityRole:"radiogroup",componentName:"radio-group",testID:testID,children:[label?jsx(FormLabel,{as:"span",necessityIndicator:necessityIndicator,position:labelPosition,id:ids.labelId,accessibilityText:accessibilityText&&`,${accessibilityText}`,children:label}):null,jsxs(BaseBox,{children:[jsx(BaseBox,{display:"flex",flexDirection:"column",children:React__default.Children.map(children,function(child,index){return jsx(BaseBox,{marginBottom:index===childCount-1?makeSize(0):gap,children:child},index);})}),jsx(FormHint,{type:validationState==='error'?'error':'help',errorText:errorText,helpText:helpText})]})]})}))});};
+var _excluded=["children","label","helpText","isDisabled","isRequired","necessityIndicator","labelPosition","validationState","errorText","name","defaultValue","onChange","value","size","testID"];var RadioGroup=function RadioGroup(_ref){var children=_ref.children,label=_ref.label,helpText=_ref.helpText,_ref$isDisabled=_ref.isDisabled,isDisabled=_ref$isDisabled===void 0?false:_ref$isDisabled,_ref$isRequired=_ref.isRequired,isRequired=_ref$isRequired===void 0?false:_ref$isRequired,_ref$necessityIndicat=_ref.necessityIndicator,necessityIndicator=_ref$necessityIndicat===void 0?'none':_ref$necessityIndicat,_ref$labelPosition=_ref.labelPosition,labelPosition=_ref$labelPosition===void 0?'top':_ref$labelPosition,_ref$validationState=_ref.validationState,validationState=_ref$validationState===void 0?'none':_ref$validationState,errorText=_ref.errorText,name=_ref.name,defaultValue=_ref.defaultValue,onChange=_ref.onChange,value=_ref.value,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size,testID=_ref.testID,styledProps=_objectWithoutProperties(_ref,_excluded);var _useRadioGroup=useRadioGroup({defaultValue:defaultValue,isDisabled:isDisabled,isRequired:isRequired,labelPosition:labelPosition,name:name,necessityIndicator:necessityIndicator,onChange:onChange,validationState:validationState,value:value,size:size}),contextValue=_useRadioGroup.contextValue,ids=_useRadioGroup.ids;var _useTheme=useTheme(),theme=_useTheme.theme;var _useBreakpoint=useBreakpoint({breakpoints:theme.breakpoints}),matchedDeviceType=_useBreakpoint.matchedDeviceType;var showError=validationState==='error'&&errorText;var showHelpText=!showError&&helpText;var accessibilityText=`${showError?errorText:''} ${showHelpText?helpText:''}`.trim();var gap=radioSizes.group.gap[size][matchedDeviceType];var childCount=React__default.Children.count(children);return jsx(RadioGroupProvider,{value:contextValue,children:jsx(BaseBox,Object.assign({},getStyledProps(styledProps),{children:jsxs(SelectorGroupField,{position:labelPosition,labelledBy:ids.labelId,accessibilityRole:"radiogroup",componentName:"radio-group",testID:testID,children:[label?jsx(FormLabel,{as:"span",necessityIndicator:necessityIndicator,position:labelPosition,id:ids.labelId,accessibilityText:accessibilityText&&`,${accessibilityText}`,size:size,children:label}):null,jsxs(BaseBox,{children:[jsx(BaseBox,{display:"flex",flexDirection:"column",children:React__default.Children.map(children,function(child,index){return jsx(BaseBox,{marginBottom:index===childCount-1?makeSize(0):gap,children:child},index);})}),jsx(FormHint,{size:size,type:validationState==='error'?'error':'help',errorText:errorText,helpText:helpText})]})]})}))});};
 
 export { RadioGroup };
 //# sourceMappingURL=RadioGroup.js.map

package/build/lib/native/components/Radio/RadioGroup/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","sources":["../../../../../../src/components/Radio/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { radioSizes } from '../radioTokens';\nimport { RadioGroupProvider } from './RadioContext';\nimport { useRadioGroup } from './useRadioGroup';\nimport BaseBox from '~components/Box/BaseBox';\nimport { FormHint, FormLabel } from '~components/Form';\nimport { SelectorGroupField } from '~components/Form/Selector/SelectorGroupField';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { useBreakpoint } from '~utils';\nimport { useTheme } from '~components/BladeProvider';\nimport type { TestID } from '~utils/types';\nimport { makeSize } from '~utils/makeSize';\n\ntype RadioGroupProps = {\n  /**\n   * Accepts multiple radios as children\n   */\n  children: React.ReactNode;\n  /**\n   * Help text of the radio group\n   */\n  helpText?: string;\n  /**\n   * Error text of the radio group\n   * Renders when `validationState` is set to 'error'\n   *\n   * Overrides helpText\n   */\n  errorText?: string;\n  /**\n   * Sets the error state of the radioGroup\n   * If set to `error` it will render the `errorText` of the group,\n   * and propagate `invalid` prop to every radio\n   */\n  validationState?: 'error' | 'none';\n  /**\n   * Renders a necessity indicator after radioGroup label\n   *\n   * If set to `undefined` it renders nothing.\n   */\n  necessityIndicator?: 'required' | 'optional' | 'none';\n  /**\n   * Sets the disabled state of the radioGroup\n   * If set to `true` it propagate down to all the radios\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Sets the required state of the radioGroup\n   * @default false\n   */\n  isRequired?: boolean;\n  /**\n   * Renders the label of the radio group\n   */\n  label?: string;\n  /**\n   * Sets the position of the label\n   *\n   * @default 'top'\n   */\n  labelPosition?: 'top' | 'left';\n  /**\n   * Initial value of the radio group\n   */\n  defaultValue?: string;\n  /**\n   * value of the radio group\n   *\n   * Use `onChange` to update its value\n   */\n  value?: string;\n  /**\n   * The callback invoked when any of the radio's state changes\n   */\n  onChange?: ({ name, value }: { name: string | undefined; value: string }) => void;\n  /**\n   * The name of the input field in a radio\n   * (Useful for form submission).\n   */\n  name?: string;\n  /**\n   * Size of the radios\n   *\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium';\n} & TestID &\n  StyledPropsBlade;\n\nconst RadioGroup = ({\n  children,\n  label,\n  helpText,\n  isDisabled = false,\n  isRequired = false,\n  necessityIndicator = 'none',\n  labelPosition = 'top',\n  validationState = 'none',\n  errorText,\n  name,\n  defaultValue,\n  onChange,\n  value,\n  size = 'medium',\n  testID,\n  ...styledProps\n}: RadioGroupProps): React.ReactElement => {\n  const { contextValue, ids } = useRadioGroup({\n    defaultValue,\n    isDisabled,\n    isRequired,\n    labelPosition,\n    name,\n    necessityIndicator,\n    onChange,\n    validationState,\n    value,\n    size,\n  });\n\n  const { theme } = useTheme();\n  const { matchedDeviceType } = useBreakpoint({ breakpoints: theme.breakpoints });\n  const showError = validationState === 'error' && errorText;\n  const showHelpText = !showError && helpText;\n  const accessibilityText = `${showError ? errorText : ''} ${showHelpText ? helpText : ''}`.trim();\n  const gap = radioSizes.group.gap[size][matchedDeviceType];\n  const childCount = React.Children.count(children);\n\n  return (\n    <RadioGroupProvider value={contextValue}>\n      <BaseBox {...getStyledProps(styledProps)}>\n        <SelectorGroupField\n          position={labelPosition}\n          labelledBy={ids.labelId}\n          accessibilityRole=\"radiogroup\"\n          componentName=\"radio-group\"\n          testID={testID}\n        >\n          {label ? (\n            <FormLabel\n              as=\"span\"\n              necessityIndicator={necessityIndicator}\n              position={labelPosition}\n              id={ids.labelId}\n              accessibilityText={accessibilityText && `,${accessibilityText}`}\n            >\n              {label}\n            </FormLabel>\n          ) : null}\n          <BaseBox>\n            <BaseBox display=\"flex\" flexDirection=\"column\">\n              {React.Children.map(children, (child, index) => {\n                return (\n                  <BaseBox\n                    key={index}\n                    {...{ marginBottom: index === childCount - 1 ? makeSize(0) : gap }}\n                  >\n                    {child}\n                  </BaseBox>\n                );\n              })}\n            </BaseBox>\n            <FormHint\n              type={validationState === 'error' ? 'error' : 'help'}\n              errorText={errorText}\n              helpText={helpText}\n            />\n          </BaseBox>\n        </SelectorGroupField>\n      </BaseBox>\n    </RadioGroupProvider>\n  );\n};\n\nexport type { RadioGroupProps };\nexport { RadioGroup };\n"],"names":["RadioGroup","_ref","children","label","helpText","_ref$isDisabled","isDisabled","_ref$isRequired","isRequired","_ref$necessityIndicat","necessityIndicator","_ref$labelPosition","labelPosition","_ref$validationState","validationState","errorText","name","defaultValue","onChange","value","_ref$size","size","testID","styledProps","_objectWithoutProperties","_excluded","_useRadioGroup","useRadioGroup","contextValue","ids","_useTheme","useTheme","theme","_useBreakpoint","useBreakpoint","breakpoints","matchedDeviceType","showError","showHelpText","accessibilityText","trim","gap","radioSizes","group","childCount","React","Children","count","_jsx","RadioGroupProvider","BaseBox","Object","assign","getStyledProps","_jsxs","SelectorGroupField","position","labelledBy","labelId","accessibilityRole","componentName","FormLabel","as","id","display","flexDirection","map","child","index","marginBottom","makeSize","FormHint","type"],"mappings":"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"}
+{"version":3,"file":"RadioGroup.js","sources":["../../../../../../src/components/Radio/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { radioSizes } from '../radioTokens';\nimport { RadioGroupProvider } from './RadioContext';\nimport { useRadioGroup } from './useRadioGroup';\nimport BaseBox from '~components/Box/BaseBox';\nimport { FormHint, FormLabel } from '~components/Form';\nimport { SelectorGroupField } from '~components/Form/Selector/SelectorGroupField';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { useBreakpoint } from '~utils';\nimport { useTheme } from '~components/BladeProvider';\nimport type { TestID } from '~utils/types';\nimport { makeSize } from '~utils/makeSize';\n\ntype RadioGroupProps = {\n  /**\n   * Accepts multiple radios as children\n   */\n  children: React.ReactNode;\n  /**\n   * Help text of the radio group\n   */\n  helpText?: string;\n  /**\n   * Error text of the radio group\n   * Renders when `validationState` is set to 'error'\n   *\n   * Overrides helpText\n   */\n  errorText?: string;\n  /**\n   * Sets the error state of the radioGroup\n   * If set to `error` it will render the `errorText` of the group,\n   * and propagate `invalid` prop to every radio\n   */\n  validationState?: 'error' | 'none';\n  /**\n   * Renders a necessity indicator after radioGroup label\n   *\n   * If set to `undefined` it renders nothing.\n   */\n  necessityIndicator?: 'required' | 'optional' | 'none';\n  /**\n   * Sets the disabled state of the radioGroup\n   * If set to `true` it propagate down to all the radios\n   *\n   * @default false\n   */\n  isDisabled?: boolean;\n  /**\n   * Sets the required state of the radioGroup\n   * @default false\n   */\n  isRequired?: boolean;\n  /**\n   * Renders the label of the radio group\n   */\n  label?: string;\n  /**\n   * Sets the position of the label\n   *\n   * @default 'top'\n   */\n  labelPosition?: 'top' | 'left';\n  /**\n   * Initial value of the radio group\n   */\n  defaultValue?: string;\n  /**\n   * value of the radio group\n   *\n   * Use `onChange` to update its value\n   */\n  value?: string;\n  /**\n   * The callback invoked when any of the radio's state changes\n   */\n  onChange?: ({ name, value }: { name: string | undefined; value: string }) => void;\n  /**\n   * The name of the input field in a radio\n   * (Useful for form submission).\n   */\n  name?: string;\n  /**\n   * Size of the radios\n   *\n   * @default \"medium\"\n   */\n  size?: 'small' | 'medium' | 'large';\n} & TestID &\n  StyledPropsBlade;\n\nconst RadioGroup = ({\n  children,\n  label,\n  helpText,\n  isDisabled = false,\n  isRequired = false,\n  necessityIndicator = 'none',\n  labelPosition = 'top',\n  validationState = 'none',\n  errorText,\n  name,\n  defaultValue,\n  onChange,\n  value,\n  size = 'medium',\n  testID,\n  ...styledProps\n}: RadioGroupProps): React.ReactElement => {\n  const { contextValue, ids } = useRadioGroup({\n    defaultValue,\n    isDisabled,\n    isRequired,\n    labelPosition,\n    name,\n    necessityIndicator,\n    onChange,\n    validationState,\n    value,\n    size,\n  });\n\n  const { theme } = useTheme();\n  const { matchedDeviceType } = useBreakpoint({ breakpoints: theme.breakpoints });\n  const showError = validationState === 'error' && errorText;\n  const showHelpText = !showError && helpText;\n  const accessibilityText = `${showError ? errorText : ''} ${showHelpText ? helpText : ''}`.trim();\n  const gap = radioSizes.group.gap[size][matchedDeviceType];\n  const childCount = React.Children.count(children);\n\n  return (\n    <RadioGroupProvider value={contextValue}>\n      <BaseBox {...getStyledProps(styledProps)}>\n        <SelectorGroupField\n          position={labelPosition}\n          labelledBy={ids.labelId}\n          accessibilityRole=\"radiogroup\"\n          componentName=\"radio-group\"\n          testID={testID}\n        >\n          {label ? (\n            <FormLabel\n              as=\"span\"\n              necessityIndicator={necessityIndicator}\n              position={labelPosition}\n              id={ids.labelId}\n              accessibilityText={accessibilityText && `,${accessibilityText}`}\n              size={size}\n            >\n              {label}\n            </FormLabel>\n          ) : null}\n          <BaseBox>\n            <BaseBox display=\"flex\" flexDirection=\"column\">\n              {React.Children.map(children, (child, index) => {\n                return (\n                  <BaseBox\n                    key={index}\n                    {...{ marginBottom: index === childCount - 1 ? makeSize(0) : gap }}\n                  >\n                    {child}\n                  </BaseBox>\n                );\n              })}\n            </BaseBox>\n            <FormHint\n              size={size}\n              type={validationState === 'error' ? 'error' : 'help'}\n              errorText={errorText}\n              helpText={helpText}\n            />\n          </BaseBox>\n        </SelectorGroupField>\n      </BaseBox>\n    </RadioGroupProvider>\n  );\n};\n\nexport type { RadioGroupProps };\nexport { RadioGroup };\n"],"names":["RadioGroup","_ref","children","label","helpText","_ref$isDisabled","isDisabled","_ref$isRequired","isRequired","_ref$necessityIndicat","necessityIndicator","_ref$labelPosition","labelPosition","_ref$validationState","validationState","errorText","name","defaultValue","onChange","value","_ref$size","size","testID","styledProps","_objectWithoutProperties","_excluded","_useRadioGroup","useRadioGroup","contextValue","ids","_useTheme","useTheme","theme","_useBreakpoint","useBreakpoint","breakpoints","matchedDeviceType","showError","showHelpText","accessibilityText","trim","gap","radioSizes","group","childCount","React","Children","count","_jsx","RadioGroupProvider","BaseBox","Object","assign","getStyledProps","_jsxs","SelectorGroupField","position","labelledBy","labelId","accessibilityRole","componentName","FormLabel","as","id","display","flexDirection","map","child","index","marginBottom","makeSize","FormHint","type"],"mappings":"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"}

package/build/lib/native/components/Radio/radioTokens.js

@@ -2,7 +2,7 @@ import '../../tokens/global/typography.js';
 import '../../tokens/global/motion.js';
 import { size } from '../../tokens/global/size.js';
 
-var radioSizes={group:{gap:{small:{mobile:'spacing.2',desktop:'spacing.0'},medium:{mobile:'spacing.3',desktop:'spacing.2'}}},icon:{small:{width:size[12],height:size[12],dotRadius:size[2]},medium:{width:size[16],height:size[16],dotRadius:size[3]}}};var radioIconColors={variants:{default:{dot:{checked:'colors.interactive.icon.onPrimary.normal',unchecked:'colors.transparent'},border:{checked:'colors.interactive.border.primary.default',unchecked:'colors.interactive.border.gray.default'},background:{checked:'colors.interactive.background.primary.default',unchecked:'colors.transparent'}},disabled:{dot:{checked:'colors.interactive.icon.onPrimary.normal',unchecked:'colors.interactive.icon.onPrimary.normal'},border:{checked:'colors.transparent',unchecked:'colors.interactive.border.gray.disabled'},background:{checked:'colors.interactive.background.primary.disabled',unchecked:'colors.transparent'}},negative:{dot:{checked:'colors.interactive.icon.onPrimary.normal',unchecked:'colors.transparent'},border:{checked:'colors.interactive.border.negative.default',unchecked:'colors.interactive.border.negative.default'},background:{checked:'colors.interactive.background.negative.default',unchecked:'colors.transparent'}}}};var radioHoverTokens={default:{background:{checked:'colors.interactive.background.primary.highlighted',unchecked:'colors.interactive.background.gray.faded'},border:{checked:'colors.interactive.background.primary.highlighted',unchecked:'colors.interactive.border.gray.default'}}};
+var radioSizes={group:{gap:{small:{mobile:'spacing.3',desktop:'spacing.2'},medium:{mobile:'spacing.4',desktop:'spacing.3'},large:{mobile:'spacing.5',desktop:'spacing.4'}}},icon:{small:{width:size[12],height:size[12],dotRadius:size[2]},medium:{width:size[16],height:size[16],dotRadius:size[3]},large:{width:size[20],height:size[20],dotRadius:size[4]}}};var radioIconColors={variants:{default:{dot:{checked:'colors.interactive.icon.onPrimary.normal',unchecked:'colors.transparent'},border:{checked:'colors.interactive.border.primary.default',unchecked:'colors.interactive.border.gray.default'},background:{checked:'colors.interactive.background.primary.default',unchecked:'colors.transparent'}},disabled:{dot:{checked:'colors.interactive.icon.onPrimary.normal',unchecked:'colors.interactive.icon.onPrimary.normal'},border:{checked:'colors.transparent',unchecked:'colors.interactive.border.gray.disabled'},background:{checked:'colors.interactive.background.primary.disabled',unchecked:'colors.transparent'}},negative:{dot:{checked:'colors.interactive.icon.onPrimary.normal',unchecked:'colors.transparent'},border:{checked:'colors.interactive.border.negative.default',unchecked:'colors.interactive.border.negative.default'},background:{checked:'colors.interactive.background.negative.default',unchecked:'colors.transparent'}}}};var radioHoverTokens={default:{background:{checked:'colors.interactive.background.primary.highlighted',unchecked:'colors.interactive.background.gray.faded'},border:{checked:'colors.interactive.background.primary.highlighted',unchecked:'colors.interactive.border.gray.default'}}};
 
 export { radioHoverTokens, radioIconColors, radioSizes };
 //# sourceMappingURL=radioTokens.js.map

package/build/lib/native/components/Radio/radioTokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"radioTokens.js","sources":["../../../../../src/components/Radio/radioTokens.ts"],"sourcesContent":["import type { Theme } from '~components/BladeProvider';\nimport type { SelectorInputHoverTokens } from '~components/Form/Selector/types';\nimport type { DotNotationToken } from '~utils/lodashButBetter/get';\nimport { size } from '~tokens/global';\n\nconst radioSizes = {\n  group: {\n    gap: {\n      small: {\n        mobile: 'spacing.2',\n        desktop: 'spacing.0',\n      },\n      medium: {\n        mobile: 'spacing.3',\n        desktop: 'spacing.2',\n      },\n    },\n  },\n  icon: {\n    small: {\n      width: size[12],\n      height: size[12],\n      dotRadius: size[2],\n    },\n    medium: {\n      width: size[16],\n      height: size[16],\n      dotRadius: size[3],\n    },\n  },\n} as const;\n\ntype ColorTokens = `colors.${DotNotationToken<Theme['colors']>}`;\ntype Variant = {\n  dot: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n  border: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n  background: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n};\n\ntype RadioIconColors = {\n  variants: {\n    default: Variant;\n    disabled: Variant;\n    negative: Variant;\n  };\n};\n\nconst radioIconColors: RadioIconColors = {\n  variants: {\n    default: {\n      dot: {\n        checked: 'colors.interactive.icon.onPrimary.normal',\n        unchecked: 'colors.transparent',\n      },\n      border: {\n        checked: 'colors.interactive.border.primary.default',\n        unchecked: 'colors.interactive.border.gray.default',\n      },\n      background: {\n        checked: 'colors.interactive.background.primary.default',\n        unchecked: 'colors.transparent',\n      },\n    },\n    disabled: {\n      dot: {\n        checked: 'colors.interactive.icon.onPrimary.normal',\n        unchecked: 'colors.interactive.icon.onPrimary.normal',\n      },\n      border: {\n        checked: 'colors.transparent',\n        unchecked: 'colors.interactive.border.gray.disabled',\n      },\n      background: {\n        checked: 'colors.interactive.background.primary.disabled',\n        unchecked: 'colors.transparent',\n      },\n    },\n    negative: {\n      dot: {\n        checked: 'colors.interactive.icon.onPrimary.normal',\n        unchecked: 'colors.transparent',\n      },\n      border: {\n        checked: 'colors.interactive.border.negative.default',\n        unchecked: 'colors.interactive.border.negative.default',\n      },\n      background: {\n        checked: 'colors.interactive.background.negative.default',\n        unchecked: 'colors.transparent',\n      },\n    },\n  },\n} as const;\n\nconst radioHoverTokens: SelectorInputHoverTokens = {\n  default: {\n    background: {\n      checked: 'colors.interactive.background.primary.highlighted',\n      unchecked: 'colors.interactive.background.gray.faded',\n    },\n    border: {\n      checked: 'colors.interactive.background.primary.highlighted', // Intentionally not using border tokens here since we want to match the background color\n      unchecked: 'colors.interactive.border.gray.default',\n    },\n  },\n};\n\nexport { radioSizes, radioIconColors, radioHoverTokens };\n"],"names":["radioSizes","group","gap","small","mobile","desktop","medium","icon","width","size","height","dotRadius","radioIconColors","variants","default","dot","checked","unchecked","border","background","disabled","negative","radioHoverTokens"],"mappings":";;;;AAKM,IAAAA,UAAU,CAAG,CACjBC,KAAK,CAAE,CACLC,GAAG,CAAE,CACHC,KAAK,CAAE,CACLC,MAAM,CAAE,WAAW,CACnBC,OAAO,CAAE,WACX,CAAC,CACDC,MAAM,CAAE,CACNF,MAAM,CAAE,WAAW,CACnBC,OAAO,CAAE,WACX,CACF,CACF,CAAC,CACDE,IAAI,CAAE,CACJJ,KAAK,CAAE,CACLK,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAED,IAAI,CAAC,EAAE,CAAC,CAChBE,SAAS,CAAEF,IAAI,CAAC,CAAC,CACnB,CAAC,CACDH,MAAM,CAAE,CACNE,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAED,IAAI,CAAC,EAAE,CAAC,CAChBE,SAAS,CAAEF,IAAI,CAAC,CAAC,CACnB,CACF,CACF,EA0BM,IAAAG,eAAgC,CAAG,CACvCC,QAAQ,CAAE,CACRC,OAAO,CAAE,CACPC,GAAG,CAAE,CACHC,OAAO,CAAE,0CAA0C,CACnDC,SAAS,CAAE,oBACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,2CAA2C,CACpDC,SAAS,CAAE,wCACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,+CAA+C,CACxDC,SAAS,CAAE,oBACb,CACF,CAAC,CACDG,QAAQ,CAAE,CACRL,GAAG,CAAE,CACHC,OAAO,CAAE,0CAA0C,CACnDC,SAAS,CAAE,0CACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,oBAAoB,CAC7BC,SAAS,CAAE,yCACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,gDAAgD,CACzDC,SAAS,CAAE,oBACb,CACF,CAAC,CACDI,QAAQ,CAAE,CACRN,GAAG,CAAE,CACHC,OAAO,CAAE,0CAA0C,CACnDC,SAAS,CAAE,oBACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,4CAA4C,CACrDC,SAAS,CAAE,4CACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,gDAAgD,CACzDC,SAAS,CAAE,oBACb,CACF,CACF,CACF,EAEM,IAAAK,gBAA0C,CAAG,CACjDR,OAAO,CAAE,CACPK,UAAU,CAAE,CACVH,OAAO,CAAE,mDAAmD,CAC5DC,SAAS,CAAE,0CACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,mDAAmD,CAC5DC,SAAS,CAAE,wCACb,CACF,CACF;;;;"}
+{"version":3,"file":"radioTokens.js","sources":["../../../../../src/components/Radio/radioTokens.ts"],"sourcesContent":["import type { Theme } from '~components/BladeProvider';\nimport type { SelectorInputHoverTokens } from '~components/Form/Selector/types';\nimport type { DotNotationToken } from '~utils/lodashButBetter/get';\nimport { size } from '~tokens/global';\n\nconst radioSizes = {\n  group: {\n    gap: {\n      small: {\n        mobile: 'spacing.3',\n        desktop: 'spacing.2',\n      },\n      medium: {\n        mobile: 'spacing.4',\n        desktop: 'spacing.3',\n      },\n      large: {\n        mobile: 'spacing.5',\n        desktop: 'spacing.4',\n      },\n    },\n  },\n  icon: {\n    small: {\n      width: size[12],\n      height: size[12],\n      dotRadius: size[2],\n    },\n    medium: {\n      width: size[16],\n      height: size[16],\n      dotRadius: size[3],\n    },\n    large: {\n      width: size[20],\n      height: size[20],\n      dotRadius: size[4],\n    },\n  },\n} as const;\n\ntype ColorTokens = `colors.${DotNotationToken<Theme['colors']>}`;\ntype Variant = {\n  dot: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n  border: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n  background: {\n    checked: ColorTokens;\n    unchecked: ColorTokens;\n  };\n};\n\ntype RadioIconColors = {\n  variants: {\n    default: Variant;\n    disabled: Variant;\n    negative: Variant;\n  };\n};\n\nconst radioIconColors: RadioIconColors = {\n  variants: {\n    default: {\n      dot: {\n        checked: 'colors.interactive.icon.onPrimary.normal',\n        unchecked: 'colors.transparent',\n      },\n      border: {\n        checked: 'colors.interactive.border.primary.default',\n        unchecked: 'colors.interactive.border.gray.default',\n      },\n      background: {\n        checked: 'colors.interactive.background.primary.default',\n        unchecked: 'colors.transparent',\n      },\n    },\n    disabled: {\n      dot: {\n        checked: 'colors.interactive.icon.onPrimary.normal',\n        unchecked: 'colors.interactive.icon.onPrimary.normal',\n      },\n      border: {\n        checked: 'colors.transparent',\n        unchecked: 'colors.interactive.border.gray.disabled',\n      },\n      background: {\n        checked: 'colors.interactive.background.primary.disabled',\n        unchecked: 'colors.transparent',\n      },\n    },\n    negative: {\n      dot: {\n        checked: 'colors.interactive.icon.onPrimary.normal',\n        unchecked: 'colors.transparent',\n      },\n      border: {\n        checked: 'colors.interactive.border.negative.default',\n        unchecked: 'colors.interactive.border.negative.default',\n      },\n      background: {\n        checked: 'colors.interactive.background.negative.default',\n        unchecked: 'colors.transparent',\n      },\n    },\n  },\n} as const;\n\nconst radioHoverTokens: SelectorInputHoverTokens = {\n  default: {\n    background: {\n      checked: 'colors.interactive.background.primary.highlighted',\n      unchecked: 'colors.interactive.background.gray.faded',\n    },\n    border: {\n      checked: 'colors.interactive.background.primary.highlighted', // Intentionally not using border tokens here since we want to match the background color\n      unchecked: 'colors.interactive.border.gray.default',\n    },\n  },\n};\n\nexport { radioSizes, radioIconColors, radioHoverTokens };\n"],"names":["radioSizes","group","gap","small","mobile","desktop","medium","large","icon","width","size","height","dotRadius","radioIconColors","variants","default","dot","checked","unchecked","border","background","disabled","negative","radioHoverTokens"],"mappings":";;;;AAKM,IAAAA,UAAU,CAAG,CACjBC,KAAK,CAAE,CACLC,GAAG,CAAE,CACHC,KAAK,CAAE,CACLC,MAAM,CAAE,WAAW,CACnBC,OAAO,CAAE,WACX,CAAC,CACDC,MAAM,CAAE,CACNF,MAAM,CAAE,WAAW,CACnBC,OAAO,CAAE,WACX,CAAC,CACDE,KAAK,CAAE,CACLH,MAAM,CAAE,WAAW,CACnBC,OAAO,CAAE,WACX,CACF,CACF,CAAC,CACDG,IAAI,CAAE,CACJL,KAAK,CAAE,CACLM,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAED,IAAI,CAAC,EAAE,CAAC,CAChBE,SAAS,CAAEF,IAAI,CAAC,CAAC,CACnB,CAAC,CACDJ,MAAM,CAAE,CACNG,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAED,IAAI,CAAC,EAAE,CAAC,CAChBE,SAAS,CAAEF,IAAI,CAAC,CAAC,CACnB,CAAC,CACDH,KAAK,CAAE,CACLE,KAAK,CAAEC,IAAI,CAAC,EAAE,CAAC,CACfC,MAAM,CAAED,IAAI,CAAC,EAAE,CAAC,CAChBE,SAAS,CAAEF,IAAI,CAAC,CAAC,CACnB,CACF,CACF,EA0BM,IAAAG,eAAgC,CAAG,CACvCC,QAAQ,CAAE,CACRC,OAAO,CAAE,CACPC,GAAG,CAAE,CACHC,OAAO,CAAE,0CAA0C,CACnDC,SAAS,CAAE,oBACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,2CAA2C,CACpDC,SAAS,CAAE,wCACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,+CAA+C,CACxDC,SAAS,CAAE,oBACb,CACF,CAAC,CACDG,QAAQ,CAAE,CACRL,GAAG,CAAE,CACHC,OAAO,CAAE,0CAA0C,CACnDC,SAAS,CAAE,0CACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,oBAAoB,CAC7BC,SAAS,CAAE,yCACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,gDAAgD,CACzDC,SAAS,CAAE,oBACb,CACF,CAAC,CACDI,QAAQ,CAAE,CACRN,GAAG,CAAE,CACHC,OAAO,CAAE,0CAA0C,CACnDC,SAAS,CAAE,oBACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,4CAA4C,CACrDC,SAAS,CAAE,4CACb,CAAC,CACDE,UAAU,CAAE,CACVH,OAAO,CAAE,gDAAgD,CACzDC,SAAS,CAAE,oBACb,CACF,CACF,CACF,EAEM,IAAAK,gBAA0C,CAAG,CACjDR,OAAO,CAAE,CACPK,UAAU,CAAE,CACVH,OAAO,CAAE,mDAAmD,CAC5DC,SAAS,CAAE,0CACb,CAAC,CACDC,MAAM,CAAE,CACNF,OAAO,CAAE,mDAAmD,CAC5DC,SAAS,CAAE,wCACb,CACF,CACF;;;;"}

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

@@ -27,7 +27,7 @@ import '../Typography/Code/Code.js';
 import { BaseBox } from '../Box/BaseBox/BaseBox.native.js';
 import { useIsMobile } from '../../utils/useIsMobile.js';
 
-var _excluded=["size","icon","onDismiss","children","isDisabled","testID","_isVirtuallyFocused","_isTagInsideInput"];var FocussableTag=styled(BaseBox)(function(props){if(props._isVirtuallyFocused&&!isReactNative()){return {outline:`${makeSize(size['1'])} solid ${props.theme.colors.surface.background.gray.subtle}`,boxShadow:`0px 0px 0px 4px ${props.theme.colors.interactive.background.primary.faded}`};}return {};});var Tag=function Tag(_ref){var _ref$size=_ref.size,size$1=_ref$size===void 0?'medium':_ref$size,Icon=_ref.icon,onDismiss=_ref.onDismiss,children=_ref.children,isDisabled=_ref.isDisabled,testID=_ref.testID,_isVirtuallyFocused=_ref._isVirtuallyFocused,_isTagInsideInput=_ref._isTagInsideInput,styledProps=_objectWithoutProperties(_ref,_excluded);var isMobile=useIsMobile();var textColor=isDisabled?'interactive.text.gray.disabled':'interactive.text.gray.subtle';var iconColor=isDisabled?'interactive.icon.gray.disabled':'interactive.icon.gray.muted';var backgroundColor=isDisabled?'interactive.background.gray.disabled':'interactive.background.gray.default';var mediumPadding={base:['spacing.2','spacing.3','spacing.2','spacing.4'],m:['spacing.1','spacing.2','spacing.1','spacing.3']};var largePadding={base:['spacing.2','spacing.3','spacing.2','spacing.4'],m:['spacing.2','spacing.3','spacing.2','spacing.4']};var assetSize=React__default.useMemo(function(){if(isMobile&&size$1==='large'){return 'medium';}return 'small';},[isMobile,size$1]);return jsx(BaseBox,Object.assign({display:isReactNative()?'flex':'inline-flex'},getStyledProps(styledProps),metaAttribute({name:MetaConstants.Tag,testID:testID}),{children:jsxs(FocussableTag,{display:isReactNative()?'flex':'inline-flex',alignSelf:isReactNative()?'center':undefined,flexDirection:"row",flexWrap:"nowrap",flexShrink:0,backgroundColor:backgroundColor,borderRadius:"max",padding:size$1==='medium'?mediumPadding:largePadding,_isVirtuallyFocused:_isVirtuallyFocused,children:[Icon?jsx(Box,{display:"flex",flexDirection:"row",alignItems:"center",children:jsx(Icon,{color:iconColor,size:assetSize,marginRight:"spacing.2"})}):null,jsx(Box,{display:"flex",flexDirection:"row",alignItems:"center",maxWidth:makeSize(size['100']),children:jsx(Text,{truncateAfterLines:1,marginRight:"spacing.2",color:textColor,size:assetSize,children:children})}),jsx(Box,{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"center",children:jsx(IconButton,{size:assetSize,icon:CloseIcon,accessibilityLabel:`Close ${children} tag`,isDisabled:isDisabled,_tabIndex:_isTagInsideInput?-1:undefined,onClick:function onClick(e){if(_isTagInsideInput){e.stopPropagation();}onDismiss();}})})]})}));};
+var _excluded=["size","icon","onDismiss","children","isDisabled","testID","_isVirtuallyFocused","_isTagInsideInput"];var FocussableTag=styled(BaseBox)(function(props){if(props._isVirtuallyFocused&&!isReactNative()){return {outline:`${makeSize(size['1'])} solid ${props.theme.colors.surface.background.gray.subtle}`,boxShadow:`0px 0px 0px 4px ${props.theme.colors.interactive.background.primary.faded}`};}return {};});var Tag=function Tag(_ref){var _ref$size=_ref.size,size$1=_ref$size===void 0?'medium':_ref$size,Icon=_ref.icon,onDismiss=_ref.onDismiss,children=_ref.children,isDisabled=_ref.isDisabled,testID=_ref.testID,_isVirtuallyFocused=_ref._isVirtuallyFocused,_isTagInsideInput=_ref._isTagInsideInput,styledProps=_objectWithoutProperties(_ref,_excluded);var isMobile=useIsMobile();var textColor=isDisabled?'interactive.text.gray.disabled':'interactive.text.gray.subtle';var iconColor=isDisabled?'interactive.icon.gray.disabled':'interactive.icon.gray.muted';var backgroundColor=isDisabled?'interactive.background.gray.disabled':'interactive.background.gray.default';var mediumPadding={base:['spacing.2','spacing.3','spacing.2','spacing.4'],m:['spacing.1','spacing.2','spacing.1','spacing.3']};var largePadding={base:['spacing.2','spacing.3','spacing.2','spacing.4'],m:['spacing.2','spacing.3','spacing.2','spacing.4']};var assetSize=React__default.useMemo(function(){if(isMobile&&size$1==='large'){return 'medium';}return 'small';},[isMobile,size$1]);return jsx(BaseBox,Object.assign({display:isReactNative()?'flex':'inline-flex'},getStyledProps(styledProps),metaAttribute({name:MetaConstants.Tag,testID:testID}),{children:jsxs(FocussableTag,{display:isReactNative()?'flex':'inline-flex',alignSelf:isReactNative()?'center':undefined,flexDirection:"row",flexWrap:"nowrap",flexShrink:0,backgroundColor:backgroundColor,borderRadius:"max",padding:size$1==='medium'?mediumPadding:largePadding,_isVirtuallyFocused:_isVirtuallyFocused,children:[Icon?jsx(Box,{display:"flex",flexDirection:"row",alignItems:"center",children:jsx(Icon,{color:iconColor,size:assetSize,marginRight:"spacing.2"})}):null,jsx(Box,{display:"flex",flexDirection:"row",maxWidth:makeSize(size['100']),children:jsx(Text,{textAlign:"center",truncateAfterLines:1,marginRight:"spacing.2",color:textColor,size:'small',children:children})}),jsx(Box,{display:"flex",flexDirection:"row",alignItems:"center",justifyContent:"center",children:jsx(IconButton,{size:assetSize,icon:CloseIcon,accessibilityLabel:`Close ${children} tag`,isDisabled:isDisabled,_tabIndex:_isTagInsideInput?-1:undefined,onClick:function onClick(e){if(_isTagInsideInput){e.stopPropagation();}onDismiss();}})})]})}));};
 
 export { Tag };
 //# sourceMappingURL=Tag.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","sources":["../../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport type { TagProps } from './types';\nimport { Box } from '~components/Box';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { IconButton } from '~components/Button/IconButton';\nimport { CloseIcon } from '~components/Icons';\nimport { Text } from '~components/Typography';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { isReactNative, makeSize } from '~utils';\nimport { size as globalSizeTokens } from '~tokens/global';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { PaddingProps } from '~components/Box/BaseBox/types/spacingTypes';\nimport { useIsMobile } from '~utils/useIsMobile';\n\nconst FocussableTag = styled(BaseBox)<{ _isVirtuallyFocused: TagProps['_isVirtuallyFocused'] }>(\n  (props) => {\n    if (props._isVirtuallyFocused && !isReactNative()) {\n      return {\n        outline: `${makeSize(globalSizeTokens['1'])} solid ${\n          props.theme.colors.surface.background.gray.subtle\n        }`,\n        boxShadow: `0px 0px 0px 4px ${props.theme.colors.interactive.background.primary.faded}`,\n      };\n    }\n\n    return {};\n  },\n);\n\n/**\n * ## Tags\n *\n * Tag component can be used to display selected items on UI.\n *\n * ### Usage\n *\n * ***Note:*** _Make sure to handle state when using Tag_\n *\n * ```jsx\n * const [showTag, setShowTag] = React.useState(true);\n *\n * // ...\n *\n * {showTag && (\n *  <Tag\n *    icon={CheckIcon}\n *    onDismiss={() => setShowTag(false)}\n *  >\n *    Transactions\n *  </Tag>\n * )}\n * ```\n *\n * Checkout [Tags Documentation](https://blade.razorpay.com/?path=/story/components-tag--default) for more info.\n *\n */\nconst Tag = ({\n  size = 'medium',\n  icon: Icon,\n  onDismiss,\n  children,\n  isDisabled,\n  testID,\n  _isVirtuallyFocused,\n  _isTagInsideInput,\n  ...styledProps\n}: TagProps): React.ReactElement | null => {\n  const isMobile = useIsMobile();\n\n  const textColor = isDisabled ? 'interactive.text.gray.disabled' : 'interactive.text.gray.subtle';\n  const iconColor = isDisabled ? 'interactive.icon.gray.disabled' : 'interactive.icon.gray.muted';\n  const backgroundColor = isDisabled\n    ? 'interactive.background.gray.disabled'\n    : 'interactive.background.gray.default';\n\n  const mediumPadding: PaddingProps['padding'] = {\n    base: ['spacing.2', 'spacing.3', 'spacing.2', 'spacing.4'],\n    m: ['spacing.1', 'spacing.2', 'spacing.1', 'spacing.3'],\n  };\n\n  const largePadding: PaddingProps['padding'] = {\n    base: ['spacing.2', 'spacing.3', 'spacing.2', 'spacing.4'],\n    m: ['spacing.2', 'spacing.3', 'spacing.2', 'spacing.4'],\n  };\n\n  const assetSize = React.useMemo((): 'small' | 'medium' => {\n    if (isMobile && size === 'large') {\n      return 'medium';\n    }\n\n    return 'small';\n  }, [isMobile, size]);\n\n  return (\n    <BaseBox\n      display={(isReactNative() ? 'flex' : 'inline-flex') as never}\n      {...getStyledProps(styledProps)}\n      {...metaAttribute({ name: MetaConstants.Tag, testID })}\n    >\n      <FocussableTag\n        display={(isReactNative() ? 'flex' : 'inline-flex') as never}\n        alignSelf={isReactNative() ? 'center' : undefined}\n        flexDirection=\"row\"\n        flexWrap=\"nowrap\"\n        flexShrink={0}\n        backgroundColor={backgroundColor}\n        borderRadius=\"max\"\n        padding={size === 'medium' ? mediumPadding : largePadding}\n        _isVirtuallyFocused={_isVirtuallyFocused}\n      >\n        {/* Leading Icon */}\n        {Icon ? (\n          <Box display=\"flex\" flexDirection=\"row\" alignItems=\"center\">\n            <Icon color={iconColor} size={assetSize} marginRight=\"spacing.2\" />\n          </Box>\n        ) : null}\n\n        {/* Tag Text */}\n        <Box\n          display=\"flex\"\n          flexDirection=\"row\"\n          alignItems=\"center\"\n          maxWidth={makeSize(globalSizeTokens['100'])}\n        >\n          <Text truncateAfterLines={1} marginRight=\"spacing.2\" color={textColor} size={assetSize}>\n            {children}\n          </Text>\n        </Box>\n\n        {/* Dismiss Icon */}\n        <Box display=\"flex\" flexDirection=\"row\" alignItems=\"center\" justifyContent=\"center\">\n          <IconButton\n            size={assetSize}\n            icon={CloseIcon}\n            accessibilityLabel={`Close ${children} tag`}\n            isDisabled={isDisabled}\n            _tabIndex={_isTagInsideInput ? -1 : undefined}\n            onClick={(e) => {\n              // Inside tag input, we stop propagation to avoid opening dropdown on click of close on tag\n              if (_isTagInsideInput) {\n                e.stopPropagation();\n              }\n              onDismiss();\n            }}\n          />\n        </Box>\n      </FocussableTag>\n    </BaseBox>\n  );\n};\n\nexport { Tag };\n"],"names":["FocussableTag","styled","BaseBox","props","_isVirtuallyFocused","isReactNative","outline","makeSize","globalSizeTokens","theme","colors","surface","background","gray","subtle","boxShadow","interactive","primary","faded","Tag","_ref","_ref$size","size","Icon","icon","onDismiss","children","isDisabled","testID","_isTagInsideInput","styledProps","_objectWithoutProperties","_excluded","isMobile","useIsMobile","textColor","iconColor","backgroundColor","mediumPadding","base","m","largePadding","assetSize","React","useMemo","_jsx","Object","assign","display","getStyledProps","metaAttribute","name","MetaConstants","_jsxs","alignSelf","undefined","flexDirection","flexWrap","flexShrink","borderRadius","padding","Box","alignItems","color","marginRight","maxWidth","Text","truncateAfterLines","justifyContent","IconButton","CloseIcon","accessibilityLabel","_tabIndex","onClick","e","stopPropagation"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAA,SAAA,CAAA,CAAA,MAAA,CAAA,MAAA,CAAA,WAAA,CAAA,UAAA,CAAA,YAAA,CAAA,QAAA,CAAA,qBAAA,CAAA,mBAAA,CAAA,CAeA,IAAMA,aAAa,CAAGC,MAAM,CAACC,OAAO,CAAC,CACnC,SAACC,KAAK,CAAK,CACT,GAAIA,KAAK,CAACC,mBAAmB,EAAI,CAACC,aAAa,EAAE,CAAE,CACjD,OAAO,CACLC,OAAO,CAAG,CAAEC,EAAAA,QAAQ,CAACC,IAAgB,CAAC,GAAG,CAAC,CAAE,CAAA,OAAA,EAC1CL,KAAK,CAACM,KAAK,CAACC,MAAM,CAACC,OAAO,CAACC,UAAU,CAACC,IAAI,CAACC,MAC5C,CAAC,CAAA,CACFC,SAAS,CAAG,CAAA,gBAAA,EAAkBZ,KAAK,CAACM,KAAK,CAACC,MAAM,CAACM,WAAW,CAACJ,UAAU,CAACK,OAAO,CAACC,KAAM,CACxF,CAAA,CAAC,CACH,CAEA,OAAO,EAAE,CACX,CACF,CAAC,CA6BK,IAAAC,GAAG,CAAG,SAANA,GAAGA,CAAAC,IAAA,CAUkC,CAAA,IAAAC,SAAA,CAAAD,IAAA,CATzCE,IAAI,CAAJA,MAAI,CAAAD,SAAA,GAAA,KAAA,CAAA,CAAG,QAAQ,CAAAA,SAAA,CACTE,IAAI,CAAAH,IAAA,CAAVI,IAAI,CACJC,SAAS,CAAAL,IAAA,CAATK,SAAS,CACTC,QAAQ,CAAAN,IAAA,CAARM,QAAQ,CACRC,UAAU,CAAAP,IAAA,CAAVO,UAAU,CACVC,MAAM,CAAAR,IAAA,CAANQ,MAAM,CACNxB,mBAAmB,CAAAgB,IAAA,CAAnBhB,mBAAmB,CACnByB,iBAAiB,CAAAT,IAAA,CAAjBS,iBAAiB,CACdC,WAAW,CAAAC,wBAAA,CAAAX,IAAA,CAAAY,SAAA,CAAA,CAEd,IAAMC,QAAQ,CAAGC,WAAW,EAAE,CAE9B,IAAMC,SAAS,CAAGR,UAAU,CAAG,gCAAgC,CAAG,8BAA8B,CAChG,IAAMS,SAAS,CAAGT,UAAU,CAAG,gCAAgC,CAAG,6BAA6B,CAC/F,IAAMU,eAAe,CAAGV,UAAU,CAC9B,sCAAsC,CACtC,qCAAqC,CAEzC,IAAMW,aAAsC,CAAG,CAC7CC,IAAI,CAAE,CAAC,WAAW,CAAE,WAAW,CAAE,WAAW,CAAE,WAAW,CAAC,CAC1DC,CAAC,CAAE,CAAC,WAAW,CAAE,WAAW,CAAE,WAAW,CAAE,WAAW,CACxD,CAAC,CAED,IAAMC,YAAqC,CAAG,CAC5CF,IAAI,CAAE,CAAC,WAAW,CAAE,WAAW,CAAE,WAAW,CAAE,WAAW,CAAC,CAC1DC,CAAC,CAAE,CAAC,WAAW,CAAE,WAAW,CAAE,WAAW,CAAE,WAAW,CACxD,CAAC,CAED,IAAME,SAAS,CAAGC,cAAK,CAACC,OAAO,CAAC,UAA0B,CACxD,GAAIX,QAAQ,EAAIX,MAAI,GAAK,OAAO,CAAE,CAChC,OAAO,QAAQ,CACjB,CAEA,OAAO,OAAO,CAChB,CAAC,CAAE,CAACW,QAAQ,CAAEX,MAAI,CAAC,CAAC,CAEpB,OACEuB,GAAA,CAAC3C,OAAO,CAAA4C,MAAA,CAAAC,MAAA,EACNC,OAAO,CAAG3C,aAAa,EAAE,CAAG,MAAM,CAAG,aAAwB,EACzD4C,cAAc,CAACnB,WAAW,CAAC,CAC3BoB,aAAa,CAAC,CAAEC,IAAI,CAAEC,aAAa,CAACjC,GAAG,CAAES,MAAM,CAANA,MAAO,CAAC,CAAC,EAAAF,QAAA,CAEtD2B,IAAA,CAACrD,aAAa,CACZgD,CAAAA,OAAO,CAAG3C,aAAa,EAAE,CAAG,MAAM,CAAG,aAAwB,CAC7DiD,SAAS,CAAEjD,aAAa,EAAE,CAAG,QAAQ,CAAGkD,SAAU,CAClDC,aAAa,CAAC,KAAK,CACnBC,QAAQ,CAAC,QAAQ,CACjBC,UAAU,CAAE,CAAE,CACdrB,eAAe,CAAEA,eAAgB,CACjCsB,YAAY,CAAC,KAAK,CAClBC,OAAO,CAAEtC,MAAI,GAAK,QAAQ,CAAGgB,aAAa,CAAGG,YAAa,CAC1DrC,mBAAmB,CAAEA,mBAAoB,CAAAsB,QAAA,CAGxCH,CAAAA,IAAI,CACHsB,GAAA,CAACgB,GAAG,CAAA,CAACb,OAAO,CAAC,MAAM,CAACQ,aAAa,CAAC,KAAK,CAACM,UAAU,CAAC,QAAQ,CAAApC,QAAA,CACzDmB,GAAA,CAACtB,IAAI,CAAA,CAACwC,KAAK,CAAE3B,SAAU,CAACd,IAAI,CAAEoB,SAAU,CAACsB,WAAW,CAAC,WAAW,CAAE,CAAC,CAChE,CAAC,CACJ,IAAI,CAGRnB,GAAA,CAACgB,GAAG,EACFb,OAAO,CAAC,MAAM,CACdQ,aAAa,CAAC,KAAK,CACnBM,UAAU,CAAC,QAAQ,CACnBG,QAAQ,CAAE1D,QAAQ,CAACC,IAAgB,CAAC,KAAK,CAAC,CAAE,CAAAkB,QAAA,CAE5CmB,GAAA,CAACqB,IAAI,CAACC,CAAAA,kBAAkB,CAAE,CAAE,CAACH,WAAW,CAAC,WAAW,CAACD,KAAK,CAAE5B,SAAU,CAACb,IAAI,CAAEoB,SAAU,CAAAhB,QAAA,CACpFA,QAAQ,CACL,CAAC,CACJ,CAAC,CAGNmB,GAAA,CAACgB,GAAG,CAACb,CAAAA,OAAO,CAAC,MAAM,CAACQ,aAAa,CAAC,KAAK,CAACM,UAAU,CAAC,QAAQ,CAACM,cAAc,CAAC,QAAQ,CAAA1C,QAAA,CACjFmB,GAAA,CAACwB,UAAU,CACT/C,CAAAA,IAAI,CAAEoB,SAAU,CAChBlB,IAAI,CAAE8C,SAAU,CAChBC,kBAAkB,CAAG,CAAA,MAAA,EAAQ7C,QAAS,CAAM,IAAA,CAAA,CAC5CC,UAAU,CAAEA,UAAW,CACvB6C,SAAS,CAAE3C,iBAAiB,CAAG,CAAC,CAAC,CAAG0B,SAAU,CAC9CkB,OAAO,CAAE,SAAAA,OAAAA,CAACC,CAAC,CAAK,CAEd,GAAI7C,iBAAiB,CAAE,CACrB6C,CAAC,CAACC,eAAe,EAAE,CACrB,CACAlD,SAAS,EAAE,CACb,CAAE,CACH,CAAC,CACC,CAAC,CACO,CAAA,CAAC,EACT,CAAC,CAEd;;;;"}
+{"version":3,"file":"Tag.js","sources":["../../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport type { TagProps } from './types';\nimport { Box } from '~components/Box';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport { IconButton } from '~components/Button/IconButton';\nimport { CloseIcon } from '~components/Icons';\nimport { Text } from '~components/Typography';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { isReactNative, makeSize } from '~utils';\nimport { size as globalSizeTokens } from '~tokens/global';\nimport BaseBox from '~components/Box/BaseBox';\nimport type { PaddingProps } from '~components/Box/BaseBox/types/spacingTypes';\nimport { useIsMobile } from '~utils/useIsMobile';\n\nconst FocussableTag = styled(BaseBox)<{ _isVirtuallyFocused: TagProps['_isVirtuallyFocused'] }>(\n  (props) => {\n    if (props._isVirtuallyFocused && !isReactNative()) {\n      return {\n        outline: `${makeSize(globalSizeTokens['1'])} solid ${\n          props.theme.colors.surface.background.gray.subtle\n        }`,\n        boxShadow: `0px 0px 0px 4px ${props.theme.colors.interactive.background.primary.faded}`,\n      };\n    }\n\n    return {};\n  },\n);\n\n/**\n * ## Tags\n *\n * Tag component can be used to display selected items on UI.\n *\n * ### Usage\n *\n * ***Note:*** _Make sure to handle state when using Tag_\n *\n * ```jsx\n * const [showTag, setShowTag] = React.useState(true);\n *\n * // ...\n *\n * {showTag && (\n *  <Tag\n *    icon={CheckIcon}\n *    onDismiss={() => setShowTag(false)}\n *  >\n *    Transactions\n *  </Tag>\n * )}\n * ```\n *\n * Checkout [Tags Documentation](https://blade.razorpay.com/?path=/story/components-tag--default) for more info.\n *\n */\nconst Tag = ({\n  size = 'medium',\n  icon: Icon,\n  onDismiss,\n  children,\n  isDisabled,\n  testID,\n  _isVirtuallyFocused,\n  _isTagInsideInput,\n  ...styledProps\n}: TagProps): React.ReactElement | null => {\n  const isMobile = useIsMobile();\n\n  const textColor = isDisabled ? 'interactive.text.gray.disabled' : 'interactive.text.gray.subtle';\n  const iconColor = isDisabled ? 'interactive.icon.gray.disabled' : 'interactive.icon.gray.muted';\n  const backgroundColor = isDisabled\n    ? 'interactive.background.gray.disabled'\n    : 'interactive.background.gray.default';\n\n  const mediumPadding: PaddingProps['padding'] = {\n    base: ['spacing.2', 'spacing.3', 'spacing.2', 'spacing.4'],\n    m: ['spacing.1', 'spacing.2', 'spacing.1', 'spacing.3'],\n  };\n\n  const largePadding: PaddingProps['padding'] = {\n    base: ['spacing.2', 'spacing.3', 'spacing.2', 'spacing.4'],\n    m: ['spacing.2', 'spacing.3', 'spacing.2', 'spacing.4'],\n  };\n\n  const assetSize = React.useMemo((): 'small' | 'medium' => {\n    if (isMobile && size === 'large') {\n      return 'medium';\n    }\n\n    return 'small';\n  }, [isMobile, size]);\n\n  return (\n    <BaseBox\n      display={(isReactNative() ? 'flex' : 'inline-flex') as never}\n      {...getStyledProps(styledProps)}\n      {...metaAttribute({ name: MetaConstants.Tag, testID })}\n    >\n      <FocussableTag\n        display={(isReactNative() ? 'flex' : 'inline-flex') as never}\n        alignSelf={isReactNative() ? 'center' : undefined}\n        flexDirection=\"row\"\n        flexWrap=\"nowrap\"\n        flexShrink={0}\n        backgroundColor={backgroundColor}\n        borderRadius=\"max\"\n        padding={size === 'medium' ? mediumPadding : largePadding}\n        _isVirtuallyFocused={_isVirtuallyFocused}\n      >\n        {/* Leading Icon */}\n        {Icon ? (\n          <Box display=\"flex\" flexDirection=\"row\" alignItems=\"center\">\n            <Icon color={iconColor} size={assetSize} marginRight=\"spacing.2\" />\n          </Box>\n        ) : null}\n\n        {/* Tag Text */}\n        <Box display=\"flex\" flexDirection=\"row\" maxWidth={makeSize(globalSizeTokens['100'])}>\n          <Text\n            textAlign=\"center\"\n            truncateAfterLines={1}\n            marginRight=\"spacing.2\"\n            color={textColor}\n            size={'small'}\n          >\n            {children}\n          </Text>\n        </Box>\n\n        {/* Dismiss Icon */}\n        <Box display=\"flex\" flexDirection=\"row\" alignItems=\"center\" justifyContent=\"center\">\n          <IconButton\n            size={assetSize}\n            icon={CloseIcon}\n            accessibilityLabel={`Close ${children} tag`}\n            isDisabled={isDisabled}\n            _tabIndex={_isTagInsideInput ? -1 : undefined}\n            onClick={(e) => {\n              // Inside tag input, we stop propagation to avoid opening dropdown on click of close on tag\n              if (_isTagInsideInput) {\n                e.stopPropagation();\n              }\n              onDismiss();\n            }}\n          />\n        </Box>\n      </FocussableTag>\n    </BaseBox>\n  );\n};\n\nexport { Tag };\n"],"names":["FocussableTag","styled","BaseBox","props","_isVirtuallyFocused","isReactNative","outline","makeSize","globalSizeTokens","theme","colors","surface","background","gray","subtle","boxShadow","interactive","primary","faded","Tag","_ref","_ref$size","size","Icon","icon","onDismiss","children","isDisabled","testID","_isTagInsideInput","styledProps","_objectWithoutProperties","_excluded","isMobile","useIsMobile","textColor","iconColor","backgroundColor","mediumPadding","base","m","largePadding","assetSize","React","useMemo","_jsx","Object","assign","display","getStyledProps","metaAttribute","name","MetaConstants","_jsxs","alignSelf","undefined","flexDirection","flexWrap","flexShrink","borderRadius","padding","Box","alignItems","color","marginRight","maxWidth","Text","textAlign","truncateAfterLines","justifyContent","IconButton","CloseIcon","accessibilityLabel","_tabIndex","onClick","e","stopPropagation"],"mappings":"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"}

package/build/lib/native/components/Tag/getTagsGroup.js

@@ -2,7 +2,7 @@ import 'react';
 import { AnimatedTag } from './AnimatedTag.native.js';
 import { jsx } from 'react/jsx-runtime';
 
-var getTagsGroup=function getTagsGroup(_ref){var tags=_ref.tags,activeTagIndex=_ref.activeTagIndex,isDisabled=_ref.isDisabled,onDismiss=_ref.onDismiss;return tags.map(function(tagName,tagIndex){return jsx(AnimatedTag,{activeTagIndex:activeTagIndex,onDismiss:onDismiss,currentTagIndex:tagIndex,tagsLength:tags.length,isDisabled:isDisabled,children:tagName},tagName);});};
+var getTagsGroup=function getTagsGroup(_ref){var tags=_ref.tags,activeTagIndex=_ref.activeTagIndex,isDisabled=_ref.isDisabled,onDismiss=_ref.onDismiss,_ref$size=_ref.size,size=_ref$size===void 0?'medium':_ref$size;return tags.map(function(tagName,tagIndex){return jsx(AnimatedTag,{activeTagIndex:activeTagIndex,onDismiss:onDismiss,currentTagIndex:tagIndex,tagsLength:tags.length,isDisabled:isDisabled,size:size,children:tagName},tagName);});};
 
 export { getTagsGroup };
 //# sourceMappingURL=getTagsGroup.js.map

package/build/lib/native/components/Tag/getTagsGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"getTagsGroup.js","sources":["../../../../../src/components/Tag/getTagsGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { AnimatedTag } from './AnimatedTag';\nimport type { TagsGroupProps } from './types';\n\nconst getTagsGroup = ({\n  tags,\n  activeTagIndex,\n  isDisabled,\n  onDismiss,\n}: TagsGroupProps): React.ReactElement[] => {\n  return tags.map((tagName, tagIndex) => (\n    <AnimatedTag\n      key={tagName}\n      activeTagIndex={activeTagIndex}\n      onDismiss={onDismiss}\n      currentTagIndex={tagIndex}\n      tagsLength={tags.length}\n      isDisabled={isDisabled}\n    >\n      {tagName}\n    </AnimatedTag>\n  ));\n};\n\nexport { getTagsGroup };\n"],"names":["getTagsGroup","_ref","tags","activeTagIndex","isDisabled","onDismiss","map","tagName","tagIndex","_jsx","AnimatedTag","currentTagIndex","tagsLength","length","children"],"mappings":";;;;AAIM,IAAAA,YAAY,CAAG,SAAfA,YAAYA,CAAAC,IAAA,CAK0B,KAJ1CC,IAAI,CAAAD,IAAA,CAAJC,IAAI,CACJC,cAAc,CAAAF,IAAA,CAAdE,cAAc,CACdC,UAAU,CAAAH,IAAA,CAAVG,UAAU,CACVC,SAAS,CAAAJ,IAAA,CAATI,SAAS,CAET,OAAOH,IAAI,CAACI,GAAG,CAAC,SAACC,OAAO,CAAEC,QAAQ,CAAA,CAAA,OAChCC,GAAA,CAACC,WAAW,CAAA,CAEVP,cAAc,CAAEA,cAAe,CAC/BE,SAAS,CAAEA,SAAU,CACrBM,eAAe,CAAEH,QAAS,CAC1BI,UAAU,CAAEV,IAAI,CAACW,MAAO,CACxBT,UAAU,CAAEA,UAAW,CAAAU,QAAA,CAEtBP,OAAO,CAAA,CAPHA,OAQM,CAAC,CAAA,CACf,CAAC,CACJ;;;;"}
+{"version":3,"file":"getTagsGroup.js","sources":["../../../../../src/components/Tag/getTagsGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { AnimatedTag } from './AnimatedTag';\nimport type { TagsGroupProps } from './types';\n\nconst getTagsGroup = ({\n  tags,\n  activeTagIndex,\n  isDisabled,\n  onDismiss,\n  size = 'medium',\n}: TagsGroupProps): React.ReactElement[] => {\n  return tags.map((tagName, tagIndex) => (\n    <AnimatedTag\n      key={tagName}\n      activeTagIndex={activeTagIndex}\n      onDismiss={onDismiss}\n      currentTagIndex={tagIndex}\n      tagsLength={tags.length}\n      isDisabled={isDisabled}\n      size={size}\n    >\n      {tagName}\n    </AnimatedTag>\n  ));\n};\n\nexport { getTagsGroup };\n"],"names":["getTagsGroup","_ref","tags","activeTagIndex","isDisabled","onDismiss","_ref$size","size","map","tagName","tagIndex","_jsx","AnimatedTag","currentTagIndex","tagsLength","length","children"],"mappings":";;;;AAIM,IAAAA,YAAY,CAAG,SAAfA,YAAYA,CAAAC,IAAA,CAM0B,CAAA,IAL1CC,IAAI,CAAAD,IAAA,CAAJC,IAAI,CACJC,cAAc,CAAAF,IAAA,CAAdE,cAAc,CACdC,UAAU,CAAAH,IAAA,CAAVG,UAAU,CACVC,SAAS,CAAAJ,IAAA,CAATI,SAAS,CAAAC,SAAA,CAAAL,IAAA,CACTM,IAAI,CAAJA,IAAI,CAAAD,SAAA,UAAG,QAAQ,CAAAA,SAAA,CAEf,OAAOJ,IAAI,CAACM,GAAG,CAAC,SAACC,OAAO,CAAEC,QAAQ,SAChCC,GAAA,CAACC,WAAW,CAEVT,CAAAA,cAAc,CAAEA,cAAe,CAC/BE,SAAS,CAAEA,SAAU,CACrBQ,eAAe,CAAEH,QAAS,CAC1BI,UAAU,CAAEZ,IAAI,CAACa,MAAO,CACxBX,UAAU,CAAEA,UAAW,CACvBG,IAAI,CAAEA,IAAK,CAAAS,QAAA,CAEVP,OAAO,CAAA,CARHA,OASM,CAAC,CACf,CAAA,CAAC,CACJ;;;;"}

package/build/lib/native/components/Typography/Heading/Heading.js

@@ -11,7 +11,7 @@ import { isReactNative } from '../../../utils/platform/isReactNative.js';
 import '../../BladeProvider/useTheme.js';
 import { jsx } from 'react/jsx-runtime';
 
-var _excluded=["as","size","weight","color","children","testID","textAlign","textDecorationLine"];var validAsValues=['span','h1','h2','h3','h4','h5','h6'];var getProps=function getProps(_ref){var as=_ref.as,size=_ref.size,weight=_ref.weight,color=_ref.color,testID=_ref.testID;var props={color:color,fontSize:300,fontWeight:weight!=null?weight:'semibold',fontStyle:'normal',lineHeight:300,fontFamily:'heading',accessibilityProps:isReactNative()?{role:'heading'}:{},componentName:'heading',testID:testID};if(size==='small'){props.fontSize=300;props.lineHeight=300;props.as='h6';}else if(size==='medium'){props.fontSize=400;props.lineHeight=400;props.as='h5';}else if(size==='large'){props.fontSize=500;props.lineHeight=500;props.as='h4';}else if(size==='xlarge'){props.fontSize=600;props.lineHeight=600;props.as='h3';}else if(size==='2xlarge'){props.fontSize=700;props.lineHeight=700;props.as='h2';}props.as=as||props.as;return props;};var Heading=function Heading(_ref2){var as=_ref2.as,_ref2$size=_ref2.size,size=_ref2$size===void 0?'small':_ref2$size,_ref2$weight=_ref2.weight,weight=_ref2$weight===void 0?'semibold':_ref2$weight,_ref2$color=_ref2.color,color=_ref2$color===void 0?'surface.text.gray.normal':_ref2$color,children=_ref2.children,testID=_ref2.testID,textAlign=_ref2.textAlign,textDecorationLine=_ref2.textDecorationLine,styledProps=_objectWithoutProperties(_ref2,_excluded);useValidateAsProp({componentName:'Heading',as:as,validAsValues:validAsValues});var props=getProps({as:as,size:size,weight:weight,color:color,testID:testID});return jsx(BaseText,Object.assign({},props,{textAlign:textAlign,textDecorationLine:textDecorationLine},getStyledProps(styledProps),{children:children}));};
+var _excluded=["as","size","weight","color","children","testID","textAlign","textDecorationLine"];var validAsValues=['span','h1','h2','h3','h4','h5','h6'];var getHeadingProps=function getHeadingProps(_ref){var as=_ref.as,size=_ref.size,weight=_ref.weight,color=_ref.color,testID=_ref.testID;var props={color:color,fontSize:300,fontWeight:weight!=null?weight:'semibold',fontStyle:'normal',lineHeight:300,fontFamily:'heading',accessibilityProps:isReactNative()?{role:'heading'}:{},componentName:'heading',testID:testID};if(size==='small'){props.fontSize=300;props.lineHeight=300;props.as='h6';}else if(size==='medium'){props.fontSize=400;props.lineHeight=400;props.as='h5';}else if(size==='large'){props.fontSize=500;props.lineHeight=500;props.as='h4';}else if(size==='xlarge'){props.fontSize=600;props.lineHeight=600;props.as='h3';}else if(size==='2xlarge'){props.fontSize=700;props.lineHeight=700;props.as='h2';}props.as=as||props.as;return props;};var Heading=function Heading(_ref2){var as=_ref2.as,_ref2$size=_ref2.size,size=_ref2$size===void 0?'small':_ref2$size,_ref2$weight=_ref2.weight,weight=_ref2$weight===void 0?'semibold':_ref2$weight,_ref2$color=_ref2.color,color=_ref2$color===void 0?'surface.text.gray.normal':_ref2$color,children=_ref2.children,testID=_ref2.testID,textAlign=_ref2.textAlign,textDecorationLine=_ref2.textDecorationLine,styledProps=_objectWithoutProperties(_ref2,_excluded);useValidateAsProp({componentName:'Heading',as:as,validAsValues:validAsValues});var props=getHeadingProps({as:as,size:size,weight:weight,color:color,testID:testID});return jsx(BaseText,Object.assign({},props,{textAlign:textAlign,textDecorationLine:textDecorationLine},getStyledProps(styledProps),{children:children}));};
 
-export { Heading };
+export { Heading, getHeadingProps };
 //# sourceMappingURL=Heading.js.map

package/build/lib/native/components/Typography/Heading/Heading.js.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.js","sources":["../../../../../../src/components/Typography/Heading/Heading.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\nimport type { ReactElement } from 'react';\nimport { BaseText } from '../BaseText';\nimport type { BaseTextProps, BaseTextSizes } from '../BaseText/types';\nimport { useValidateAsProp } from '../utils';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { isReactNative } from '~utils';\nimport type { TestID } from '~utils/types';\n\nconst validAsValues = ['span', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6'] as const;\nexport type HeadingProps = {\n  as?: typeof validAsValues[number];\n  /**\n   * Overrides the color of the Heading component.\n   *\n   * **Note** This takes priority over `type` and `contrast` prop to decide color of heading\n   */\n  color?: BaseTextProps['color'];\n  weight?: Extract<BaseTextProps['fontWeight'], 'regular' | 'semibold'>;\n  children: React.ReactNode;\n  textAlign?: BaseTextProps['textAlign'];\n  textDecorationLine?: BaseTextProps['textDecorationLine'];\n  size?: Extract<BaseTextSizes, 'small' | 'medium' | 'large' | 'xlarge' | '2xlarge'>;\n} & TestID &\n  StyledPropsBlade;\n\nconst getProps = ({\n  as,\n  size,\n  weight,\n  color,\n  testID,\n}: Pick<HeadingProps, 'as' | 'size' | 'weight' | 'color' | 'testID'>): Omit<\n  BaseTextProps,\n  'children'\n> => {\n  const props: Omit<BaseTextProps, 'children'> = {\n    color,\n    fontSize: 300,\n    fontWeight: weight ?? 'semibold',\n    fontStyle: 'normal',\n    lineHeight: 300,\n    fontFamily: 'heading',\n    accessibilityProps: isReactNative() ? { role: 'heading' } : {},\n    componentName: 'heading',\n    testID,\n  };\n\n  if (size === 'small') {\n    props.fontSize = 300;\n    props.lineHeight = 300;\n    props.as = 'h6';\n  } else if (size === 'medium') {\n    props.fontSize = 400;\n    props.lineHeight = 400;\n    props.as = 'h5';\n  } else if (size === 'large') {\n    props.fontSize = 500;\n    props.lineHeight = 500;\n    props.as = 'h4';\n  } else if (size === 'xlarge') {\n    props.fontSize = 600;\n    props.lineHeight = 600;\n    props.as = 'h3';\n  } else if (size === '2xlarge') {\n    props.fontSize = 700;\n    props.lineHeight = 700;\n    props.as = 'h2';\n  }\n\n  // override the computed `as` prop if user passed an `as` prop\n  props.as = as || props.as;\n  return props;\n};\n\nexport const Heading = ({\n  as,\n  size = 'small',\n  weight = 'semibold',\n  color = 'surface.text.gray.normal',\n  children,\n  testID,\n  textAlign,\n  textDecorationLine,\n  ...styledProps\n}: HeadingProps): ReactElement => {\n  useValidateAsProp({ componentName: 'Heading', as, validAsValues });\n\n  const props = getProps({ as, size, weight, color, testID });\n\n  return (\n    <BaseText\n      {...props}\n      textAlign={textAlign}\n      textDecorationLine={textDecorationLine}\n      {...getStyledProps(styledProps)}\n    >\n      {children}\n    </BaseText>\n  );\n};\n"],"names":["validAsValues","getProps","_ref","as","size","weight","color","testID","props","fontSize","fontWeight","fontStyle","lineHeight","fontFamily","accessibilityProps","isReactNative","role","componentName","Heading","_ref2","_ref2$size","_ref2$weight","_ref2$color","children","textAlign","textDecorationLine","styledProps","_objectWithoutProperties","_excluded","useValidateAsProp","_jsx","BaseText","Object","assign","getStyledProps"],"mappings":"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"}
+{"version":3,"file":"Heading.js","sources":["../../../../../../src/components/Typography/Heading/Heading.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\nimport type { ReactElement } from 'react';\nimport { BaseText } from '../BaseText';\nimport type { BaseTextProps, BaseTextSizes } from '../BaseText/types';\nimport { useValidateAsProp } from '../utils';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport { isReactNative } from '~utils';\nimport type { TestID } from '~utils/types';\n\nconst validAsValues = ['span', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6'] as const;\nexport type HeadingProps = {\n  as?: typeof validAsValues[number];\n  /**\n   * Overrides the color of the Heading component.\n   *\n   * **Note** This takes priority over `type` and `contrast` prop to decide color of heading\n   */\n  color?: BaseTextProps['color'];\n  weight?: Extract<BaseTextProps['fontWeight'], 'regular' | 'semibold'>;\n  children: React.ReactNode;\n  textAlign?: BaseTextProps['textAlign'];\n  textDecorationLine?: BaseTextProps['textDecorationLine'];\n  size?: Extract<BaseTextSizes, 'small' | 'medium' | 'large' | 'xlarge' | '2xlarge'>;\n} & TestID &\n  StyledPropsBlade;\n\nexport const getHeadingProps = ({\n  as,\n  size,\n  weight,\n  color,\n  testID,\n}: Pick<HeadingProps, 'as' | 'size' | 'weight' | 'color' | 'testID'>): Omit<\n  BaseTextProps,\n  'children'\n> => {\n  const props: Omit<BaseTextProps, 'children'> = {\n    color,\n    fontSize: 300,\n    fontWeight: weight ?? 'semibold',\n    fontStyle: 'normal',\n    lineHeight: 300,\n    fontFamily: 'heading',\n    accessibilityProps: isReactNative() ? { role: 'heading' } : {},\n    componentName: 'heading',\n    testID,\n  };\n\n  if (size === 'small') {\n    props.fontSize = 300;\n    props.lineHeight = 300;\n    props.as = 'h6';\n  } else if (size === 'medium') {\n    props.fontSize = 400;\n    props.lineHeight = 400;\n    props.as = 'h5';\n  } else if (size === 'large') {\n    props.fontSize = 500;\n    props.lineHeight = 500;\n    props.as = 'h4';\n  } else if (size === 'xlarge') {\n    props.fontSize = 600;\n    props.lineHeight = 600;\n    props.as = 'h3';\n  } else if (size === '2xlarge') {\n    props.fontSize = 700;\n    props.lineHeight = 700;\n    props.as = 'h2';\n  }\n\n  // override the computed `as` prop if user passed an `as` prop\n  props.as = as || props.as;\n  return props;\n};\n\nexport const Heading = ({\n  as,\n  size = 'small',\n  weight = 'semibold',\n  color = 'surface.text.gray.normal',\n  children,\n  testID,\n  textAlign,\n  textDecorationLine,\n  ...styledProps\n}: HeadingProps): ReactElement => {\n  useValidateAsProp({ componentName: 'Heading', as, validAsValues });\n\n  const props = getHeadingProps({ as, size, weight, color, testID });\n\n  return (\n    <BaseText\n      {...props}\n      textAlign={textAlign}\n      textDecorationLine={textDecorationLine}\n      {...getStyledProps(styledProps)}\n    >\n      {children}\n    </BaseText>\n  );\n};\n"],"names":["validAsValues","getHeadingProps","_ref","as","size","weight","color","testID","props","fontSize","fontWeight","fontStyle","lineHeight","fontFamily","accessibilityProps","isReactNative","role","componentName","Heading","_ref2","_ref2$size","_ref2$weight","_ref2$color","children","textAlign","textDecorationLine","styledProps","_objectWithoutProperties","_excluded","useValidateAsProp","_jsx","BaseText","Object","assign","getStyledProps"],"mappings":"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"}

package/build/lib/native/components/Typography/Heading/getHeadingStyles.js

@@ -0,0 +1,7 @@
+import getBaseTextStyles from '../BaseText/getBaseTextStyles.js';
+import { getHeadingProps } from './Heading.js';
+
+var getHeadingStyles=function getHeadingStyles(_ref){var weight=_ref.weight,size=_ref.size,theme=_ref.theme,color=_ref.color;return getBaseTextStyles(Object.assign({},getHeadingProps({weight:weight,size:size,color:color}),{theme:theme}));};
+
+export { getHeadingStyles as default };
+//# sourceMappingURL=getHeadingStyles.js.map

package/build/lib/native/components/Typography/Heading/getHeadingStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"getHeadingStyles.js","sources":["../../../../../../src/components/Typography/Heading/getHeadingStyles.ts"],"sourcesContent":["import type { CSSObject } from 'styled-components';\nimport getBaseTextStyles from '../BaseText/getBaseTextStyles';\nimport type { HeadingProps } from './Heading';\nimport { getHeadingProps } from './Heading';\nimport type { Theme } from '~components/BladeProvider';\n\nconst getHeadingStyles = ({\n  weight,\n  size,\n  theme,\n  color,\n}: Pick<HeadingProps, 'weight' | 'size' | 'color'> & {\n  theme: Theme;\n}): CSSObject => {\n  return getBaseTextStyles({ ...getHeadingProps({ weight, size, color }), theme });\n};\n\nexport default getHeadingStyles;\n"],"names":["getHeadingStyles","_ref","weight","size","theme","color","getBaseTextStyles","Object","assign","getHeadingProps"],"mappings":";;;AAMM,IAAAA,gBAAgB,CAAG,SAAnBA,gBAAgBA,CAAAC,IAAA,CAOL,CANf,IAAAC,MAAM,CAAAD,IAAA,CAANC,MAAM,CACNC,IAAI,CAAAF,IAAA,CAAJE,IAAI,CACJC,KAAK,CAAAH,IAAA,CAALG,KAAK,CACLC,KAAK,CAAAJ,IAAA,CAALI,KAAK,CAIL,OAAOC,iBAAiB,CAAAC,MAAA,CAAAC,MAAA,CAAA,EAAA,CAAMC,eAAe,CAAC,CAAEP,MAAM,CAANA,MAAM,CAAEC,IAAI,CAAJA,IAAI,CAAEE,KAAK,CAALA,KAAM,CAAC,CAAC,CAAED,CAAAA,KAAK,CAALA,KAAK,EAAE,CAAC,CAClF;;;;"}

package/build/lib/native/components/Typography/Text/Text.js

@@ -12,7 +12,7 @@ import '../../BladeProvider/useTheme.js';
 import { assignWithoutSideEffects } from '../../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
 import { jsx } from 'react/jsx-runtime';
 
-var _excluded=["as","variant","weight","size","truncateAfterLines","children","color","testID","textAlign","textDecorationLine","wordBreak"];var validAsValues=['p','span','div','abbr','figcaption','cite','q','label'];var getTextProps=function getTextProps(_ref){var variant=_ref.variant,weight=_ref.weight,size=_ref.size,_ref$color=_ref.color,color=_ref$color===void 0?'surface.text.gray.normal':_ref$color,testID=_ref.testID,textAlign=_ref.textAlign,textDecorationLine=_ref.textDecorationLine;var props={color:color,fontSize:100,fontWeight:weight!=null?weight:'regular',fontStyle:'normal',lineHeight:100,fontFamily:'text',componentName:'text',testID:testID,textAlign:textAlign,textDecorationLine:textDecorationLine};if(variant==='caption'){if(size&&size!=='small'){if(__DEV__){throwBladeError({moduleName:'Text',message:`size cannot be '${size}' when variant is 'caption'`});}}size='small';}else if(variant!=='caption'&&!size){size='medium';}if(variant==='body'){if(size==='xsmall'){props.fontSize=25;props.lineHeight=25;}if(size==='small'){props.fontSize=75;props.lineHeight=75;}if(size==='medium'){props.fontSize=100;props.lineHeight=100;}if(size==='large'){props.fontSize=200;props.lineHeight=200;}}if(variant==='caption'){if(size==='small'){props.fontSize=50;props.lineHeight=50;props.fontWeight='regular';}props.fontStyle='italic';}return props;};var _Text=function _Text(_ref2){var _ref2$as=_ref2.as,as=_ref2$as===void 0?'p':_ref2$as,_ref2$variant=_ref2.variant,variant=_ref2$variant===void 0?'body':_ref2$variant,_ref2$weight=_ref2.weight,weight=_ref2$weight===void 0?'regular':_ref2$weight,size=_ref2.size,truncateAfterLines=_ref2.truncateAfterLines,children=_ref2.children,color=_ref2.color,testID=_ref2.testID,textAlign=_ref2.textAlign,textDecorationLine=_ref2.textDecorationLine,wordBreak=_ref2.wordBreak,styledProps=_objectWithoutProperties(_ref2,_excluded);var props=Object.assign({as:as,truncateAfterLines:truncateAfterLines,wordBreak:wordBreak},getTextProps({variant:variant,weight:weight,color:color,size:size,testID:testID,textAlign:textAlign,textDecorationLine:textDecorationLine}));useValidateAsProp({componentName:'Text',as:as,validAsValues:validAsValues});return jsx(BaseText,Object.assign({},props,getStyledProps(styledProps),{children:children}));};var Text=assignWithoutSideEffects(_Text,{displayName:'Text',componentId:'Text'});
+var _excluded=["as","variant","weight","size","truncateAfterLines","children","color","testID","textAlign","textDecorationLine","wordBreak"];var validAsValues=['p','span','div','abbr','figcaption','cite','q','label'];var getTextProps=function getTextProps(_ref){var variant=_ref.variant,weight=_ref.weight,size=_ref.size,_ref$color=_ref.color,color=_ref$color===void 0?'surface.text.gray.normal':_ref$color,testID=_ref.testID,textAlign=_ref.textAlign,textDecorationLine=_ref.textDecorationLine;var props={color:color,fontSize:100,fontWeight:weight!=null?weight:'regular',fontStyle:'normal',lineHeight:100,fontFamily:'text',componentName:'text',testID:testID,textAlign:textAlign,textDecorationLine:textDecorationLine};if(variant==='caption'){if(size&&size!=='small'&&size!=='medium'){if(__DEV__){throwBladeError({moduleName:'Text',message:`size cannot be '${size}' when variant is 'caption'`});}size='small';}}else if(variant!=='caption'&&!size){size='medium';}if(variant==='body'){if(size==='xsmall'){props.fontSize=25;props.lineHeight=25;}if(size==='small'){props.fontSize=75;props.lineHeight=75;}if(size==='medium'){props.fontSize=100;props.lineHeight=100;}if(size==='large'){props.fontSize=200;props.lineHeight=200;}}if(variant==='caption'){if(size==='small'){props.fontSize=50;props.lineHeight=50;props.fontWeight='regular';}if(size==='medium'){props.fontSize=100;props.lineHeight=50;props.fontWeight='regular';}props.fontStyle='italic';}return props;};var _Text=function _Text(_ref2){var _ref2$as=_ref2.as,as=_ref2$as===void 0?'p':_ref2$as,_ref2$variant=_ref2.variant,variant=_ref2$variant===void 0?'body':_ref2$variant,_ref2$weight=_ref2.weight,weight=_ref2$weight===void 0?'regular':_ref2$weight,size=_ref2.size,truncateAfterLines=_ref2.truncateAfterLines,children=_ref2.children,color=_ref2.color,testID=_ref2.testID,textAlign=_ref2.textAlign,textDecorationLine=_ref2.textDecorationLine,wordBreak=_ref2.wordBreak,styledProps=_objectWithoutProperties(_ref2,_excluded);var props=Object.assign({as:as,truncateAfterLines:truncateAfterLines,wordBreak:wordBreak},getTextProps({variant:variant,weight:weight,color:color,size:size,testID:testID,textAlign:textAlign,textDecorationLine:textDecorationLine}));useValidateAsProp({componentName:'Text',as:as,validAsValues:validAsValues});return jsx(BaseText,Object.assign({},props,getStyledProps(styledProps),{children:children}));};var Text=assignWithoutSideEffects(_Text,{displayName:'Text',componentId:'Text'});
 
 export { Text, getTextProps };
 //# sourceMappingURL=Text.js.map

package/build/lib/native/components/Typography/Text/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sources":["../../../../../../src/components/Typography/Text/Text.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\nimport type { ReactElement } from 'react';\nimport React from 'react';\nimport { BaseText } from '../BaseText';\nimport type { BaseTextProps, BaseTextSizes } from '../BaseText/types';\nimport { useValidateAsProp } from '../utils';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\n\nconst validAsValues = ['p', 'span', 'div', 'abbr', 'figcaption', 'cite', 'q', 'label'] as const;\ntype TextCommonProps = {\n  as?: typeof validAsValues[number];\n  truncateAfterLines?: number;\n  children: React.ReactNode;\n  weight?: Extract<BaseTextProps['fontWeight'], 'regular' | 'medium' | 'semibold'>;\n  /**\n   * Overrides the color of the Text component.\n   *\n   * **Note** This takes priority over `type` and `contrast` prop to decide color of text\n   */\n  color?: BaseTextProps['color'];\n  textAlign?: BaseTextProps['textAlign'];\n  textDecorationLine?: BaseTextProps['textDecorationLine'];\n  wordBreak?: BaseTextProps['wordBreak'];\n} & TestID &\n  StyledPropsBlade;\n\nexport type TextVariant = 'body' | 'caption';\n\ntype TextBodyVariant = TextCommonProps & {\n  variant?: Extract<TextVariant, 'body'>;\n  size?: Extract<BaseTextSizes, 'xsmall' | 'small' | 'medium' | 'large'>;\n};\n\ntype TextCaptionVariant = TextCommonProps & {\n  variant?: Extract<TextVariant, 'caption'>;\n  size?: Extract<BaseTextSizes, 'small'>;\n};\n\n/**\n * Conditionally changing props based on variant.\n * Overloads or union gives wrong intellisense.\n */\nexport type TextProps<T> = T extends {\n  variant: infer Variant;\n}\n  ? Variant extends 'caption'\n    ? TextCaptionVariant\n    : Variant extends 'body'\n    ? TextBodyVariant\n    : T\n  : T;\n\ntype GetTextPropsReturn = Omit<BaseTextProps, 'children'>;\ntype GetTextProps<T extends { variant: TextVariant }> = Pick<\n  TextProps<T>,\n  'variant' | 'weight' | 'size' | 'color' | 'testID' | 'textAlign' | 'textDecorationLine'\n>;\n\nconst getTextProps = <T extends { variant: TextVariant }>({\n  variant,\n  weight,\n  size,\n  color = 'surface.text.gray.normal',\n  testID,\n  textAlign,\n  textDecorationLine,\n}: GetTextProps<T>): GetTextPropsReturn => {\n  const props: GetTextPropsReturn = {\n    color,\n    fontSize: 100,\n    fontWeight: weight ?? 'regular',\n    fontStyle: 'normal',\n    lineHeight: 100,\n    fontFamily: 'text',\n    componentName: 'text',\n    testID,\n    textAlign,\n    textDecorationLine,\n  };\n\n  if (variant === 'caption') {\n    // variant of caption can only have size of small\n    if (size && size !== 'small') {\n      if (__DEV__) {\n        throwBladeError({\n          moduleName: 'Text',\n          message: `size cannot be '${size}' when variant is 'caption'`,\n        });\n      }\n    }\n    // Force size to be small if variant is caption\n    size = 'small';\n  } else if (variant !== 'caption' && !size) {\n    size = 'medium';\n  }\n\n  if (variant === 'body') {\n    if (size === 'xsmall') {\n      props.fontSize = 25;\n      props.lineHeight = 25;\n    }\n    if (size === 'small') {\n      props.fontSize = 75;\n      props.lineHeight = 75;\n    }\n    if (size === 'medium') {\n      props.fontSize = 100;\n      props.lineHeight = 100;\n    }\n    if (size === 'large') {\n      props.fontSize = 200;\n      props.lineHeight = 200;\n    }\n  }\n  if (variant === 'caption') {\n    if (size === 'small') {\n      props.fontSize = 50;\n      props.lineHeight = 50;\n      props.fontWeight = 'regular';\n    }\n    props.fontStyle = 'italic';\n  }\n\n  return props;\n};\n\nconst _Text = <T extends { variant: TextVariant }>({\n  as = 'p',\n  variant = 'body',\n  weight = 'regular',\n  size,\n  truncateAfterLines,\n  children,\n  color,\n  testID,\n  textAlign,\n  textDecorationLine,\n  wordBreak,\n  ...styledProps\n}: TextProps<T>): ReactElement => {\n  const props: Omit<BaseTextProps, 'children'> = {\n    as,\n    truncateAfterLines,\n    wordBreak,\n    ...getTextProps({\n      variant,\n      weight,\n      color,\n      size,\n      testID,\n      textAlign,\n      textDecorationLine,\n    }),\n  };\n\n  useValidateAsProp({ componentName: 'Text', as, validAsValues });\n\n  return (\n    <BaseText {...props} {...getStyledProps(styledProps)}>\n      {children}\n    </BaseText>\n  );\n};\n\nconst Text = assignWithoutSideEffects(_Text, {\n  displayName: 'Text',\n  componentId: 'Text',\n});\n\nexport { Text, getTextProps };\n"],"names":["validAsValues","getTextProps","_ref","variant","weight","size","_ref$color","color","testID","textAlign","textDecorationLine","props","fontSize","fontWeight","fontStyle","lineHeight","fontFamily","componentName","__DEV__","throwBladeError","moduleName","message","_Text","_ref2","_ref2$as","as","_ref2$variant","_ref2$weight","truncateAfterLines","children","wordBreak","styledProps","_objectWithoutProperties","_excluded","Object","assign","useValidateAsProp","_jsx","BaseText","getStyledProps","Text","assignWithoutSideEffects","displayName","componentId"],"mappings":"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"}
+{"version":3,"file":"Text.js","sources":["../../../../../../src/components/Typography/Text/Text.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unnecessary-type-assertion */\nimport type { ReactElement } from 'react';\nimport React from 'react';\nimport { BaseText } from '../BaseText';\nimport type { BaseTextProps, BaseTextSizes } from '../BaseText/types';\nimport { useValidateAsProp } from '../utils';\nimport { getStyledProps } from '~components/Box/styledProps';\nimport type { StyledPropsBlade } from '~components/Box/styledProps';\nimport type { TestID } from '~utils/types';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\nimport { throwBladeError } from '~utils/logger';\n\nconst validAsValues = ['p', 'span', 'div', 'abbr', 'figcaption', 'cite', 'q', 'label'] as const;\ntype TextCommonProps = {\n  as?: typeof validAsValues[number];\n  truncateAfterLines?: number;\n  children: React.ReactNode;\n  weight?: Extract<BaseTextProps['fontWeight'], 'regular' | 'medium' | 'semibold'>;\n  /**\n   * Overrides the color of the Text component.\n   *\n   * **Note** This takes priority over `type` and `contrast` prop to decide color of text\n   */\n  color?: BaseTextProps['color'];\n  textAlign?: BaseTextProps['textAlign'];\n  textDecorationLine?: BaseTextProps['textDecorationLine'];\n  wordBreak?: BaseTextProps['wordBreak'];\n} & TestID &\n  StyledPropsBlade;\n\nexport type TextVariant = 'body' | 'caption';\n\ntype TextBodyVariant = TextCommonProps & {\n  variant?: Extract<TextVariant, 'body'>;\n  size?: Extract<BaseTextSizes, 'xsmall' | 'small' | 'medium' | 'large'>;\n};\n\ntype TextCaptionVariant = TextCommonProps & {\n  variant?: Extract<TextVariant, 'caption'>;\n  size?: Extract<BaseTextSizes, 'small' | 'medium'>;\n};\n\n/**\n * Conditionally changing props based on variant.\n * Overloads or union gives wrong intellisense.\n */\nexport type TextProps<T> = T extends {\n  variant: infer Variant;\n}\n  ? Variant extends 'caption'\n    ? TextCaptionVariant\n    : Variant extends 'body'\n    ? TextBodyVariant\n    : T\n  : T;\n\ntype GetTextPropsReturn = Omit<BaseTextProps, 'children'>;\ntype GetTextProps<T extends { variant: TextVariant }> = Pick<\n  TextProps<T>,\n  'variant' | 'weight' | 'size' | 'color' | 'testID' | 'textAlign' | 'textDecorationLine'\n>;\n\nconst getTextProps = <T extends { variant: TextVariant }>({\n  variant,\n  weight,\n  size,\n  color = 'surface.text.gray.normal',\n  testID,\n  textAlign,\n  textDecorationLine,\n}: GetTextProps<T>): GetTextPropsReturn => {\n  const props: GetTextPropsReturn = {\n    color,\n    fontSize: 100,\n    fontWeight: weight ?? 'regular',\n    fontStyle: 'normal',\n    lineHeight: 100,\n    fontFamily: 'text',\n    componentName: 'text',\n    testID,\n    textAlign,\n    textDecorationLine,\n  };\n\n  if (variant === 'caption') {\n    // variant of caption can only have size of small\n    if (size && size !== 'small' && size !== 'medium') {\n      if (__DEV__) {\n        throwBladeError({\n          moduleName: 'Text',\n          message: `size cannot be '${size}' when variant is 'caption'`,\n        });\n      }\n      // Set size as small in case of invalid size\n      size = 'small';\n    }\n  } else if (variant !== 'caption' && !size) {\n    size = 'medium';\n  }\n\n  if (variant === 'body') {\n    if (size === 'xsmall') {\n      props.fontSize = 25;\n      props.lineHeight = 25;\n    }\n    if (size === 'small') {\n      props.fontSize = 75;\n      props.lineHeight = 75;\n    }\n    if (size === 'medium') {\n      props.fontSize = 100;\n      props.lineHeight = 100;\n    }\n    if (size === 'large') {\n      props.fontSize = 200;\n      props.lineHeight = 200;\n    }\n  }\n  if (variant === 'caption') {\n    if (size === 'small') {\n      props.fontSize = 50;\n      props.lineHeight = 50;\n      props.fontWeight = 'regular';\n    }\n    if (size === 'medium') {\n      props.fontSize = 100;\n      props.lineHeight = 50;\n      props.fontWeight = 'regular';\n    }\n    props.fontStyle = 'italic';\n  }\n\n  return props;\n};\n\nconst _Text = <T extends { variant: TextVariant }>({\n  as = 'p',\n  variant = 'body',\n  weight = 'regular',\n  size,\n  truncateAfterLines,\n  children,\n  color,\n  testID,\n  textAlign,\n  textDecorationLine,\n  wordBreak,\n  ...styledProps\n}: TextProps<T>): ReactElement => {\n  const props: Omit<BaseTextProps, 'children'> = {\n    as,\n    truncateAfterLines,\n    wordBreak,\n    ...getTextProps({\n      variant,\n      weight,\n      color,\n      size,\n      testID,\n      textAlign,\n      textDecorationLine,\n    }),\n  };\n\n  useValidateAsProp({ componentName: 'Text', as, validAsValues });\n\n  return (\n    <BaseText {...props} {...getStyledProps(styledProps)}>\n      {children}\n    </BaseText>\n  );\n};\n\nconst Text = assignWithoutSideEffects(_Text, {\n  displayName: 'Text',\n  componentId: 'Text',\n});\n\nexport { Text, getTextProps };\n"],"names":["validAsValues","getTextProps","_ref","variant","weight","size","_ref$color","color","testID","textAlign","textDecorationLine","props","fontSize","fontWeight","fontStyle","lineHeight","fontFamily","componentName","__DEV__","throwBladeError","moduleName","message","_Text","_ref2","_ref2$as","as","_ref2$variant","_ref2$weight","truncateAfterLines","children","wordBreak","styledProps","_objectWithoutProperties","_excluded","Object","assign","useValidateAsProp","_jsx","BaseText","getStyledProps","Text","assignWithoutSideEffects","displayName","componentId"],"mappings":"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"}