@telus-uds/components-base 0.0.2-prerelease.4 → 0.0.2-prerelease.8

package/__tests__/Tooltip/Tooltip.test.jsx

@@ -0,0 +1,65 @@
+import React from 'react'
+import { fireEvent, render } from '@testing-library/react-native'
+
+import { Text } from 'react-native'
+import { Tooltip } from '../../src'
+
+import Theme from '../../__fixtures__/Theme'
+import Viewport from '../../__fixtures__/Viewport'
+
+const wrapper = ({ children }) => (
+  <Theme>
+    <Viewport>{children}</Viewport>
+  </Theme>
+)
+
+const content = 'tooltip content'
+
+describe('Tooltip', () => {
+  it('renders content after control is pressed', () => {
+    const { queryByText, getByA11yRole } = render(<Tooltip content={content} />, { wrapper })
+
+    expect(queryByText(content)).toBeFalsy()
+
+    fireEvent.press(getByA11yRole('button'))
+
+    expect(queryByText(content)).not.toBeFalsy()
+  })
+
+  it("renders custom control, and renders content after it's pressed", () => {
+    const { queryByTestId, getByA11yRole, queryByText } = render(
+      <Tooltip content={content}>
+        <Text testID="control" />
+      </Tooltip>,
+      { wrapper }
+    )
+
+    expect(queryByTestId('control')).not.toBeFalsy()
+
+    expect(queryByText(content)).toBeFalsy()
+
+    fireEvent.press(getByA11yRole('button'))
+
+    expect(queryByText(content)).not.toBeFalsy()
+  })
+
+  it("renders custom control render function, and renders content after it's pressed", () => {
+    const { queryByTestId, getByA11yRole, queryByText } = render(
+      <Tooltip content={content} variant={{ inverse: true }}>
+        {(pressableState, variant) => (
+          <Text testID="control">{variant.inverse ? 'Inverse' : 'Default'}</Text>
+        )}
+      </Tooltip>,
+      { wrapper }
+    )
+
+    expect(queryByTestId('control')).not.toBeFalsy()
+    expect(queryByText('Inverse')).not.toBeFalsy()
+
+    expect(queryByText(content)).toBeFalsy()
+
+    fireEvent.press(getByA11yRole('button'))
+
+    expect(queryByText(content)).not.toBeFalsy()
+  })
+})

package/__tests__/Tooltip/getTooltipPosition.test.js

@@ -0,0 +1,79 @@
+import getTooltipPosition from '../../lib/Tooltip/getTooltipPosition'
+
+const windowDimensions = {
+  width: 320,
+  height: 400
+}
+
+const tooltipDimensions = {
+  width: 200,
+  height: 40
+}
+
+describe('getTooltipPosition()', () => {
+  it('automatically places the tooltip within viewport', () => {
+    const controlLayout = {
+      right: { x: 20, y: 20 }, // control in top-left corner
+      left: { x: windowDimensions.width - 20, y: 20 }, // control in top-right corner
+      above: { x: windowDimensions.width / 2, y: windowDimensions.height - 20 }, // control in bottom center
+      below: { x: windowDimensions.width / 2, y: 20 } // control in top center
+    }
+
+    Object.keys(controlLayout).forEach((position) => {
+      const result = getTooltipPosition('auto', {
+        controlLayout: { width: 20, height: 20, ...controlLayout[position] },
+        tooltipDimensions,
+        windowDimensions
+      })
+
+      expect(result.position).toBe(position)
+    })
+  })
+
+  it('places the tooltip in the position from prop if that fits within viewport', () => {
+    const controlLayout = {
+      right: { x: 20, y: 20 }, // control in top-left corner
+      left: { x: windowDimensions.width - 20, y: 20 }, // control in top-right corner
+      above: { x: windowDimensions.width / 2, y: windowDimensions.height - 20 }, // control in bottom center
+      below: { x: windowDimensions.width / 2, y: 20 } // control in top center
+    }
+
+    Object.keys(controlLayout).forEach((position) => {
+      const positionProp = position // this would normally come from the component's prop
+
+      const result = getTooltipPosition(positionProp, {
+        controlLayout: { width: 20, height: 20, ...controlLayout[position] },
+        tooltipDimensions,
+        windowDimensions
+      })
+
+      expect(result.position).toBe(position)
+    })
+  })
+
+  it("places the tooltip in a different position if prop wouldn't fit in the viewport", () => {
+    const controlLayout = {
+      right: { x: 20, y: 20 }, // control in top-left corner
+      left: { x: windowDimensions.width - 20, y: 20 }, // control in top-right corner
+      above: { x: windowDimensions.width / 2, y: windowDimensions.height - 20 }, // control in bottom center
+      below: { x: windowDimensions.width / 2, y: 20 } // control in top center
+    }
+
+    const positionProp = {
+      right: 'left',
+      left: 'right',
+      above: 'below',
+      below: 'above'
+    }
+
+    Object.keys(controlLayout).forEach((position) => {
+      const result = getTooltipPosition(positionProp[position], {
+        controlLayout: { width: 20, height: 20, ...controlLayout[position] },
+        tooltipDimensions,
+        windowDimensions
+      })
+
+      expect(result.position).toBe(position)
+    })
+  })
+})

