react-intl 6.0.6 → 6.1.1

package/src/components/injectIntl.tsx

@@ -1,111 +0,0 @@
-import * as React from 'react'
-import hoistNonReactStatics from 'hoist-non-react-statics'
-import {invariantIntlContext} from '../utils'
-import {IntlShape} from '../types'
-
-function getDisplayName(Component: React.ComponentType<any>): string {
-  return Component.displayName || Component.name || 'Component'
-}
-
-// TODO: We should provide initial value here
-const IntlContext = React.createContext<IntlShape>(null as any)
-const {Consumer: IntlConsumer, Provider: IntlProvider} = IntlContext
-
-export const Provider = IntlProvider
-export const Context = IntlContext
-
-export interface Opts<
-  IntlPropName extends string = 'intl',
-  ForwardRef extends boolean = false
-> {
-  intlPropName?: IntlPropName
-  forwardRef?: ForwardRef
-  enforceContext?: boolean
-}
-
-export type WrappedComponentProps<IntlPropName extends string = 'intl'> = {
-  [k in IntlPropName]: IntlShape
-}
-
-export type WithIntlProps<P> = Omit<P, keyof WrappedComponentProps> & {
-  forwardedRef?: React.Ref<any>
-}
-
-// TODO: type hoisted static methods.
-// Non ref forwarding overload
-export default function injectIntl<
-  IntlPropName extends string = 'intl',
-  P extends WrappedComponentProps<IntlPropName> = WrappedComponentProps<any>
->(
-  WrappedComponent: React.ComponentType<P>,
-  options?: Opts<IntlPropName, false>
-): React.FC<WithIntlProps<P>> & {
-  WrappedComponent: React.ComponentType<P>
-}
-// Ref forwarding overload.
-export default function injectIntl<
-  IntlPropName extends string = 'intl',
-  P extends WrappedComponentProps<IntlPropName> = WrappedComponentProps<any>,
-  T extends React.ComponentType<P> = any
->(
-  WrappedComponent: React.ComponentType<P>,
-  options?: Opts<IntlPropName, true>
-): React.ForwardRefExoticComponent<
-  React.PropsWithoutRef<WithIntlProps<React.PropsWithChildren<P>>> &
-    React.RefAttributes<T>
-> & {
-  WrappedComponent: React.ComponentType<P>
-}
-export default function injectIntl<
-  IntlPropName extends string = 'intl',
-  P extends WrappedComponentProps<IntlPropName> = WrappedComponentProps<any>,
-  ForwardRef extends boolean = false,
-  T extends React.ComponentType<P> = any
->(
-  WrappedComponent: React.ComponentType<P>,
-  options?: Opts<IntlPropName, ForwardRef>
-): React.ForwardRefExoticComponent<
-  React.PropsWithoutRef<WithIntlProps<P>> & React.RefAttributes<T>
-> & {
-  WrappedComponent: React.ComponentType<P>
-} {
-  const {
-    intlPropName = 'intl',
-    forwardRef = false,
-    enforceContext = true,
-  } = options || {}
-
-  const WithIntl: React.FC<P & {forwardedRef?: React.Ref<any>}> & {
-    WrappedComponent: React.ComponentType<P>
-  } = props => (
-    <IntlConsumer>
-      {(intl): React.ReactNode => {
-        if (enforceContext) {
-          invariantIntlContext(intl)
-        }
-        const intlProp = {[intlPropName]: intl}
-
-        return (
-          <WrappedComponent
-            {...props}
-            {...intlProp}
-            ref={forwardRef ? props.forwardedRef : null}
-          />
-        )
-      }}
-    </IntlConsumer>
-  )
-  WithIntl.displayName = `injectIntl(${getDisplayName(WrappedComponent)})`
-  WithIntl.WrappedComponent = WrappedComponent
-
-  if (forwardRef) {
-    return hoistNonReactStatics(
-      React.forwardRef<T, P>((props: P, ref) => (
-        <WithIntl {...props} forwardedRef={ref} />
-      )),
-      WrappedComponent
-    ) as any
-  }
-
-  return hoistNonReactStatics(WithIntl, WrappedComponent) as any
-}

package/src/components/message.tsx

