@telus-uds/components-base 1.7.1 → 1.8.2

package/lib-module/FlexGrid/FlexGrid.js

@@ -1,147 +0,0 @@
-import React, { forwardRef } from 'react';
-import PropTypes from 'prop-types';
-import View from "react-native-web/dist/exports/View";
-import StyleSheet from "react-native-web/dist/exports/StyleSheet";
-import { viewports } from '@telus-uds/system-constants';
-import Row from './Row';
-import Col from './Col';
-import { useViewport } from '../ViewportProvider';
-import GutterContext from './providers/GutterContext';
-import applyInheritance from './helpers';
-import { a11yProps, viewProps, getA11yPropsFromHtmlTag, layoutTags, selectSystemProps } from '../utils';
-import { jsx as _jsx } from "react/jsx-runtime";
-const [selectProps, selectedSystemPropTypes] = selectSystemProps([a11yProps, viewProps]);
-/**
- * A mobile-first flexbox grid.
- */
-
-const FlexGrid = /*#__PURE__*/forwardRef(({
-  limitWidth = true,
-  gutter = true,
-  outsideGutter = true,
-  xsReverse,
-  smReverse,
-  mdReverse,
-  lgReverse,
-  xlReverse,
-  tag,
-  accessibilityRole,
-  children,
-  ...rest
-}, ref) => {
-  const viewPort = useViewport();
-  const reverseLevel = applyInheritance([xsReverse, smReverse, mdReverse, lgReverse, xlReverse]);
-  const marginVertical = 0;
-  const marginHorizontal = outsideGutter ? 'auto' : -16;
-  const width = outsideGutter ? '100%' : 'auto';
-  let flexDirection;
-  let maxWidth;
-
-  if (viewPort === viewports.xs) {
-    // no maxWidth for xs
-    flexDirection = reverseLevel[0] ? 'column-reverse' : 'column';
-  }
-
-  if (viewPort === viewports.sm) {
-    maxWidth = limitWidth && viewports.map.get(viewports.sm);
-    flexDirection = reverseLevel[1] ? 'column-reverse' : 'column';
-  }
-
-  if (viewPort === viewports.md) {
-    maxWidth = limitWidth && viewports.map.get(viewports.md);
-    flexDirection = reverseLevel[2] ? 'column-reverse' : 'column';
-  }
-
-  if (viewPort === viewports.lg) {
-    maxWidth = limitWidth && viewports.map.get(viewports.lg);
-    flexDirection = reverseLevel[3] ? 'column-reverse' : 'column';
-  }
-
-  if (viewPort === viewports.xl) {
-    maxWidth = limitWidth && viewports.map.get(viewports.xl);
-    flexDirection = reverseLevel[4] ? 'column-reverse' : 'column';
-  }
-
-  const props = { ...getA11yPropsFromHtmlTag(tag, accessibilityRole),
-    ...selectProps(rest)
-  };
-  return /*#__PURE__*/_jsx(GutterContext.Provider, {
-    value: gutter,
-    children: /*#__PURE__*/_jsx(View, {
-      ref: ref,
-      ...props,
-      style: [styles.grid, {
-        marginHorizontal,
-        marginVertical,
-        width,
-        flexDirection,
-        maxWidth
-      }],
-      children: children
-    })
-  });
-});
-FlexGrid.displayName = 'FlexGrid';
-const styles = StyleSheet.create({
-  grid: {
-    flexWrap: 'wrap'
-  }
-});
-FlexGrid.propTypes = { ...selectedSystemPropTypes,
-
-  /**
-   * Whether or not to give the grid a fixed width. This also centres the grid horizontally.
-   */
-  limitWidth: PropTypes.bool,
-
-  /**
-   * Whether or not to include gutters in between columns.
-   */
-  gutter: PropTypes.bool,
-
-  /**
-   * Whether or not to include gutter at the ends to the left and right of the FlexGrid
-   */
-  outsideGutter: PropTypes.bool,
-
-  /**
-   * Choose if the item order should be reversed from the 'xs' breakpoint. When you pass in false, the order will be normal from the xs breakpoint. By default, it inherits the behaviour set by the preceding prop.
-   */
-  xsReverse: PropTypes.bool,
-
-  /**
-   * Choose if the item order should be reversed from the 'sm' breakpoint. When you pass in false, the order will be normal from the sm breakpoint. By default, it inherits the behaviour set by the preceding prop.
-   */
-  smReverse: PropTypes.bool,
-
-  /**
-   * Choose if the item order should be reversed from the 'md' breakpoint. When you pass in false, the order will be normal from the md breakpoint. By default, it inherits the behaviour set by the preceding prop.
-   */
-  mdReverse: PropTypes.bool,
-
-  /**
-   * Choose if the item order should be reversed from the 'lg' breakpoint. When you pass in false, the order will be normal from the lg breakpoint. By default, it inherits the behaviour set by the preceding prop.
-   */
-  lgReverse: PropTypes.bool,
-
-  /**
-   * Choose if the item order should be reversed from the 'xl' breakpoint. When you pass in false, the order will be normal from the xl breakpoint. By default, it inherits the behaviour set by the preceding prop.
-   */
-  xlReverse: PropTypes.bool,
-
-  /**
-   * Optional semantic HTML tag, to apply to the container on web. Does not change styling.
-   *
-   * In native apps, if a header tag is provided ("h1", "h2" etc) and accessibilityRole prop
-   * is not defined, the accessibilityRole will default to "heading".
-   */
-  tag: PropTypes.oneOf(layoutTags),
-
-  /**
-   * The rows and columns of the Grid. Will typically be `FlexGrid.Row` and `FlexGrid.Col` components.
-   */
-  children: PropTypes.node.isRequired
-};
-FlexGrid.Row = Row;
-FlexGrid.Col = Col;
-export default FlexGrid;

