@telus-uds/components-base 1.2.0 → 1.3.0

package/lib/FlexGrid/FlexGrid.js

@@ -35,9 +35,11 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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 [selectProps, selectedSystemPropTypes] = (0, _utils.selectSystemProps)([_utils.a11yProps, _utils.viewProps]);
 /**
  * A mobile-first flexbox grid.
  */
+
 const FlexGrid = /*#__PURE__*/(0, _react.forwardRef)(({
   limitWidth = true,
   gutter = true,
@@ -86,8 +88,7 @@ const FlexGrid = /*#__PURE__*/(0, _react.forwardRef)(({
   }
 
   const props = { ...(0, _utils.getA11yPropsFromHtmlTag)(tag, accessibilityRole),
-    ..._utils.a11yProps.select(rest),
-    ..._utils.viewProps.select(rest)
+    ...selectProps(rest)
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_GutterContext.default.Provider, {
     value: gutter,
@@ -113,8 +114,7 @@ const styles = _StyleSheet.default.create({
   }
 });
 
-FlexGrid.propTypes = { ..._utils.a11yProps.propTypes,
-  ..._utils.viewProps.types,
+FlexGrid.propTypes = { ...selectedSystemPropTypes,
 
   /**
    * Whether or not to give the grid a fixed width. This also centres the grid horizontally.

package/lib/FlexGrid/helpers/index.js

@@ -8,11 +8,8 @@ exports.default = void 0;
 const applyInheritance = sizes => {
   let prevSize;
   return sizes.map((size, index) => {
-    if (size) {
-      prevSize = size;
-    }
-
     if (size !== undefined) {
+      prevSize = size;
       return size;
     }
 

package/lib/IconButton/IconButton.js

@@ -21,7 +21,7 @@ var _ThemeProvider = require("../ThemeProvider");
 
 var _utils = require("../utils");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _Icon = _interopRequireDefault(require("../Icon"));
 
@@ -91,7 +91,7 @@ const IconButton = /*#__PURE__*/(0, _react.forwardRef)(({
     ...rest
   } = _utils.clickProps.toPressProps(rawRest);
 
-  const a11y = _propTypes2.a11yProps.select({ ...rest,
+  const a11y = _props.a11yProps.select({ ...rest,
     accessibilityRole
   });
 
@@ -125,7 +125,7 @@ const IconButton = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 IconButton.displayName = 'IconButton';
-IconButton.propTypes = { ..._propTypes2.a11yProps.types,
+IconButton.propTypes = { ..._props.a11yProps.types,
   variant: _utils.variantProp.propType,
   tokens: (0, _utils.getTokensPropType)('IconButton'),
   icon: _propTypes.default.elementType.isRequired,

package/lib/Link/LinkBase.js

@@ -15,7 +15,7 @@ var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/export
 
 var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _pressability = require("../utils/pressability");
 
@@ -135,17 +135,17 @@ const LinkBase = /*#__PURE__*/(0, _react.forwardRef)(({
   const {
     onPress,
     ...props
-  } = _propTypes2.clickProps.toPressProps(rawRest);
+  } = _props.clickProps.toPressProps(rawRest);
 
   const {
     hrefAttrs,
     rest
-  } = _propTypes2.hrefAttrsProp.bundle(props);
+  } = _props.hrefAttrsProp.bundle(props);
 
-  const linkPropSet = _propTypes2.linkProps.select({
+  const linkPropSet = _props.linkProps.select({
     accessibilityRole,
     href,
-    onPress: _propTypes2.linkProps.handleHref({
+    onPress: _props.linkProps.handleHref({
       href,
       onPress
     }),
@@ -195,10 +195,10 @@ const LinkBase = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 LinkBase.displayName = 'LinkBase';
-LinkBase.propTypes = { ..._propTypes2.a11yProps.types,
-  ..._propTypes2.linkProps.types,
-  tokens: (0, _propTypes2.getTokensPropType)('Link'),
-  variant: _propTypes2.variantProp.propType,
+LinkBase.propTypes = { ..._props.a11yProps.types,
+  ..._props.linkProps.types,
+  tokens: (0, _props.getTokensPropType)('Link'),
+  variant: _props.variantProp.propType,
 
   /**
    * Optional variant that may be passed down to the link's icon if there is one
@@ -220,7 +220,7 @@ LinkBase.propTypes = { ..._propTypes2.a11yProps.types,
    * On Web if href is passed, React Native Web maps this object's props to
    * `rel`, `target` and `download` attrs.
    */
-  hrefAttrs: _propTypes.default.shape(_propTypes2.hrefAttrsProp.types)
+  hrefAttrs: _propTypes.default.shape(_props.hrefAttrsProp.types)
 };
 
 const staticStyles = _StyleSheet.default.create({

package/lib/List/List.js

@@ -15,7 +15,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _utils = require("../utils");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _ListItem = _interopRequireDefault(require("./ListItem"));
 
@@ -43,7 +43,7 @@ const List = /*#__PURE__*/(0, _react.forwardRef)(({
     default: 'none'
   });
 
-  const a11y = _propTypes2.a11yProps.select(rest);
+  const a11y = _props.a11yProps.select(rest);
 
   const items = _react.Children.map(children, (child, index) => {
     if (child.type.name === _ListItem.default.name) {
@@ -66,7 +66,7 @@ const List = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 List.displayName = 'List';
-List.propTypes = { ..._propTypes2.a11yProps.types,
+List.propTypes = { ..._props.a11yProps.types,
   tokens: (0, _utils.getTokensPropType)('List'),
   variant: _utils.variantProp.propType,
   children: (0, _utils.componentPropType)('ListItem'),

package/lib/Progress/Progress.js

@@ -11,7 +11,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/View"));
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _ThemeProvider = require("../ThemeProvider");
 
@@ -79,7 +79,7 @@ const Progress = /*#__PURE__*/(0, _react.forwardRef)(({
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     ref: ref,
     style: selectProgressStyles(themeTokens),
-    ..._propTypes2.a11yProps.select(rest),
+    ..._props.a11yProps.select(rest),
     children: children
   });
 });

package/lib/Progress/ProgressBar.js

@@ -17,7 +17,7 @@ var _View = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Vi
 
 var _ProgressBarBackground = _interopRequireDefault(require("./ProgressBarBackground"));
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _ThemeProvider = require("../ThemeProvider");
 
@@ -102,7 +102,7 @@ const ProgressBar = /*#__PURE__*/(0, _react.forwardRef)(({
       now: percentage,
       text: `${percentage}%`
     },
-    ..._propTypes2.a11yProps.select(rest)
+    ..._props.a11yProps.select(rest)
   };
   return percentage > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     ref: ref,

package/lib/Radio/Radio.js

@@ -25,7 +25,7 @@ var _ThemeProvider = require("../ThemeProvider");
 
 var _utils = require("../utils");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _StackView = _interopRequireDefault(require("../StackView"));
 
@@ -163,7 +163,7 @@ const Radio = /*#__PURE__*/(0, _react.forwardRef)(({
     if ((event === null || event === void 0 ? void 0 : event.key) === ' ') handleChange(event);
   };
 
-  const accessibilityProps = _propTypes2.a11yProps.select(rest);
+  const accessibilityProps = _props.a11yProps.select(rest);
 
   const uniqueId = (0, _utils.useUniqueId)('radio');
   const inputId = id ?? uniqueId;
@@ -218,7 +218,7 @@ const Radio = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 Radio.displayName = 'Radio';
-Radio.propTypes = { ..._propTypes2.a11yProps.propTypes,
+Radio.propTypes = { ..._props.a11yProps.propTypes,
 
   /**
    * Use `checked` for controlled Radio. For uncontrolled Radio, use the `defaultChecked` prop.

package/lib/Spacer/Spacer.js

@@ -24,8 +24,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 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; }
 
 /**
- * @typedef {import('../utils/propTypes.js').SpacingValue} SpacingValue
- * @typedef {import('../utils/propTypes.js').SpacingObject} SpacingObject
+ * @typedef {import('../utils/props/spacingProps.js').SpacingValue} SpacingValue
+ * @typedef {import('../utils/props/spacingProps.js').SpacingObject} SpacingObject
  */
 const selectSizeStyle = (size, direction) => ({
   // Only apply space in one direction at a time, else large spacers will increase the

package/lib/StackView/getStackedContent.js

@@ -24,7 +24,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 /**
  * @typedef {import('react').ReactChildren} ReactChildren
  * @typedef {import('react').ReactElement} ReactElement
- * @typedef {import('../utils/propTypes.js').SpacingValue} SpacingValue
+ * @typedef {import('../utils/props/spacingProps.js').SpacingValue} SpacingValue
  */
 
 /**

package/lib/StepTracker/StepTracker.js

@@ -21,7 +21,7 @@ var _ThemeProvider = require("../ThemeProvider");
 
 var _utils = require("../utils");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _ViewportProvider = require("../ViewportProvider");
 
@@ -136,7 +136,7 @@ const StepTracker = /*#__PURE__*/(0, _react.forwardRef)(({
       now: current,
       text: steps[current]
     },
-    ..._propTypes2.a11yProps.select(rest)
+    ..._props.a11yProps.select(rest)
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_View.default, {
     ref: ref,

package/lib/Tags/Tags.js

@@ -27,7 +27,7 @@ var _ViewportProvider = require("../ViewportProvider");
 
 var _ThemeProvider = require("../ThemeProvider");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _input = require("../utils/input");
 
@@ -97,14 +97,14 @@ const Tags = /*#__PURE__*/(0, _react.forwardRef)(({
   const themeTokens = (0, _ThemeProvider.useThemeTokens)('Tags', tokens, variant, {
     viewport
   });
-  const stackTokens = (0, _propTypes2.selectTokens)('StackView', themeTokens);
+  const stackTokens = (0, _props.selectTokens)('StackView', themeTokens);
   const {
     direction,
     space
   } = themeTokens;
   const getItemTokens = (0, _ThemeProvider.useThemeTokensCallback)('TagsItem', tokens, variant);
 
-  const getButtonTokens = buttonState => (0, _propTypes2.selectTokens)('Button', getItemTokens(buttonState));
+  const getButtonTokens = buttonState => (0, _props.selectTokens)('Button', getItemTokens(buttonState));
 
   const {
     currentValues,
@@ -117,7 +117,7 @@ const Tags = /*#__PURE__*/(0, _react.forwardRef)(({
     readOnly
   });
 
-  const a11y = _propTypes2.a11yProps.select({
+  const a11y = _props.a11yProps.select({
     accessibilityRole,
     ...rest
   });
@@ -154,7 +154,7 @@ const Tags = /*#__PURE__*/(0, _react.forwardRef)(({
         },
         accessibilityRole: itemA11yRole,
         accessibilityLabel,
-        ..._propTypes2.a11yProps.getPositionInSet(items.length, index)
+        ..._props.a11yProps.getPositionInSet(items.length, index)
       };
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ButtonBase.default, {
         ref: itemRef,
@@ -202,10 +202,10 @@ const Tags = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 Tags.displayName = 'Tags';
-Tags.propTypes = { ..._propTypes2.a11yProps.propTypes,
-  ..._propTypes2.pressProps.propTypes,
-  tokens: (0, _propTypes2.getTokensPropType)('Tags'),
-  variant: _propTypes2.variantProp.propType,
+Tags.propTypes = { ..._props.a11yProps.propTypes,
+  ..._props.pressProps.propTypes,
+  tokens: (0, _props.getTokensPropType)('Tags'),
+  variant: _props.variantProp.propType,
 
   /**
    * If provided, sets a maximum number of items a user may select at once.

package/lib/ThemeProvider/useThemeTokens.js

@@ -14,9 +14,9 @@ var _utils = require("./utils");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /**
- * @typedef {import('../utils/propTypes.js').AppearanceSet} AppearanceSet
- * @typedef {import('../utils/propTypes.js').TokensProp} TokensProp
- * @typedef {import('../utils/propTypes.js').TokensSet} TokensSet
+ * @typedef {import('../utils/props/variantProp.js').AppearanceSet} AppearanceSet
+ * @typedef {import('../utils/props/tokens.js').TokensProp} TokensProp
+ * @typedef {import('../utils/props/tokens.js').TokensSet} TokensSet
  */
 
 /**

package/lib/ThemeProvider/utils/theme-tokens.js

@@ -14,9 +14,9 @@ var _package = _interopRequireDefault(require("../../../package.json"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /**
- * @typedef {import('../../utils/propTypes.js').AppearanceSet} AppearanceSet
- * @typedef {import('../../utils/propTypes.js').TokensProp} TokensProp
- * @typedef {import('../../utils/propTypes.js').TokensSet} TokensSet
+ * @typedef {import('../../utils/props/variantProp.js').AppearanceSet} AppearanceSet
+ * @typedef {import('../../utils/props/tokens.js').TokensProp} TokensProp
+ * @typedef {import('../../utils/props/tokens.js').TokensSet} TokensSet
  */
 
 /**

package/lib/ToggleSwitch/ToggleSwitch.js

@@ -23,7 +23,7 @@ var _StackView = _interopRequireDefault(require("../StackView"));
 
 var _ThemeProvider = require("../ThemeProvider");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _input = require("../utils/input");
 
@@ -37,7 +37,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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 selectButtonTokens = tokens => (0, _propTypes2.selectTokens)('Button', { ...tokens,
+const selectButtonTokens = tokens => (0, _props.selectTokens)('Button', { ...tokens,
   // Width tokens are applied to our inner track. Disable Button width token so it wraps our track width.
   width: null
 }); // Map and rename icon-specific tokens to name used within Icon
@@ -188,10 +188,10 @@ const ToggleSwitch = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 ToggleSwitch.displayName = 'ToggleSwitch';
-ToggleSwitch.propTypes = { ..._propTypes2.a11yProps.propTypes,
-  ..._propTypes2.pressProps.propTypes,
-  tokens: (0, _propTypes2.getTokensPropType)('ToggleSwitch'),
-  variant: _propTypes2.variantProp.propType,
+ToggleSwitch.propTypes = { ..._props.a11yProps.propTypes,
+  ..._props.pressProps.propTypes,
+  tokens: (0, _props.getTokensPropType)('ToggleSwitch'),
+  variant: _props.variantProp.propType,
 
   /**
    * If this is a "controlled" component and a parent handles its selected state,

package/lib/ToggleSwitch/ToggleSwitchGroup.js

@@ -23,7 +23,7 @@ var _ViewportProvider = require("../ViewportProvider");
 
 var _ThemeProvider = require("../ThemeProvider");
 
-var _propTypes2 = require("../utils/propTypes");
+var _props = require("../utils/props");
 
 var _input = require("../utils/input");
 
@@ -77,7 +77,7 @@ const ToggleSwitchGroup = /*#__PURE__*/(0, _react.forwardRef)(({
     readOnly
   });
 
-  const a11y = _propTypes2.a11yProps.select({
+  const a11y = _props.a11yProps.select({
     accessibilityRole,
     ...rest
   });
@@ -104,7 +104,7 @@ const ToggleSwitchGroup = /*#__PURE__*/(0, _react.forwardRef)(({
       },
       accessibilityRole: itemA11yRole,
       accessibilityLabel,
-      ..._propTypes2.a11yProps.getPositionInSet(items.length, index)
+      ..._props.a11yProps.getPositionInSet(items.length, index)
     };
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ToggleSwitch.default, {
       id: id,
@@ -136,10 +136,10 @@ const ToggleSwitchGroup = /*#__PURE__*/(0, _react.forwardRef)(({
   });
 });
 ToggleSwitchGroup.displayName = 'ToggleSwitchGroup';
-ToggleSwitchGroup.propTypes = { ..._propTypes2.a11yProps.propTypes,
-  ..._propTypes2.pressProps.propTypes,
-  tokens: (0, _propTypes2.getTokensPropType)('ToggleSwitchGroup'),
-  variant: _propTypes2.variantProp.propType,
+ToggleSwitchGroup.propTypes = { ..._props.a11yProps.propTypes,
+  ..._props.pressProps.propTypes,
+  tokens: (0, _props.getTokensPropType)('ToggleSwitchGroup'),
+  variant: _props.variantProp.propType,
 
   /**
    * The maximum number of items a user may select at once. Defaults to 1 and behaves
@@ -219,7 +219,7 @@ ToggleSwitchGroup.propTypes = { ..._propTypes2.a11yProps.propTypes,
   /**
    * Toggle switch token overrides.
    */
-  toggleSwitchTokens: (0, _propTypes2.getTokensPropType)('ToggleSwitch'),
+  toggleSwitchTokens: (0, _props.getTokensPropType)('ToggleSwitch'),
 
   /**
    * Current validation status of the group, passed to the feedback element if there is one.

package/lib/utils/a11y/semantics.js

@@ -154,9 +154,10 @@ const getA11yPropsFromHtmlTag = (tag, nativeRole) => {
   };
 
   if (tag) {
-    const accessibilityRole = tagsToRoles[tag];
-    if (accessibilityRole) return {
-      accessibilityRole
+    // aria roles don't have native counterparts and RN may throw an error if an unrecognised role is passed
+    const ariaRole = _Platform.default.OS === 'web' && tagsToRoles[tag];
+    if (ariaRole) return {
+      accessibilityRole: ariaRole
     };
     const accessibilityLevel = getHeadingLevel(tag);
     if (accessibilityLevel) return {

package/lib/utils/index.js

@@ -125,16 +125,16 @@ Object.keys(_pressability).forEach(function (key) {
   });
 });
 
-var _propTypes = require("./propTypes");
+var _props = require("./props");
 
-Object.keys(_propTypes).forEach(function (key) {
+Object.keys(_props).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _propTypes[key]) return;
+  if (key in exports && exports[key] === _props[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
-      return _propTypes[key];
+      return _props[key];
     }
   });
 });

package/lib/utils/pressability.js

@@ -9,7 +9,7 @@ var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/export
 
 var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
 
-var _propTypes = require("./propTypes");
+var _pressProps = _interopRequireDefault(require("./props/pressProps"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -108,7 +108,7 @@ const staticStyles = _StyleSheet.default.create(_Platform.default.select({
 
 const getPressHandlersWithArgs = (pressableProps = {}, args = []) => {
   // Allow handlers to be passed down for blur, hover, focus, pressIn, etc
-  const pressHandlers = Object.fromEntries(Object.entries(_propTypes.pressProps.selectHandlers(pressableProps)).map(([key, handler]) => ({
+  const pressHandlers = Object.fromEntries(Object.entries(_pressProps.default.selectHandlers(pressableProps)).map(([key, handler]) => ({
     [key]: (...defaultArgs) => {
       // Pass each handler data on this button and current selection
       handler(...args, ...defaultArgs);

package/lib/utils/props/a11yProps.js

@@ -0,0 +1,153 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
+
+var _getPropSelector = _interopRequireDefault(require("./getPropSelector"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// React Native exports a11y prop definitions as TypeScript Interfaces, but no longer exports PropTypes
+// so we have to define them ourselves.
+const nativeA11yPropTypes = {
+  accessible: _propTypes.default.bool,
+  focusable: _propTypes.default.bool,
+  accessibilityElementsHidden: _propTypes.default.bool,
+  accessibilityHint: _propTypes.default.string,
+  // react-native-web ignores `accessibilityHint`
+  accessibilityIgnoresInvertColors: _propTypes.default.bool,
+  accessibilityLabel: _propTypes.default.string,
+  accessibilityRole: _propTypes.default.string,
+  accessibilityActions: _propTypes.default.arrayOf(_propTypes.default.shape({
+    name: _propTypes.default.string.isRequired,
+    label: _propTypes.default.string
+  })),
+  accessibilityLiveRegion: _propTypes.default.oneOf(['none', 'polite', 'assertive']),
+  accessibilityState: _propTypes.default.shape({
+    disabled: _propTypes.default.bool,
+    selected: _propTypes.default.bool,
+    checked: _propTypes.default.oneOf([true, false, 'mixed']),
+    busy: _propTypes.default.bool,
+    expanded: _propTypes.default.bool
+  }),
+  accessibilityValue: _propTypes.default.shape({
+    min: _propTypes.default.number,
+    max: _propTypes.default.number,
+    now: _propTypes.default.number,
+    text: _propTypes.default.string
+  }),
+  accessibilityViewIsModal: _propTypes.default.bool,
+  importantForAccessibility: _propTypes.default.oneOf(['auto', 'yes', 'no', 'no-hide-descendants']),
+  onAccessibilityAction: _propTypes.default.func,
+  onAccessibilityEscape: _propTypes.default.func,
+  onAccessibilityTap: _propTypes.default.func
+};
+const a11yPropTypes = { ...nativeA11yPropTypes,
+  // React Native Web adds many a11y props that alias aria-* attributes
+  // Types based on https://necolas.github.io/react-native-web/docs/accessibility/
+  accessibilityActiveDescendant: _propTypes.default.string,
+  accessibilityAtomic: _propTypes.default.bool,
+  accessibilityAutoComplete: _propTypes.default.string,
+  accessibilityBusy: _propTypes.default.bool,
+  accessibilityChecked: _propTypes.default.oneOf([true, false, 'mixed']),
+  accessibilityColumnCount: _propTypes.default.number,
+  accessibilityColumnIndex: _propTypes.default.number,
+  accessibilityColumnSpan: _propTypes.default.number,
+  accessibilityControls: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
+  accessibilityCurrent: _propTypes.default.oneOf([true, false, 'page', 'step', 'location', 'date', 'time']),
+  accessibilityDescribedBy: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
+  accessibilityDetails: _propTypes.default.string,
+  accessibilityDisabled: _propTypes.default.bool,
+  accessibilityErrorMessage: _propTypes.default.string,
+  accessibilityExpanded: _propTypes.default.bool,
+  accessibilityFlowTo: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
+  accessibilityHasPopup: _propTypes.default.string,
+  accessibilityHidden: _propTypes.default.bool,
+  accessibilityInvalid: _propTypes.default.bool,
+  accessibilityKeyShortcuts: _propTypes.default.string,
+  accessibilityLabelledBy: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
+  accessibilityLevel: _propTypes.default.number,
+  accessibilityModal: _propTypes.default.bool,
+  accessibilityMultiline: _propTypes.default.bool,
+  accessibilityMultiSelectable: _propTypes.default.bool,
+  accessibilityOrientation: _propTypes.default.oneOf(['horizontal', 'vertical']),
+  accessibilityOwns: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.arrayOf(_propTypes.default.string)]),
+  accessibilityPlaceholder: _propTypes.default.string,
+  accessibilityPosInSet: _propTypes.default.number,
+  accessibilityPressed: _propTypes.default.bool,
+  accessibilityReadOnly: _propTypes.default.bool,
+  accessibilityRequired: _propTypes.default.bool,
+  accessibilityRoleDescription: _propTypes.default.string,
+  accessibilityRowCount: _propTypes.default.number,
+  accessibilityRowIndex: _propTypes.default.number,
+  accessibilityRowSpan: _propTypes.default.number,
+  accessibilitySelected: _propTypes.default.bool,
+  accessibilitySetSize: _propTypes.default.number,
+  accessibilitySort: _propTypes.default.oneOf(['ascending', 'descending', 'none', 'other']),
+  accessibilityValueMax: _propTypes.default.number,
+  accessibilityValueMin: _propTypes.default.number,
+  accessibilityValueNow: _propTypes.default.number,
+  accessibilityValueText: _propTypes.default.string
+};
+var _default = {
+  /**
+   * Proptypes for recognised React Native accessiblity (a11y) props.
+   * Spread this in the propTypes of components that accept React Native a11y props.
+   */
+  types: a11yPropTypes,
+
+  /**
+   * Filters a props object, returning only recognised React Native accessiblity (a11y) props.
+   *
+   * Where components accept React Native a11y props, pass { ...rest } from its props to this,
+   * then spread the returned object into the component's props (usually its outer container).
+   */
+  select: (0, _getPropSelector.default)(a11yPropTypes, /^aria-/),
+
+  /**
+   * Use this to disable focus for elements which are visually hidden but still rendered.
+   */
+  nonFocusableProps: {
+    focusable: false,
+    // for android, and for keyboard nav in web
+    ..._Platform.default.select({
+      web: {
+        accessibilityHidden: true // web screenreaders
+
+      },
+      android: {
+        importantForAccessibility: 'no-hide-descendants'
+      },
+      ios: {
+        accessibilityElementsHidden: true
+      }
+    })
+  },
+
+  /**
+   * Generates an object of platform-appropriate a11y props describing an item that has an
+   * ordered position in a set. Examples of usage by accessibility tools includes screenreaders
+   * saying "Item X of Y" when this item is select.
+   *
+   * @param {number} itemsCount - the number of items in the set
+   * @param {number} index - the current item's index in the set
+   * @returns {object} - platform-applicable a11y props describing this position (if available)
+   */
+  getPositionInSet: (itemsCount, index) => _Platform.default.select({
+    web: {
+      // accessibilityPosInSet etc exists in React Native Web main branch
+      // but not in a release compatible with Expo etc; just use `aria-*`
+      'aria-setsize': itemsCount,
+      'aria-posinset': index + 1
+    },
+    // No equivalents exist on the native side
+    default: {}
+  })
+};
+exports.default = _default;