@@ -1,73 +0,0 @@
-/*
- * Copyright 2015, Yahoo Inc.
- * Copyrights licensed under the New BSD License.
- * See the accompanying LICENSE file for terms.
- */
-
-import * as React from 'react'
-import type {
-  FormatXMLElementFn,
-  Options as IntlMessageFormatOptions,
-  PrimitiveType,
-} from 'intl-messageformat'
-
-import {MessageDescriptor} from '@formatjs/intl'
-import useIntl from './useIntl'
-import {shallowEqual} from '../utils'
-
-export interface Props<
-  V extends Record<string, any> = Record<
-    string,
-    | React.ReactNode
-    | PrimitiveType
-    | FormatXMLElementFn<React.ReactNode, React.ReactNode>
-  >
-> extends MessageDescriptor {
-  values?: V
-  tagName?: React.ElementType<any>
-  children?(nodes: React.ReactNode[]): React.ReactElement | null
-  ignoreTag?: IntlMessageFormatOptions['ignoreTag']
-}
-
-function areEqual(prevProps: Props, nextProps: Props): boolean {
-  const {values, ...otherProps} = prevProps
-  const {values: nextValues, ...nextOtherProps} = nextProps
-  return (
-    shallowEqual(nextValues, values) &&
-    shallowEqual(otherProps as any, nextOtherProps)
-  )
-}
-
-function FormattedMessage(props: Props) {
-  const intl = useIntl()
-  const {formatMessage, textComponent: Text = React.Fragment} = intl
-  const {
-    id,
-    description,
-    defaultMessage,
-    values,
-    children,
-    tagName: Component = Text,
-    ignoreTag,
-  } = props
-
-  const descriptor = {id, description, defaultMessage}
-  let nodes: React.ReactNode = formatMessage(descriptor, values, {
-    ignoreTag,
-  })
-
-  if (typeof children === 'function') {
-    return children(Array.isArray(nodes) ? nodes : [nodes])
-  }
-
-  if (Component) {
-    return <Component>{React.Children.toArray(nodes)}</Component>
-  }
-  return <>{nodes}</>
-}
-FormattedMessage.displayName = 'FormattedMessage'
-
-const MemoizedFormattedMessage = React.memo<Props>(FormattedMessage, areEqual)
-MemoizedFormattedMessage.displayName = 'MemoizedFormattedMessage'
-
-export default MemoizedFormattedMessage

package/src/components/plural.tsx

@@ -1,45 +0,0 @@
-/*
- * Copyright 2015, Yahoo Inc.
- * Copyrights licensed under the New BSD License.
- * See the accompanying LICENSE file for terms.
- */
-
-import * as React from 'react'
-import {FormatPluralOptions} from '@formatjs/intl'
-import useIntl from './useIntl'
-
-interface Props extends FormatPluralOptions {
-  value: number
-  other: React.ReactNode
-  zero?: React.ReactNode
-  one?: React.ReactNode
-  two?: React.ReactNode
-  few?: React.ReactNode
-  many?: React.ReactNode
-  children?(value: React.ReactNode): React.ReactElement | null
-}
-
-const FormattedPlural: React.FC<Props> = props => {
-  const {formatPlural, textComponent: Text} = useIntl()
-  const {value, other, children} = props
-
-  const pluralCategory = formatPlural(value, props)
-  const formattedPlural = props[pluralCategory as 'one'] || other
-
-  if (typeof children === 'function') {
-    return children(formattedPlural)
-  }
-  if (Text) {
-    return <Text>{formattedPlural}</Text>
-  }
-  // Work around @types/react where React.FC cannot return string
-  return formattedPlural as any
-}
-
-FormattedPlural.defaultProps = {
-  type: 'cardinal',
-}
-
-FormattedPlural.displayName = 'FormattedPlural'
-
-export default FormattedPlural

package/src/components/provider.tsx