package/lib-module/FlexGrid/Row/Row.js

@@ -1,183 +0,0 @@
-import React, { forwardRef } from 'react';
-import PropTypes from 'prop-types';
-import View from "react-native-web/dist/exports/View";
-import StyleSheet from "react-native-web/dist/exports/StyleSheet";
-import { viewports } from '@telus-uds/system-constants';
-import { useViewport } from '../../ViewportProvider';
-import applyInheritance from '../helpers';
-import { jsx as _jsx } from "react/jsx-runtime";
-
-const horizontalAlignStyles = horizontalAlign => {
-  switch (horizontalAlign) {
-    case 'start':
-      return {
-        justifyContent: 'flex-start',
-        textAlign: 'left'
-      };
-
-    case 'center':
-      return {
-        justifyContent: 'center',
-        textAlign: 'center'
-      };
-
-    case 'end':
-      return {
-        justifyContent: 'flex-end',
-        textAlign: 'right'
-      };
-
-    default:
-      return {};
-  }
-};
-
-const verticalAlignStyles = verticalAlign => {
-  switch (verticalAlign) {
-    case 'top':
-      return {
-        alignItems: 'flex-start'
-      };
-
-    case 'middle':
-      return {
-        alignItems: 'center'
-      };
-
-    case 'bottom':
-      return {
-        alignItems: 'flex-end'
-      };
-
-    default:
-      return {};
-  }
-};
-
-const distributeStyles = distribute => {
-  switch (distribute) {
-    case 'between':
-      return {
-        justifyContent: 'space-between'
-      };
-
-    case 'around':
-      return {
-        justifyContent: 'space-around'
-      };
-
-    default:
-      return {};
-  }
-};
-
-const Row = /*#__PURE__*/forwardRef(({
-  horizontalAlign,
-  verticalAlign,
-  distribute,
-  xsReverse,
-  smReverse,
-  mdReverse,
-  lgReverse,
-  xlReverse,
-  children,
-  ...rest
-}, ref) => {
-  const viewPort = useViewport();
-  const reverseLevel = applyInheritance([xsReverse, smReverse, mdReverse, lgReverse, xlReverse]);
-  let flexDirection = '';
-  let flexWrap = '';
-
-  if (viewPort === viewports.xs) {
-    flexDirection = reverseLevel[0] ? 'row-reverse' : 'row';
-    flexWrap = reverseLevel[0] ? 'wrap-reverse' : 'wrap';
-  }
-
-  if (viewPort === viewports.sm) {
-    flexDirection = reverseLevel[1] ? 'row-reverse' : 'row';
-    flexWrap = reverseLevel[1] ? 'wrap-reverse' : 'wrap';
-  }
-
-  if (viewPort === viewports.md) {
-    flexDirection = reverseLevel[2] ? 'row-reverse' : 'row';
-    flexWrap = reverseLevel[2] ? 'wrap-reverse' : 'wrap';
-  }
-
-  if (viewPort === viewports.lg) {
-    flexDirection = reverseLevel[3] ? 'row-reverse' : 'row';
-    flexWrap = reverseLevel[3] ? 'wrap-reverse' : 'wrap';
-  }
-
-  if (viewPort === viewports.xl) {
-    flexDirection = reverseLevel[4] ? 'row-reverse' : 'row';
-    flexWrap = reverseLevel[4] ? 'wrap-reverse' : 'wrap';
-  }
-
-  return /*#__PURE__*/_jsx(View, {
-    ref: ref,
-    ...rest,
-    style: [styles.row, {
-      flexDirection,
-      flexWrap,
-      ...horizontalAlignStyles(horizontalAlign),
-      ...verticalAlignStyles(verticalAlign),
-      ...distributeStyles(distribute)
-    }],
-    children: children
-  });
-});
-Row.displayName = 'Row';
-const styles = StyleSheet.create({
-  row: {
-    width: '100%',
-    marginVertical: 0,
-    marginHorizontal: 'auto',
-    flexGrow: 0,
-    flexShrink: 1,
-    flexBasis: 'auto',
-    flexDirection: 'row'
-  }
-});
-Row.propTypes = {
-  /**
-   * Align columns horizontally within their row.
-   */
-  horizontalAlign: PropTypes.oneOf(['start', 'center', 'end']),
-
-  /**
-   * Align columns vertically within their row.
-   */
-  verticalAlign: PropTypes.oneOf(['top', 'middle', 'bottom']),
-
-  /**
-   * Distribute empty space around columns.
-   */
-  distribute: PropTypes.oneOf(['around', 'between']),
-
-  /**
-   * Choose if the item order should be reversed from the 'xs' breakpoint. When you pass in false, the order will be normal from the xs breakpoint. By default, it inherits the behaviour set by the preceding prop.
-   */
-  xsReverse: PropTypes.bool,
-
-  /**
-   * Choose if the item order should be reversed from the 'sm' breakpoint. When you pass in false, the order will be normal from the sm breakpoint. By default, it inherits the behaviour set by the preceding prop.
-   */
-  smReverse: PropTypes.bool,
-
-  /**
-   * Choose if the item order should be reversed from the 'md' breakpoint. When you pass in false, the order will be normal from the md breakpoint. By default, it inherits the behaviour set by the preceding prop.
-   */
-  mdReverse: PropTypes.bool,
-
-  /**
-   * Choose if the item order should be reversed from the 'lg' breakpoint. When you pass in false, the order will be normal from the lg breakpoint. By default, it inherits the behaviour set by the preceding prop.
-   */
-  lgReverse: PropTypes.bool,
-
-  /**
-   * Choose if the item order should be reversed from the 'xl' breakpoint. When you pass in false, the order will be normal from the xl breakpoint. By default, it inherits the behaviour set by the preceding prop.
-   */
-  xlReverse: PropTypes.bool,
-  children: PropTypes.node.isRequired
-};
-export default Row;

