@transferwise/components 0.0.0-experimental-eecc435 → 0.0.0-experimental-683a8ba

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/build/index.js CHANGED
@@ -1801,15 +1801,14 @@ const useLayout = () => {
1801
1801
 
1802
1802
  const EXIT_ANIMATION = 350;
1803
1803
  const SlidingPanel = /*#__PURE__*/React.forwardRef(({
1804
- children,
1805
- className,
1804
+ position = 'left',
1806
1805
  open,
1807
- position,
1808
1806
  showSlidingPanelBorder,
1809
1807
  slidingPanelPositionFixed,
1808
+ className,
1809
+ children,
1810
1810
  ...rest
1811
1811
  }, reference) => {
1812
- /** @type {RefObject<HTMLDivElement>} */
1813
1812
  const localReference = React.useRef(null);
1814
1813
  return /*#__PURE__*/React.createElement(reactTransitionGroup.CSSTransition, {
1815
1814
  ...rest,
@@ -1822,34 +1821,15 @@ const SlidingPanel = /*#__PURE__*/React.forwardRef(({
1822
1821
  enter: 0,
1823
1822
  exit: EXIT_ANIMATION
1824
1823
  },
1825
- classNames: classNames__default.default(`sliding-panel--open-${position}`, showSlidingPanelBorder && `sliding-panel--border-${position}`, {
1826
- 'sliding-panel--fixed': slidingPanelPositionFixed
1827
- }, 'sliding-panel'),
1824
+ classNames: "sliding-panel",
1828
1825
  appear: true,
1829
1826
  unmountOnExit: true
1830
1827
  }, /*#__PURE__*/jsxRuntime.jsx("div", {
1831
1828
  ref: mergeRefs__default.default([reference, localReference]),
1832
- className: classNames__default.default('sliding-panel', `sliding-panel--open-${position}`, className),
1829
+ className: classNames__default.default('sliding-panel', `sliding-panel--open-${position}`, showSlidingPanelBorder && `sliding-panel--border-${position}`, slidingPanelPositionFixed && 'sliding-panel--fixed', className),
1833
1830
  children: children
1834
1831
  }));
1835
1832
  });
1836
- SlidingPanel.propTypes = {
1837
- children: PropTypes__default.default.node,
1838
- className: PropTypes__default.default.string,
1839
- open: PropTypes__default.default.bool,
1840
- position: PropTypes__default.default.oneOf(['top', 'bottom', 'left', 'right']),
1841
- showSlidingPanelBorder: PropTypes__default.default.bool,
1842
- slidingPanelPositionFixed: PropTypes__default.default.bool
1843
- };
1844
- SlidingPanel.defaultProps = {
1845
- children: null,
1846
- className: undefined,
1847
- open: false,
1848
- position: 'left',
1849
- showSlidingPanelBorder: false,
1850
- slidingPanelPositionFixed: false
1851
- };
1852
- var SlidingPanel$1 = SlidingPanel;
1853
1833
 
1854
1834
  const Drawer = ({
1855
1835
  children,
@@ -1868,7 +1848,7 @@ const Drawer = ({
1868
1848
  return /*#__PURE__*/jsxRuntime.jsx(Dimmer$1, {
1869
1849
  open: open,
1870
1850
  onClose: onClose,
1871
- children: /*#__PURE__*/jsxRuntime.jsx(SlidingPanel$1, {
1851
+ children: /*#__PURE__*/jsxRuntime.jsx(SlidingPanel, {
1872
1852
  open: open,
1873
1853
  position: isMobile ? exports.Position.BOTTOM : position,
1874
1854
  children: /*#__PURE__*/jsxRuntime.jsxs("div", {
@@ -1985,15 +1965,15 @@ const BottomSheet$1 = props => {
1985
1965
  props.onClose(event);
1986
1966
  }
1987
1967
  }
1988
- const onSwipeStart = isMobile => event => {
1989
- initialYCoordinate.current = (isMobile ? event.touches[0] : event).clientY;
1968
+ const onSwipeStart = event => {
1969
+ initialYCoordinate.current = ('touches' in event ? event.touches[0] : event).clientY;
1990
1970
  setPressed(true);
1991
1971
  };
1992
- const onSwipeMove = isMobile => event => {
1972
+ const onSwipeMove = event => {
1993
1973
  if (pressed) {
1994
1974
  const {
1995
1975
  clientY
1996
- } = isMobile ? event.touches[0] : event;
1976
+ } = 'touches' in event ? event.touches[0] : event;
1997
1977
  const offset = calculateOffsetAfterMove(clientY);
1998
1978
  // check whether move is to the bottom only and content scroll position is at the top
1999
1979
  if (offset > INITIAL_Y_POSITION && isContentScrollPositionAtTop()) {
@@ -2062,34 +2042,37 @@ const BottomSheet$1 = props => {
2062
2042
  fadeContentOnEnter: true,
2063
2043
  fadeContentOnExit: true,
2064
2044
  onClose: close,
2065
- children: /*#__PURE__*/jsxRuntime.jsxs(SlidingPanel$1, {
2045
+ children: /*#__PURE__*/jsxRuntime.jsx(SlidingPanel, {
2066
2046
  ref: bottomSheetReference,
2067
2047
  open: props.open,
2068
2048
  position: exports.Position.BOTTOM,
2069
2049
  className: classNames__default.default('np-bottom-sheet', props.className),
2070
- role: "dialog",
2071
- onTouchStart: onSwipeStart(true),
2072
- onTouchMove: onSwipeMove(true),
2073
- onTouchEnd: onSwipeEnd,
2074
- onMouseDown: onSwipeStart(false),
2075
- onMouseMove: onSwipeMove(false),
2076
- onMouseUp: onSwipeEnd,
2077
- children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
2078
- ref: topBarReference,
2079
- className: "np-bottom-sheet--top-bar",
2080
- children: [/*#__PURE__*/jsxRuntime.jsx("div", {
2081
- className: "np-bottom-sheet--handler"
2082
- }), /*#__PURE__*/jsxRuntime.jsx(CloseButton, {
2083
- size: "sm",
2084
- className: "sr-only np-bottom-sheet--close-btn",
2085
- onClick: close
2050
+ children: /*#__PURE__*/jsxRuntime.jsxs("div", {
2051
+ role: "dialog",
2052
+ "aria-modal": true,
2053
+ onTouchStart: onSwipeStart,
2054
+ onTouchMove: onSwipeMove,
2055
+ onTouchEnd: onSwipeEnd,
2056
+ onMouseDown: onSwipeStart,
2057
+ onMouseMove: onSwipeMove,
2058
+ onMouseUp: onSwipeEnd,
2059
+ children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
2060
+ ref: topBarReference,
2061
+ className: "np-bottom-sheet--top-bar",
2062
+ children: [/*#__PURE__*/jsxRuntime.jsx("div", {
2063
+ className: "np-bottom-sheet--handler"
2064
+ }), /*#__PURE__*/jsxRuntime.jsx(CloseButton, {
2065
+ size: "sm",
2066
+ className: "sr-only np-bottom-sheet--close-btn",
2067
+ onClick: close
2068
+ })]
2069
+ }), /*#__PURE__*/jsxRuntime.jsx("div", {
2070
+ ref: contentReference,
2071
+ style: setContentMaxHeight(),
2072
+ className: "np-bottom-sheet--content",
2073
+ children: props.children
2086
2074
  })]
2087
- }), /*#__PURE__*/jsxRuntime.jsx("div", {
2088
- ref: contentReference,
2089
- style: setContentMaxHeight(),
2090
- className: "np-bottom-sheet--content",
2091
- children: props.children
2092
- })]
2075
+ })
2093
2076
  })
2094
2077
  });
2095
2078
  };
@@ -11014,7 +10997,7 @@ const Sticky = ({
11014
10997
  open,
11015
10998
  position,
11016
10999
  children
11017
- }) => /*#__PURE__*/jsxRuntime.jsx(SlidingPanel$1, {
11000
+ }) => /*#__PURE__*/jsxRuntime.jsx(SlidingPanel, {
11018
11001
  open: open,
11019
11002
  position: position,
11020
11003
  slidingPanelPositionFixed: true,
@@ -15222,7 +15205,7 @@ exports.Select = Select;
15222
15205
  exports.SelectInput = SelectInput;
15223
15206
  exports.SelectInputOptionContent = SelectInputOptionContent;
15224
15207
  exports.SelectInputTriggerButton = SelectInputTriggerButton;
15225
- exports.SlidingPanel = SlidingPanel$1;
15208
+ exports.SlidingPanel = SlidingPanel;
15226
15209
  exports.SnackbarConsumer = SnackbarConsumer;
15227
15210
  exports.SnackbarContext = SnackbarContext;
15228
15211
  exports.SnackbarPortal = SnackbarPortal;