@@ -1,196 +0,0 @@
-/*
- * Copyright 2015, Yahoo Inc.
- * Copyrights licensed under the New BSD License.
- * See the accompanying LICENSE file for terms.
- */
-
-import * as React from 'react'
-import {Provider} from './injectIntl'
-import {
-  DEFAULT_INTL_CONFIG,
-  invariantIntlContext,
-  assignUniqueKeysToParts,
-  shallowEqual,
-} from '../utils'
-import type {IntlConfig, IntlShape, ResolvedIntlConfig} from '../types'
-import {
-  formatMessage as coreFormatMessage,
-  IntlCache,
-  createIntl as coreCreateIntl,
-  CreateIntlFn,
-  createIntlCache,
-  FormatMessageFn,
-} from '@formatjs/intl'
-
-import {
-  PrimitiveType,
-  FormatXMLElementFn,
-  isFormatXMLElementFn,
-} from 'intl-messageformat'
-
-interface State {
-  /**
-   * Explicit intl cache to prevent memory leaks
-   */
-  cache: IntlCache
-  /**
-   * Intl object we created
-   */
-  intl?: IntlShape
-  /**
-   * list of memoized config we care about.
-   * This is important since creating intl is
-   * very expensive
-   */
-  prevConfig: IntlConfig
-}
-
-function processIntlConfig<P extends IntlConfig = IntlConfig>(
-  config: P
-): IntlConfig {
-  return {
-    locale: config.locale,
-    timeZone: config.timeZone,
-    fallbackOnEmptyString: config.fallbackOnEmptyString,
-    formats: config.formats,
-    textComponent: config.textComponent,
-    messages: config.messages,
-    defaultLocale: config.defaultLocale,
-    defaultFormats: config.defaultFormats,
-    onError: config.onError,
-    onWarn: config.onWarn,
-    wrapRichTextChunksInFragment: config.wrapRichTextChunksInFragment,
-    defaultRichTextElements: config.defaultRichTextElements,
-  }
-}
-
-function assignUniqueKeysToFormatXMLElementFnArgument<
-  T extends Record<
-    string,
-    | PrimitiveType
-    | React.ReactNode
-    | FormatXMLElementFn<React.ReactNode, React.ReactNode>
-  > = Record<
-    string,
-    | PrimitiveType
-    | React.ReactNode
-    | FormatXMLElementFn<React.ReactNode, React.ReactNode>
-  >
->(values?: T): T | undefined {
-  if (!values) {
-    return values
-  }
-  return Object.keys(values).reduce((acc: T, k) => {
-    const v = values[k]
-    ;(acc as any)[k] = isFormatXMLElementFn<React.ReactNode>(v)
-      ? assignUniqueKeysToParts(v)
-      : v
-    return acc
-  }, {} as T)
-}
-
-const formatMessage: FormatMessageFn<React.ReactNode> = (
-  config,
-  formatters,
-  descriptor,
-  rawValues,
-  ...rest
-) => {
-  const values = assignUniqueKeysToFormatXMLElementFnArgument(rawValues)
-  const chunks = coreFormatMessage(
-    config,
-    formatters,
-    descriptor,
-    values as any,
-    ...rest
-  )
-  if (Array.isArray(chunks)) {
-    return React.Children.toArray(chunks)
-  }
-  return chunks as any
-}
-
-/**
- * Create intl object
- * @param config intl config
- * @param cache cache for formatter instances to prevent memory leak
- */
-export const createIntl: CreateIntlFn<
-  React.ReactNode,
-  IntlConfig,
-  IntlShape
-> = (
-  {defaultRichTextElements: rawDefaultRichTextElements, ...config},
-  cache
-) => {
-  const defaultRichTextElements = assignUniqueKeysToFormatXMLElementFnArgument(
-    rawDefaultRichTextElements
-  )
-  const coreIntl = coreCreateIntl<React.ReactNode>(
-    {
-      ...DEFAULT_INTL_CONFIG,
-      ...config,
-      defaultRichTextElements,
-    },
-    cache
-  )
-
-  const resolvedConfig: ResolvedIntlConfig = {
-    locale: coreIntl.locale,
-    timeZone: coreIntl.timeZone,
-    fallbackOnEmptyString: coreIntl.fallbackOnEmptyString,
-    formats: coreIntl.formats,
-    defaultLocale: coreIntl.defaultLocale,
-    defaultFormats: coreIntl.defaultFormats,
-    messages: coreIntl.messages,
-    onError: coreIntl.onError,
-    defaultRichTextElements,
-  }
-
-  return {
-    ...coreIntl,
-    // @ts-expect-error fix this
-    formatMessage: formatMessage.bind(
-      null,
-      resolvedConfig,
-      coreIntl.formatters
-    ),
-    // @ts-expect-error fix this
-    $t: formatMessage.bind(null, resolvedConfig, coreIntl.formatters),
-  } as any
-}
-
-export default class IntlProvider extends React.PureComponent<
-  // Exporting children props so it is composable with other HOCs.
-  // See: https://github.com/formatjs/formatjs/issues/1697
-  React.PropsWithChildren<IntlConfig>,
-  State
-> {
-  static displayName = 'IntlProvider'
-  static defaultProps = DEFAULT_INTL_CONFIG
-  private cache: IntlCache = createIntlCache()
-  state: State = {
-    cache: this.cache,
-    intl: createIntl(processIntlConfig(this.props), this.cache),
-    prevConfig: processIntlConfig(this.props),
-  }
-
-  static getDerivedStateFromProps(
-    props: Readonly<IntlConfig>,
-    {prevConfig, cache}: State
-  ): Partial<State> | null {
-    const config = processIntlConfig(props)
-    if (!shallowEqual(prevConfig, config)) {
-      return {
-        intl: createIntl(config, cache),
-        prevConfig: config,
-      }
-    }
-    return null
-  }
-
-  render(): JSX.Element {
-    invariantIntlContext(this.state.intl)
-    return <Provider value={this.state.intl}>{this.props.children}</Provider>
-  }
-}