package/__tests__/utils/input.test.js

@@ -90,6 +90,17 @@ describe('useInputValue (uncontrolled)', () => {
     expect(result.current.currentValue).toBe('some value')
   })
 
+  it('Changes currentValue based on old value when `setValue` is passed a function', () => {
+    const { result } = renderHook(() => useInputValue({ initialValue: 1 }))
+    expect(result.current.currentValue).toBe(1)
+
+    act(() => result.current.setValue((oldValue) => oldValue + 1))
+    expect(result.current.currentValue).toBe(2)
+
+    act(() => result.current.setValue((oldValue) => oldValue + 2))
+    expect(result.current.currentValue).toBe(4)
+  })
+
   it('Sets currentValue to initialValue if provided, which may be changed', () => {
     const { result } = renderHook(() => useInputValue({ initialValue: 'first value' }))
     expect(result.current.currentValue).toBe('first value')
@@ -210,6 +221,29 @@ describe('useMultipleInputValues (uncontrolled)', () => {
     expect(result.current.currentValues).toEqual(['second value', 'third value'])
   })
 
+  it('Replaces values on calling setValues', () => {
+    const { result } = renderHook(() =>
+      useMultipleInputValues({
+        initialValues: ['first value', 'second value', 'third value']
+      })
+    )
+    act(() => result.current.setValues(['new value', 'another value']))
+    expect(result.current.currentValues).toEqual(['new value', 'another value'])
+  })
+
+  it('Replaces values based on old values on passing function to setValues', () => {
+    const { result } = renderHook(() =>
+      useMultipleInputValues({
+        initialValues: [1, 2, 3, 4]
+      })
+    )
+    act(() => result.current.setValues((oldValues) => oldValues.map((value) => value + 1)))
+    expect(result.current.currentValues).toEqual([2, 3, 4, 5])
+
+    act(() => result.current.setValues((oldValues) => oldValues.map((value) => value + 2)))
+    expect(result.current.currentValues).toEqual([4, 5, 6, 7])
+  })
+
   it('Empties values on calling unsetValues', () => {
     const { result } = renderHook(() =>
       useMultipleInputValues({
@@ -237,6 +271,18 @@ describe('useInputValue (controlled)', () => {
     expect(onChange.mock.calls[0][0]).toEqual('second value')
   })
 
+  it('Calls `onChange` with result from old value when `setValue` is passed a function', () => {
+    const onChange = jest.fn((arg) => arg)
+    const { result } = renderHook(() => useInputValue({ value: 1, onChange }))
+    expect(result.current.currentValue).toBe(1)
+    expect(onChange).toHaveBeenCalledTimes(0)
+
+    act(() => result.current.setValue((oldValue) => oldValue + 1))
+    expect(result.current.currentValue).toBe(1)
+    expect(onChange).toHaveBeenCalledTimes(1)
+    expect(onChange.mock.calls[0][0]).toEqual(2)
+  })
+
   it('Returns updated `currentValue` when non-undefined `value` prop changes', () => {
     const onChange = () => {}
     const { result, rerender } = renderHook(({ value }) => useInputValue({ value, onChange }), {
@@ -296,6 +342,18 @@ describe('useMultipleInputValues (controlled)', () => {
     expect(onChange.mock.calls[0][0]).toEqual(['second value', 'third value'])
   })
 
+  it('Calls `onChange` with results from old values when `setValues` is passed a function', () => {
+    const onChange = jest.fn((arg) => arg)
+    const { result } = renderHook(() => useMultipleInputValues({ values: [1, 2, 3, 4], onChange }))
+    expect(result.current.currentValues).toEqual([1, 2, 3, 4])
+    expect(onChange).toHaveBeenCalledTimes(0)
+
+    act(() => result.current.setValues((oldValues) => oldValues.map((value) => value + 1)))
+    expect(result.current.currentValues).toEqual([1, 2, 3, 4])
+    expect(onChange).toHaveBeenCalledTimes(1)
+    expect(onChange.mock.calls[0][0]).toEqual([2, 3, 4, 5])
+  })
+
   it('Calls onChange with an empty array on calling unsetValues', () => {
     const onChange = jest.fn((arg) => arg)
     const { result, rerender } = renderHook(

package/__tests__/utils/useCopy.test.js

@@ -0,0 +1,42 @@
+import { renderHook } from '@testing-library/react-hooks'
+import useCopy from '../../lib/utils/useCopy'
+
+const dictionary = {
+  en: {
+    'translation key': 'english version'
+  },
+  fr: {
+    'translation key': 'french version'
+  }
+}
+
+describe('useCopy hook', () => {
+  it('returns a correct english translation', () => {
+    const { result } = renderHook(() => useCopy({ dictionary, copy: 'en' }))
+
+    const getCopy = result.current
+    expect(getCopy('translation key')).toBe('english version')
+  })
+
+  it('returns a correct french translation', () => {
+    const { result } = renderHook(() => useCopy({ dictionary, copy: 'fr' }))
+
+    const getCopy = result.current
+    expect(getCopy('translation key')).toBe('french version')
+  })
+
+  it('returns undefined when no translation is found', () => {
+    const { result } = renderHook(() => useCopy({ dictionary, copy: 'en' }))
+
+    const getCopy = result.current
+    expect(getCopy('non-existing key')).toBe(undefined)
+  })
+
+  it('allows for overriding the entire dictionary with a copy object (ignoring the dictionary argument)', () => {
+    const { result } = renderHook(() => useCopy({ dictionary, copy: dictionary.en }))
+
+    const getCopy = result.current
+    expect(getCopy('non-existing key')).toBe(undefined)
+    expect(getCopy('translation key')).toBe('english version')
+  })
+})

package/__tests__/utils/useResponsiveProp.test.jsx

@@ -0,0 +1,202 @@
+import React from 'react'
+import { renderHook } from '@testing-library/react-hooks'
+import useResponsiveProp from '../../src/utils/useResponsiveProp'
+import Viewport from '../../__fixtures__/Viewport'
+
+const wrapper = ({ children, viewport }) => <Viewport viewport={viewport}>{children}</Viewport>
+
+describe('useResponsiveProp', () => {
+  it('returns viewport indexes that explicitly match current value', () => {
+    const responsiveProp = { xs: 1, sm: 2, md: 3, lg: 4, xl: 5 }
+    const { rerender, result } = renderHook((args) => useResponsiveProp(args.responsiveProp), {
+      wrapper,
+      initialProps: { viewport: 'xs', responsiveProp }
+    })
+    expect(result.current).toBe(1)
+    rerender({ viewport: 'sm', responsiveProp })
+    expect(result.current).toBe(2)
+    rerender({ viewport: 'md', responsiveProp })
+    expect(result.current).toBe(3)
+    rerender({ viewport: 'lg', responsiveProp })
+    expect(result.current).toBe(4)
+    rerender({ viewport: 'xl', responsiveProp })
+    expect(result.current).toBe(5)
+  })
+
+  it('returns viewport indexes that implicitly match current value', () => {
+    const responsiveProp = { sm: 2, lg: 4 }
+    const { rerender, result } = renderHook((args) => useResponsiveProp(args.responsiveProp), {
+      wrapper,
+      initialProps: { viewport: 'xs', responsiveProp }
+    })
+    expect(result.current).toBe(undefined)
+    rerender({ viewport: 'sm', responsiveProp })
+    expect(result.current).toBe(2)
+    rerender({ viewport: 'md', responsiveProp })
+    expect(result.current).toBe(2)
+    rerender({ viewport: 'lg', responsiveProp })
+    expect(result.current).toBe(4)
+    rerender({ viewport: 'xl', responsiveProp })
+    expect(result.current).toBe(4)
+  })
+
+  it('returns provided defaultValue where there is no match', () => {
+    const responsiveProp = { md: 2, lg: 4 }
+    const defaultValue = 'some default value'
+    const { rerender, result } = renderHook(
+      (args) => useResponsiveProp(args.responsiveProp, args.defaultValue),
+      {
+        wrapper,
+        initialProps: { viewport: 'xs', responsiveProp, defaultValue }
+      }
+    )
+    expect(result.current).toBe(defaultValue)
+    rerender({ viewport: 'sm', responsiveProp, defaultValue })
+    expect(result.current).toBe(defaultValue)
+    rerender({ viewport: 'md', responsiveProp, defaultValue })
+    expect(result.current).toBe(2)
+    rerender({ viewport: 'lg', responsiveProp, defaultValue })
+    expect(result.current).toBe(4)
+    rerender({ viewport: 'xl', responsiveProp, defaultValue })
+    expect(result.current).toBe(4)
+  })
+
+  it('applies falsy values appropriately (replacing `undefined` with default value)', () => {
+    const responsiveProp = { sm: '', md: null, lg: false, xl: undefined }
+    const defaultValue = 0
+    const { rerender, result } = renderHook(
+      (args) => useResponsiveProp(args.responsiveProp, args.defaultValue),
+      {
+        wrapper,
+        initialProps: { viewport: 'xs', responsiveProp, defaultValue }
+      }
+    )
+    expect(result.current).toBe(0)
+    rerender({ viewport: 'sm', responsiveProp, defaultValue })
+    expect(result.current).toBe('')
+    rerender({ viewport: 'md', responsiveProp, defaultValue })
+    expect(result.current).toBe(null)
+    rerender({ viewport: 'lg', responsiveProp, defaultValue })
+    expect(result.current).toBe(false)
+    rerender({ viewport: 'xl', responsiveProp, defaultValue })
+    expect(result.current).toBe(false)
+  })
+
+  it('returns a non-object prop unchanged', () => {
+    const exactFn = () => {}
+    const defaultValue = 'some value'
+    const { rerender, result } = renderHook(
+      (args) => useResponsiveProp(args.responsiveProp, args.defaultValue),
+      {
+        wrapper,
+        initialProps: { viewport: 'xs', responsiveProp: exactFn, defaultValue }
+      }
+    )
+    expect(result.current).toBe(exactFn)
+    rerender({ viewport: 'sm', responsiveProp: exactFn, defaultValue })
+    expect(result.current).toBe(exactFn)
+    rerender({ viewport: 'md', responsiveProp: exactFn, defaultValue })
+    expect(result.current).toBe(exactFn)
+    rerender({ viewport: 'lg', responsiveProp: exactFn, defaultValue })
+    expect(result.current).toBe(exactFn)
+    rerender({ viewport: 'xl', responsiveProp: exactFn, defaultValue })
+    expect(result.current).toBe(exactFn)
+  })
+
+  it('returns a falsy value including explicit null unchanged, default value if undefined', () => {
+    const defaultValue = 'some value'
+    const { rerender, result } = renderHook(
+      (args) => useResponsiveProp(args.responsiveProp, args.defaultValue),
+      {
+        wrapper,
+        initialProps: { viewport: 'xs', responsiveProp: null, defaultValue }
+      }
+    )
+    expect(result.current).toBe(null)
+    rerender({ viewport: 'sm', responsiveProp: false, defaultValue })
+    expect(result.current).toBe(false)
+    rerender({ viewport: 'md', responsiveProp: 0, defaultValue })
+    expect(result.current).toBe(0)
+    rerender({ viewport: 'lg', responsiveProp: '', defaultValue })
+    expect(result.current).toBe('')
+    rerender({ viewport: 'xl', responsiveProp: undefined, defaultValue })
+    expect(result.current).toBe(defaultValue)
+  })
+
+  it('returns a non-responsive object unchanged, rather than the default value', () => {
+    const nonresponsiveProp = { a: 1, b: 2 }
+    const defaultValue = 'some value'
+    const { rerender, result } = renderHook(
+      (args) => useResponsiveProp(args.responsiveProp, args.defaultValue),
+      {
+        wrapper,
+        initialProps: { viewport: 'xs', responsiveProp: nonresponsiveProp, defaultValue }
+      }
+    )
+    expect(result.current).toBe(nonresponsiveProp)
+    rerender({ viewport: 'sm', responsiveProp: nonresponsiveProp, defaultValue })
+    expect(result.current).toBe(nonresponsiveProp)
+    rerender({ viewport: 'md', responsiveProp: nonresponsiveProp, defaultValue })
+    expect(result.current).toBe(nonresponsiveProp)
+    rerender({ viewport: 'lg', responsiveProp: nonresponsiveProp, defaultValue })
+    expect(result.current).toBe(nonresponsiveProp)
+    rerender({ viewport: 'xl', responsiveProp: nonresponsiveProp, defaultValue })
+    expect(result.current).toBe(nonresponsiveProp)
+  })
+
+  it('returns the smallest viewport property if current viewport value is missing', () => {
+    const responsiveProp = { xl: 5, lg: 4, md: 3 }
+    const defaultValue = 'some value'
+    const { result } = renderHook(
+      (args) => useResponsiveProp(args.responsiveProp, args.defaultValue),
+      {
+        initialProps: { responsiveProp, defaultValue }
+      }
+    )
+    expect(result.current).toBe(3)
+  })
+
+  it('treats a responsive prop with extra non-responsive properties as responsive', () => {
+    const responsiveProp = { md: 3, lg: 4, options: { a: 1, b: 2 } }
+    const defaultValue = 'some value'
+    const { rerender, result } = renderHook(
+      (args) => useResponsiveProp(args.responsiveProp, args.defaultValue),
+      {
+        wrapper,
+        initialProps: { viewport: 'xs', responsiveProp, defaultValue }
+      }
+    )
+    expect(result.current).toBe(defaultValue)
+    rerender({ viewport: 'sm', responsiveProp, defaultValue })
+    expect(result.current).toBe(defaultValue)
+    rerender({ viewport: 'md', responsiveProp, defaultValue })
+    expect(result.current).toBe(3)
+    rerender({ viewport: 'lg', responsiveProp, defaultValue })
+    expect(result.current).toBe(4)
+    rerender({ viewport: 'xl', responsiveProp, defaultValue })
+    expect(result.current).toBe(4)
+  })
+
+  it('treats an object with only explicitly-undefined viewport properties as responsive', () => {
+    // For example, if some logic generates the values for each viewport of a responsive prop,
+    // and in a certain case, they happen to all come out as `undefined`.
+    const responsiveProp = { sm: undefined, lg: undefined, options: { a: 1, b: 2 } }
+    const defaultValue = 'some value'
+    const { rerender, result } = renderHook(
+      (args) => useResponsiveProp(args.responsiveProp, args.defaultValue),
+      {
+        wrapper,
+        initialProps: { viewport: 'xs', responsiveProp, defaultValue }
+      }
+    )
+    expect(result.current).toBe(defaultValue)
+    rerender({ viewport: 'sm', responsiveProp, defaultValue })
+    expect(result.current).toBe(defaultValue)
+    rerender({ viewport: 'md', responsiveProp, defaultValue })
+    expect(result.current).toBe(defaultValue)
+    rerender({ viewport: 'lg', responsiveProp, defaultValue })
+    expect(result.current).toBe(defaultValue)
+    rerender({ viewport: 'xl', responsiveProp, defaultValue })
+    expect(result.current).toBe(defaultValue)
+  })
+})

package/__tests__/utils/{spacing.test.jsx → useSpacingScale.test.jsx}

@@ -1,6 +1,6 @@
 import React from 'react'
 import { renderHook } from '@testing-library/react-hooks'
-import { useSpacingScale } from '../../src/utils/spacing'
+import { useSpacingScale } from '../../src/utils'
 import Theme from '../../__fixtures__/Theme'
 import Viewport from '../../__fixtures__/Viewport'
 

package/__tests__/utils/useUniqueId.test.js

@@ -0,0 +1,31 @@
+import { renderHook } from '@testing-library/react-hooks'
+import useUniqueId from '../../lib/utils/useUniqueId'
+
+describe('useUniqueId hook', () => {
+  it('returns the same id for each re-render, but a different id for a new instance', () => {
+    const { result, rerender } = renderHook(() => useUniqueId('prefix'))
+
+    expect(result.current).toBe('prefix-1')
+
+    rerender()
+
+    expect(result.current).toBe('prefix-1')
+
+    // has to be done within the same test case, as we can't ensure order in which tests are being run in parallel
+    const { result: result2, rerender: rerender2 } = renderHook(() => useUniqueId('prefix'))
+
+    expect(result.current).toBe('prefix-1')
+    expect(result2.current).toBe('prefix-2')
+
+    // ensure that instances' rerendering doesn't affect one another
+    rerender2()
+
+    expect(result.current).toBe('prefix-1')
+    expect(result2.current).toBe('prefix-2')
+
+    rerender()
+
+    expect(result.current).toBe('prefix-1')
+    expect(result2.current).toBe('prefix-2')
+  })
+})

package/babel.config.js

@@ -0,0 +1,20 @@
+module.exports = {
+  env: {
+    /*
+     * we actually want this setup to be used whenever we're not in `test` but
+     * babel merges plugins array rather than replacing so we can't set it as a
+     * default. However the default BABEL_ENV value is development (jest sets it
+     * to test)
+     */
+    development: {
+      presets: ['@babel/preset-env', ['@babel/preset-react', { runtime: 'automatic' }]],
+      plugins: [['react-native-web', { commonjs: true }]]
+    },
+    /*
+     * jest is testing for just ios at the moment, use a preset which best matches that env
+     */
+    test: {
+      presets: ['module:metro-react-native-babel-preset']
+    }
+  }
+}

package/jest.config.js

@@ -13,11 +13,17 @@ module.exports = {
     // __dirname here tells babel to look in components-base for babel root when running from monorepo root
     '\\.(js|jsx)$': ['babel-jest', { cwd: __dirname }]
   },
-  setupFilesAfterEnv: ['@testing-library/jest-native/extend-expect'],
+  setupFilesAfterEnv: [
+    '@testing-library/jest-native/extend-expect',
+    // Fail tests that use console.error or console.warn
+    '<rootDir>/../../jest-no-console'
+  ],
   moduleNameMapper: {
     '.+\\.(otf|svg|png|jpg)$': 'identity-obj-proxy'
   },
-  transformIgnorePatterns: preset.transformIgnorePatterns,
+  transformIgnorePatterns: [
+    'node_modules/(?!(jest-)?react-native|@react-native|@react-native-community|@react-native-picker)'
+  ],
   // Count everything in src when calculating coverage
   collectCoverageFrom: ['src/**/*.{js,jsx}']
 }

package/lib/A11yInfoProvider/index.js

@@ -1,58 +1,86 @@
-import React, { createContext, useContext, useEffect, useState } from 'react';
-import PropTypes from 'prop-types';
-import { AccessibilityInfo, Platform } from 'react-native';
-const ScreenReaderContext = /*#__PURE__*/createContext(false);
-const ReducedMotionContext = /*#__PURE__*/createContext(false);
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useA11yInfo = exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _AccessibilityInfo = _interopRequireDefault(require("react-native-web/dist/cjs/exports/AccessibilityInfo"));
+
+var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const ScreenReaderContext = /*#__PURE__*/(0, _react.createContext)(false);
+const ReducedMotionContext = /*#__PURE__*/(0, _react.createContext)(false);
 
 const A11yInfoProvider = ({
   children
 }) => {
-  const [reduceMotionEnabled, setReduceMotionEnabled] = useState(false);
-  const [screenReaderEnabled, setScreenReaderEnabled] = useState(false);
-  useEffect(() => {
+  const [reduceMotionEnabled, setReduceMotionEnabled] = (0, _react.useState)(false);
+  const [screenReaderEnabled, setScreenReaderEnabled] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
     if (process.env.NODE_ENV === 'test') {
       // On Jest these effects do nothing but can cause `act` state change warnings
       // and "...after the Jest environment has been torn down" errors, so skip them.
       return () => {};
     }
 
-    AccessibilityInfo.addEventListener('reduceMotionChanged', setReduceMotionEnabled);
-    AccessibilityInfo.addEventListener('screenReaderChanged', setScreenReaderEnabled);
+    _AccessibilityInfo.default.addEventListener('reduceMotionChanged', setReduceMotionEnabled);
+
+    _AccessibilityInfo.default.addEventListener('screenReaderChanged', setScreenReaderEnabled);
 
     const setInitialA11yInfo = async () => {
-      const [initialReduceMotionEnabled, initialScreenReaderEnabled] = await Promise.all([AccessibilityInfo.isReduceMotionEnabled(), AccessibilityInfo.isScreenReaderEnabled()]); // Browsers can't detect screen readers; in RNW isScreenReaderEnabled() is always `true`
+      const [initialReduceMotionEnabled, initialScreenReaderEnabled] = await Promise.all([_AccessibilityInfo.default.isReduceMotionEnabled(), _AccessibilityInfo.default.isScreenReaderEnabled()]); // Browsers can't detect screen readers; in RNW isScreenReaderEnabled() is always `true`
       // https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/exports/AccessibilityInfo/index.js#L14
 
-      setScreenReaderEnabled(Platform.OS !== 'web' && !!initialScreenReaderEnabled); // RNW does support isReduceMotionEnabled looking for 'prefers-reduced-motion' state
+      setScreenReaderEnabled(_Platform.default.OS !== 'web' && !!initialScreenReaderEnabled); // RNW does support isReduceMotionEnabled looking for 'prefers-reduced-motion' state
 
       setReduceMotionEnabled(!!initialReduceMotionEnabled);
     };
 
-    if (AccessibilityInfo.isReduceMotionEnabled && AccessibilityInfo.isScreenReaderEnabled) {
+    if (_AccessibilityInfo.default.isReduceMotionEnabled && _AccessibilityInfo.default.isScreenReaderEnabled) {
       setInitialA11yInfo();
     }
 
     return () => {
-      AccessibilityInfo.removeEventListener('reduceMotionChanged', setReduceMotionEnabled);
-      AccessibilityInfo.removeEventListener('screenReaderChanged', setScreenReaderEnabled);
+      _AccessibilityInfo.default.removeEventListener('reduceMotionChanged', setReduceMotionEnabled);
+
+      _AccessibilityInfo.default.removeEventListener('screenReaderChanged', setScreenReaderEnabled);
     };
   }, []);
-  return /*#__PURE__*/React.createElement(ReducedMotionContext.Provider, {
-    value: reduceMotionEnabled
-  }, /*#__PURE__*/React.createElement(ScreenReaderContext.Provider, {
-    value: screenReaderEnabled
-  }, children));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ReducedMotionContext.Provider, {
+    value: reduceMotionEnabled,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ScreenReaderContext.Provider, {
+      value: screenReaderEnabled,
+      children: children
+    })
+  });
 };
 
 A11yInfoProvider.propTypes = {
-  children: PropTypes.node.isRequired
+  children: _propTypes.default.node.isRequired
 };
-export default A11yInfoProvider;
-export const useA11yInfo = () => {
-  const screenReaderEnabled = useContext(ScreenReaderContext);
-  const reduceMotionEnabled = useContext(ReducedMotionContext);
+var _default = A11yInfoProvider;
+exports.default = _default;
+
+const useA11yInfo = () => {
+  const screenReaderEnabled = (0, _react.useContext)(ScreenReaderContext);
+  const reduceMotionEnabled = (0, _react.useContext)(ReducedMotionContext);
   return {
     reduceMotionEnabled,
     screenReaderEnabled
   };
-};
+};
+
+exports.useA11yInfo = useA11yInfo;