package/lib-module/FlexGrid/Row/index.js

@@ -1,2 +0,0 @@
-import Row from './Row';
-export default Row;

package/lib-module/FlexGrid/helpers/index.js

@@ -1,18 +0,0 @@
-const applyInheritance = sizes => {
-  let prevSize;
-  return sizes.map((size, index) => {
-    if (size !== undefined) {
-      prevSize = size;
-      return size;
-    }
-
-    if (index) {
-      const value = prevSize;
-      return value;
-    }
-
-    return undefined;
-  });
-};
-
-export default applyInheritance;

package/lib-module/FlexGrid/index.js

@@ -1,2 +0,0 @@
-import FlexGrid from './FlexGrid';
-export default FlexGrid;

package/lib-module/FlexGrid/providers/GutterContext.js

@@ -1,3 +0,0 @@
-import React from 'react';
-const GutterContext = /*#__PURE__*/React.createContext(false);
-export default GutterContext;

package/lib-module/HorizontalScroll/HorizontalScroll.js

@@ -1,170 +0,0 @@
-import React, { forwardRef, useEffect, useRef, useState } from 'react';
-import PropTypes from 'prop-types';
-import Platform from "react-native-web/dist/exports/Platform";
-import StyleSheet from "react-native-web/dist/exports/StyleSheet";
-import View from "react-native-web/dist/exports/View";
-import { validateThemeTokens, resolveThemeTokens } from '../ThemeProvider';
-import { a11yProps, getTokensSetPropType, selectSystemProps, selectTokens, viewProps } from '../utils';
-import ScrollViewEnd from './ScrollViewEnd';
-import { getItemPositionScrollTarget, itemPositionsPropType } from './itemPositions';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-const [selectProps, selectedSystemPropTypes] = selectSystemProps([a11yProps, viewProps]);
-const tokenKeys = ['nextIcon', 'previousIcon', 'gutter', 'borderBottomWidth', 'borderBottomColor', 'buttonClearance'];
-export const selectHorizontalScrollTokens = (themeTokens, prefix) => selectTokens(tokenKeys, themeTokens, prefix);
-/**
- * Base component that scrolls horizontally and displays left and right buttons if
- * there is content to the left and the right which can be scrolled to.
- *
- * @TODO revisit `ScrollButton` after IconButton is stable.
- */
-
-const HorizontalScroll = /*#__PURE__*/forwardRef(({
-  ScrollButton,
-  tokens,
-  itemPositions,
-  children,
-  ...rest
-}, ref) => {
-  const {
-    nextIcon,
-    previousIcon,
-    gutter,
-    borderBottomWidth,
-    borderBottomColor,
-    buttonClearance = 0
-  } = validateThemeTokens(resolveThemeTokens(tokens), // Allow missing icons
-  getTokensSetPropType(tokenKeys, {
-    partial: true
-  }), 'HorizontalScroll');
-  const [containerWidth, setContainerWidth] = useState(0);
-  const [contentWidth, setContentWidth] = useState(0);
-
-  const handleContentWidth = width => setContentWidth(width);
-
-  const handleContainerLayout = ({
-    nativeEvent: {
-      layout: {
-        width
-      }
-    }
-  }) => setContainerWidth(width); // Update the scroll position only when scrolling actions ends to minimally rerender
-  // and update which buttons are conditionally rendered.
-
-
-  const [scrollOffset, setScrollOffset] = useState(0);
-
-  const handleScrollEnd = ({
-    nativeEvent: {
-      contentOffset: {
-        x
-      }
-    }
-  }) => {
-    setScrollOffset(x);
-  };
-
-  const scrollMax = Math.max(0, contentWidth - containerWidth);
-  const showNextButton = scrollOffset < scrollMax;
-  const showPreviousButton = scrollOffset > 0;
-  const scrollRef = useRef(null);
-
-  const scrollTo = targetX => {
-    var _scrollRef$current;
-
-    if (typeof ((_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.scrollTo) === 'function') {
-      const x = getItemPositionScrollTarget(targetX, scrollMax, itemPositions.positions, buttonClearance);
-      scrollRef.current.scrollTo({
-        x,
-        animated: true
-      });
-
-      if (Platform.OS === 'android') {
-        // React Native calls onScrollMomentumEnd after scrollTo for iOS, but not Android.
-        // See https://github.com/facebook/react-native/issues/26661
-        // There's also no callback for when scrollTo finishes.
-        setTimeout(() => setScrollOffset(x), 300);
-      }
-    }
-  }; // Make scrollTo and relevant co-ordinates available to any component with an interest in itemPositions.
-  // ItemPositions is a mutable ref object intended to have its properties mutated without any rerenders.
-
-  /* eslint-disable-next-line no-param-reassign */
-
-
-  itemPositions.scrollTo = scrollTo;
-  /* eslint-disable-next-line no-param-reassign */
-
-  itemPositions.containerWidth = containerWidth;
-  /* eslint-disable-next-line no-param-reassign */
-
-  itemPositions.contentWidth = contentWidth;
-  /* eslint-disable-next-line no-param-reassign */
-
-  itemPositions.scrollOffset = scrollOffset;
-  const hasWidths = itemPositions.contentWidth > 0 && itemPositions.contentWidth > 0;
-  useEffect(() => {
-    if (hasWidths) itemPositions.setIsReady(true); // itemPositions is a ref object so this should occur only when elements' widths are set in state
-  }, [hasWidths, itemPositions]); // When scrolling, allow clearance around scroll buttons, so e.g. this...
-  // (<-) Item 5   Item 6   Item 7   Item 8   It(->)
-  // ...doesn't scroll like this with Item 9 never being properly visible:
-  // (<-)em 9   Item 10  Item 11  Item 12  Item (->)
-
-  const scrollDistance = containerWidth - buttonClearance * 2;
-
-  const scrollNext = () => scrollTo(scrollOffset + scrollDistance);
-
-  const scrollPrevious = () => scrollTo(scrollOffset - scrollDistance); // On Web, being scrollable in one direction prevents overflow: visible in the other direction.
-  // Apply a fixed margin gutter that tab highlight effects can overhang without getting trimmed.
-
-
-  return /*#__PURE__*/_jsxs(View, {
-    ref: ref,
-    style: staticStyles.container,
-    children: [/*#__PURE__*/_jsx(ScrollViewEnd, {
-      onScrollEnd: handleScrollEnd,
-      ref: scrollRef,
-      horizontal: true,
-      onContentSizeChange: handleContentWidth,
-      onLayout: handleContainerLayout,
-      showsHorizontalScrollIndicator: false,
-      contentContainerStyle: [staticStyles.scrollContainer, {
-        borderBottomWidth,
-        borderBottomColor
-      }],
-      ...selectProps(rest),
-      children: children
-    }), showPreviousButton && /*#__PURE__*/_jsx(ScrollButton, {
-      icon: previousIcon,
-      onPress: scrollPrevious,
-      offset: gutter,
-      direction: "previous"
-    }), showNextButton && /*#__PURE__*/_jsx(ScrollButton, {
-      icon: nextIcon,
-      onPress: scrollNext,
-      offset: gutter,
-      direction: "next"
-    })]
-  });
-});
-HorizontalScroll.displayName = 'HorizontalScroll';
-const staticStyles = StyleSheet.create({
-  scrollContainer: {
-    // Gives inner container width from content, allowing it to exceed its container's width
-    alignSelf: 'flex-start',
-    flexGrow: 1
-  },
-  container: {
-    // Vertically center the ScrollButtons buttons
-    justifyContent: 'center'
-  }
-});
-HorizontalScroll.propTypes = { ...selectedSystemPropTypes,
-  itemPositions: itemPositionsPropType,
-  ScrollButton: PropTypes.elementType,
-  tokens: getTokensSetPropType(tokenKeys, {
-    allowFunction: true
-  }),
-  children: PropTypes.node
-};
-export default HorizontalScroll;

package/lib-module/HorizontalScroll/HorizontalScrollButton.js

@@ -1,77 +0,0 @@
-import React, { forwardRef } from 'react';
-import PropTypes from 'prop-types';
-import StyleSheet from "react-native-web/dist/exports/StyleSheet";
-import View from "react-native-web/dist/exports/View";
-import { variantProp, getTokensPropType, useCopy, copyPropTypes, a11yProps } from '../utils';
-import { useThemeTokens } from '../ThemeProvider';
-import IconButton from '../IconButton';
-import dictionary from './dictionary';
-import { jsx as _jsx } from "react/jsx-runtime";
-
-const selectContainerStyles = ({
-  offset
-}) => ({
-  marginTop: offset ? -offset : 0
-});
-/**
- * Button within a Tabs component showing users that content is available to the left or
- * right, scrolling a screen's worth of content left or right when pressed.
- *
- * This is rendered automatically by `Tabs` and isn't intended be used directly.
- *
- * @TODO when IconButton is complete and stable revisit this and update interaction state styles.
- */
-
-
-const HorizontalScrollButton = /*#__PURE__*/forwardRef(({
-  direction = 'next',
-  icon,
-  offset,
-  onPress,
-  variant,
-  tokens,
-  copy
-}, ref) => {
-  const themeTokens = useThemeTokens('HorizontalScrollButton', tokens, variant);
-  const getCopy = useCopy({
-    dictionary,
-    copy
-  });
-  const label = direction === 'previous' ? getCopy('previousText') : getCopy('nextText');
-  return /*#__PURE__*/_jsx(View, {
-    style: [staticStyles.absolute, staticStyles[direction], selectContainerStyles({
-      offset
-    })],
-    children: /*#__PURE__*/_jsx(IconButton, {
-      accessibilityLabel: label,
-      icon: icon,
-      onPress: onPress,
-      ref: ref,
-      tokens: themeTokens,
-      variant: variant,
-      ...a11yProps.nonFocusableProps
-    })
-  });
-});
-HorizontalScrollButton.displayName = 'HorizontalScrollButton';
-const staticStyles = StyleSheet.create({
-  absolute: {
-    position: 'absolute'
-  },
-  previous: {
-    left: 0
-  },
-  next: {
-    right: 0
-  }
-});
-HorizontalScrollButton.propTypes = {
-  tokens: getTokensPropType('HorizontalScrollButton'),
-  variant: variantProp.propType,
-  copy: copyPropTypes,
-  direction: PropTypes.oneOf(['previous', 'next']),
-  offset: PropTypes.number,
-  icon: PropTypes.elementType,
-  onPress: PropTypes.func.isRequired
-};
-export default HorizontalScrollButton;

package/lib-module/HorizontalScroll/ScrollViewEnd.js

@@ -1,47 +0,0 @@
-import React, { forwardRef, useCallback, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import ScrollView from "react-native-web/dist/exports/ScrollView";
-import debounce from 'lodash.debounce';
-import { jsx as _jsx } from "react/jsx-runtime";
-const DEBOUNCE_MS = 100;
-/**
- * A wrapper for ScrollView that supports an `onScrollEnd` function.
- *
- * React Native Web hasn't got around to implementing any scroll end handlers yet,
- * so we need to work around it with debouncing on `onScroll`. See:
- * https://github.com/necolas/react-native-web/issues/1021
- */
-
-const ScrollViewEnd = /*#__PURE__*/forwardRef(({
-  onScrollEnd,
-  onScroll,
-  ...props
-}, ref) => {
-  // Return debounced function directly from useCallback so it has .cancel method etc.
-  // Linter complains this stops it automatically scanning the deps, but we can check them manually.
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  const debounceScrollEnd = useCallback(debounce(event => onScrollEnd(event), DEBOUNCE_MS), [onScrollEnd]); // Call any onScroll handler immediately, and any onScrollEnd handler after 100ms of no scrolling
-
-  const handleScroll = event => {
-    if (typeof onScroll === 'function') onScroll(event);
-    if (typeof onScrollEnd === 'function') debounceScrollEnd(event);
-  }; // Cancel any lingering debounce timeouts on dismount
-
-
-  useEffect(() => debounceScrollEnd.cancel);
-  return /*#__PURE__*/_jsx(ScrollView, {
-    ref: ref,
-    ...props,
-    onScroll: handleScroll,
-    scrollEventThrottle: DEBOUNCE_MS / 2
-  });
-});
-ScrollViewEnd.displayName = 'ScrollViewEnd';
-ScrollViewEnd.propTypes = {
-  onScrollEnd: PropTypes.func.isRequired,
-  onScroll: PropTypes.func
-};
-ScrollViewEnd.defaultProps = {
-  onScroll: null
-};
-export default ScrollViewEnd;

package/lib-module/HorizontalScroll/ScrollViewEnd.native.js

@@ -1,24 +0,0 @@
-import React, { forwardRef } from 'react';
-import PropTypes from 'prop-types';
-import ScrollView from "react-native-web/dist/exports/ScrollView";
-/**
- * A wrapper for ScrollView that supports an `onScrollEnd` function.
- *
- * React Native has two scroll end handlers, we want to treat them both the same.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-const ScrollViewEnd = /*#__PURE__*/forwardRef(({
-  onScrollEnd,
-  ...props
-}, ref) => /*#__PURE__*/_jsx(ScrollView, {
-  ref: ref,
-  ...props,
-  onScrollEndDrag: onScrollEnd,
-  onMomentumScrollEnd: onScrollEnd
-}));
-ScrollViewEnd.displayName = 'ScrollViewEnd';
-ScrollViewEnd.propTypes = {
-  onScrollEnd: PropTypes.func.isRequired
-};
-export default ScrollViewEnd;

package/lib-module/HorizontalScroll/dictionary.js

@@ -1,11 +0,0 @@
-export default {
-  en: {
-    // English text from TDS Community `Tabs`
-    previousLabel: 'Move menu to the left',
-    nextLabel: 'Move menu to the right'
-  },
-  fr: {
-    previousLabel: 'Déplacer le menu vers la gauche',
-    nextLabel: 'Déplacer le menu vers la droite'
-  }
-};