package/src/components/relative.tsx

@@ -1,192 +0,0 @@
-/*
- * Copyright 2015, Yahoo Inc.
- * Copyrights licensed under the New BSD License.
- * See the accompanying LICENSE file for terms.
- */
-import * as React from 'react'
-import {
-  invariant,
-  RelativeTimeFormatSingularUnit,
-} from '@formatjs/ecma402-abstract'
-import {FormatRelativeTimeOptions} from '@formatjs/intl'
-import useIntl from './useIntl'
-
-const MINUTE = 60
-const HOUR = 60 * 60
-const DAY = 60 * 60 * 24
-
-function selectUnit(seconds: number): RelativeTimeFormatSingularUnit {
-  const absValue = Math.abs(seconds)
-
-  if (absValue < MINUTE) {
-    return 'second'
-  }
-
-  if (absValue < HOUR) {
-    return 'minute'
-  }
-
-  if (absValue < DAY) {
-    return 'hour'
-  }
-
-  return 'day'
-}
-
-function getDurationInSeconds(unit?: RelativeTimeFormatSingularUnit): number {
-  switch (unit) {
-    case 'second':
-      return 1
-    case 'minute':
-      return MINUTE
-    case 'hour':
-      return HOUR
-    default:
-      return DAY
-  }
-}
-
-function valueToSeconds(
-  value?: number,
-  unit?: RelativeTimeFormatSingularUnit
-): number {
-  if (!value) {
-    return 0
-  }
-  switch (unit) {
-    case 'second':
-      return value
-    case 'minute':
-      return value * MINUTE
-    default:
-      return value * HOUR
-  }
-}
-
-export interface Props extends FormatRelativeTimeOptions {
-  value?: number
-  unit?: RelativeTimeFormatSingularUnit
-  updateIntervalInSeconds?: number
-  children?(value: string): React.ReactElement | null
-}
-
-const INCREMENTABLE_UNITS: RelativeTimeFormatSingularUnit[] = [
-  'second',
-  'minute',
-  'hour',
-]
-function canIncrement(
-  unit: RelativeTimeFormatSingularUnit = 'second'
-): boolean {
-  return INCREMENTABLE_UNITS.indexOf(unit) > -1
-}
-
-const SimpleFormattedRelativeTime: React.FC<
-  Omit<Props, 'updateIntervalInSeconds'>
-> = props => {
-  const {formatRelativeTime, textComponent: Text} = useIntl()
-  const {children, value, unit, ...otherProps} = props
-
-  const formattedRelativeTime = formatRelativeTime(value || 0, unit, otherProps)
-
-  if (typeof children === 'function') {
-    return children(formattedRelativeTime)
-  }
-  if (Text) {
-    return <Text>{formattedRelativeTime}</Text>
-  }
-  return <>{formattedRelativeTime}</>
-}
-
-const FormattedRelativeTime: React.FC<Props> = ({
-  value,
-  unit,
-  updateIntervalInSeconds,
-  ...otherProps
-}) => {
-  invariant(
-    !updateIntervalInSeconds ||
-      !!(updateIntervalInSeconds && canIncrement(unit)),
-    'Cannot schedule update with unit longer than hour'
-  )
-  const [prevUnit, setPrevUnit] = React.useState<
-    RelativeTimeFormatSingularUnit | undefined
-  >()
-  const [prevValue, setPrevValue] = React.useState<number>(0)
-  const [currentValueInSeconds, setCurrentValueInSeconds] =
-    React.useState<number>(0)
-  let updateTimer: number
-
-  if (unit !== prevUnit || value !== prevValue) {
-    setPrevValue(value || 0)
-    setPrevUnit(unit)
-    setCurrentValueInSeconds(
-      canIncrement(unit) ? valueToSeconds(value, unit) : 0
-    )
-  }
-
-  React.useEffect(() => {
-    function clearUpdateTimer() {
-      clearTimeout(updateTimer)
-    }
-    clearUpdateTimer()
-    // If there's no interval and we cannot increment this unit, do nothing
-    if (!updateIntervalInSeconds || !canIncrement(unit)) {
-      return clearUpdateTimer
-    }
-    // Figure out the next interesting time
-    const nextValueInSeconds = currentValueInSeconds - updateIntervalInSeconds
-    const nextUnit = selectUnit(nextValueInSeconds)
-    // We've reached the max auto incrementable unit, don't schedule another update
-    if (nextUnit === 'day') {
-      return clearUpdateTimer
-    }
-
-    const unitDuration = getDurationInSeconds(nextUnit)
-    const remainder = nextValueInSeconds % unitDuration
-    const prevInterestingValueInSeconds = nextValueInSeconds - remainder
-    const nextInterestingValueInSeconds =
-      prevInterestingValueInSeconds >= currentValueInSeconds
-        ? prevInterestingValueInSeconds - unitDuration
-        : prevInterestingValueInSeconds
-    const delayInSeconds = Math.abs(
-      nextInterestingValueInSeconds - currentValueInSeconds
-    )
-
-    if (currentValueInSeconds !== nextInterestingValueInSeconds) {
-      updateTimer = setTimeout(
-        () => setCurrentValueInSeconds(nextInterestingValueInSeconds),
-        delayInSeconds * 1e3
-      ) as unknown as number
-    }
-    return clearUpdateTimer
-  }, [currentValueInSeconds, updateIntervalInSeconds, unit])
-
-  let currentValue = value || 0
-  let currentUnit = unit
-
-  if (
-    canIncrement(unit) &&
-    typeof currentValueInSeconds === 'number' &&
-    updateIntervalInSeconds
-  ) {
-    currentUnit = selectUnit(currentValueInSeconds)
-    const unitDuration = getDurationInSeconds(currentUnit)
-    currentValue = Math.round(currentValueInSeconds / unitDuration)
-  }
-  return (
-    <SimpleFormattedRelativeTime
-      value={currentValue}
-      unit={currentUnit}
-      {...otherProps}
-    />
-  )
-}
-
-FormattedRelativeTime.displayName = 'FormattedRelativeTime'
-FormattedRelativeTime.defaultProps = {
-  value: 0,
-  unit: 'second',
-}
-
-export default FormattedRelativeTime

package/src/components/useIntl.ts

@@ -1,10 +0,0 @@
-import * as React from 'react'
-import {Context} from './injectIntl'
-import {invariantIntlContext} from '../utils'
-import {IntlShape} from '../types'
-
-export default function useIntl(): IntlShape {
-  const intl = React.useContext(Context)
-  invariantIntlContext(intl)
-  return intl
-}

package/src/types.ts

@@ -1,29 +0,0 @@
-/*
- * Copyright 2015, Yahoo Inc.
- * Copyrights licensed under the New BSD License.
- * See the accompanying LICENSE file for terms.
- */
-import * as React from 'react'
-import {
-  ResolvedIntlConfig as CoreResolvedIntlConfig,
-  IntlFormatters,
-  Formatters,
-} from '@formatjs/intl'
-import {DEFAULT_INTL_CONFIG} from './utils'
-export type IntlConfig = Omit<
-  ResolvedIntlConfig,
-  keyof typeof DEFAULT_INTL_CONFIG
-> &
-  Partial<typeof DEFAULT_INTL_CONFIG>
-
-export interface ResolvedIntlConfig
-  extends CoreResolvedIntlConfig<React.ReactNode> {
-  textComponent?: React.ComponentType | keyof React.ReactHTML
-  wrapRichTextChunksInFragment?: boolean
-}
-
-export interface IntlShape
-  extends ResolvedIntlConfig,
-    IntlFormatters<React.ReactNode> {
-  formatters: Formatters
-}