@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.
@@ -1768,15 +1768,14 @@ const useLayout = () => {
1768
1768
 
1769
1769
  const EXIT_ANIMATION = 350;
1770
1770
  const SlidingPanel = /*#__PURE__*/forwardRef(({
1771
- children,
1772
- className,
1771
+ position = 'left',
1773
1772
  open,
1774
- position,
1775
1773
  showSlidingPanelBorder,
1776
1774
  slidingPanelPositionFixed,
1775
+ className,
1776
+ children,
1777
1777
  ...rest
1778
1778
  }, reference) => {
1779
- /** @type {RefObject<HTMLDivElement>} */
1780
1779
  const localReference = useRef(null);
1781
1780
  return /*#__PURE__*/createElement(CSSTransition, {
1782
1781
  ...rest,
@@ -1789,34 +1788,15 @@ const SlidingPanel = /*#__PURE__*/forwardRef(({
1789
1788
  enter: 0,
1790
1789
  exit: EXIT_ANIMATION
1791
1790
  },
1792
- classNames: classNames(`sliding-panel--open-${position}`, showSlidingPanelBorder && `sliding-panel--border-${position}`, {
1793
- 'sliding-panel--fixed': slidingPanelPositionFixed
1794
- }, 'sliding-panel'),
1791
+ classNames: "sliding-panel",
1795
1792
  appear: true,
1796
1793
  unmountOnExit: true
1797
1794
  }, /*#__PURE__*/jsx("div", {
1798
1795
  ref: mergeRefs([reference, localReference]),
1799
- className: classNames('sliding-panel', `sliding-panel--open-${position}`, className),
1796
+ className: classNames('sliding-panel', `sliding-panel--open-${position}`, showSlidingPanelBorder && `sliding-panel--border-${position}`, slidingPanelPositionFixed && 'sliding-panel--fixed', className),
1800
1797
  children: children
1801
1798
  }));
1802
1799
  });
1803
- SlidingPanel.propTypes = {
1804
- children: PropTypes.node,
1805
- className: PropTypes.string,
1806
- open: PropTypes.bool,
1807
- position: PropTypes.oneOf(['top', 'bottom', 'left', 'right']),
1808
- showSlidingPanelBorder: PropTypes.bool,
1809
- slidingPanelPositionFixed: PropTypes.bool
1810
- };
1811
- SlidingPanel.defaultProps = {
1812
- children: null,
1813
- className: undefined,
1814
- open: false,
1815
- position: 'left',
1816
- showSlidingPanelBorder: false,
1817
- slidingPanelPositionFixed: false
1818
- };
1819
- var SlidingPanel$1 = SlidingPanel;
1820
1800
 
1821
1801
  const Drawer = ({
1822
1802
  children,
@@ -1835,7 +1815,7 @@ const Drawer = ({
1835
1815
  return /*#__PURE__*/jsx(Dimmer$1, {
1836
1816
  open: open,
1837
1817
  onClose: onClose,
1838
- children: /*#__PURE__*/jsx(SlidingPanel$1, {
1818
+ children: /*#__PURE__*/jsx(SlidingPanel, {
1839
1819
  open: open,
1840
1820
  position: isMobile ? Position.BOTTOM : position,
1841
1821
  children: /*#__PURE__*/jsxs("div", {
@@ -1952,15 +1932,15 @@ const BottomSheet$1 = props => {
1952
1932
  props.onClose(event);
1953
1933
  }
1954
1934
  }
1955
- const onSwipeStart = isMobile => event => {
1956
- initialYCoordinate.current = (isMobile ? event.touches[0] : event).clientY;
1935
+ const onSwipeStart = event => {
1936
+ initialYCoordinate.current = ('touches' in event ? event.touches[0] : event).clientY;
1957
1937
  setPressed(true);
1958
1938
  };
1959
- const onSwipeMove = isMobile => event => {
1939
+ const onSwipeMove = event => {
1960
1940
  if (pressed) {
1961
1941
  const {
1962
1942
  clientY
1963
- } = isMobile ? event.touches[0] : event;
1943
+ } = 'touches' in event ? event.touches[0] : event;
1964
1944
  const offset = calculateOffsetAfterMove(clientY);
1965
1945
  // check whether move is to the bottom only and content scroll position is at the top
1966
1946
  if (offset > INITIAL_Y_POSITION && isContentScrollPositionAtTop()) {
@@ -2029,34 +2009,37 @@ const BottomSheet$1 = props => {
2029
2009
  fadeContentOnEnter: true,
2030
2010
  fadeContentOnExit: true,
2031
2011
  onClose: close,
2032
- children: /*#__PURE__*/jsxs(SlidingPanel$1, {
2012
+ children: /*#__PURE__*/jsx(SlidingPanel, {
2033
2013
  ref: bottomSheetReference,
2034
2014
  open: props.open,
2035
2015
  position: Position.BOTTOM,
2036
2016
  className: classNames('np-bottom-sheet', props.className),
2037
- role: "dialog",
2038
- onTouchStart: onSwipeStart(true),
2039
- onTouchMove: onSwipeMove(true),
2040
- onTouchEnd: onSwipeEnd,
2041
- onMouseDown: onSwipeStart(false),
2042
- onMouseMove: onSwipeMove(false),
2043
- onMouseUp: onSwipeEnd,
2044
- children: [/*#__PURE__*/jsxs("div", {
2045
- ref: topBarReference,
2046
- className: "np-bottom-sheet--top-bar",
2047
- children: [/*#__PURE__*/jsx("div", {
2048
- className: "np-bottom-sheet--handler"
2049
- }), /*#__PURE__*/jsx(CloseButton, {
2050
- size: "sm",
2051
- className: "sr-only np-bottom-sheet--close-btn",
2052
- onClick: close
2017
+ children: /*#__PURE__*/jsxs("div", {
2018
+ role: "dialog",
2019
+ "aria-modal": true,
2020
+ onTouchStart: onSwipeStart,
2021
+ onTouchMove: onSwipeMove,
2022
+ onTouchEnd: onSwipeEnd,
2023
+ onMouseDown: onSwipeStart,
2024
+ onMouseMove: onSwipeMove,
2025
+ onMouseUp: onSwipeEnd,
2026
+ children: [/*#__PURE__*/jsxs("div", {
2027
+ ref: topBarReference,
2028
+ className: "np-bottom-sheet--top-bar",
2029
+ children: [/*#__PURE__*/jsx("div", {
2030
+ className: "np-bottom-sheet--handler"
2031
+ }), /*#__PURE__*/jsx(CloseButton, {
2032
+ size: "sm",
2033
+ className: "sr-only np-bottom-sheet--close-btn",
2034
+ onClick: close
2035
+ })]
2036
+ }), /*#__PURE__*/jsx("div", {
2037
+ ref: contentReference,
2038
+ style: setContentMaxHeight(),
2039
+ className: "np-bottom-sheet--content",
2040
+ children: props.children
2053
2041
  })]
2054
- }), /*#__PURE__*/jsx("div", {
2055
- ref: contentReference,
2056
- style: setContentMaxHeight(),
2057
- className: "np-bottom-sheet--content",
2058
- children: props.children
2059
- })]
2042
+ })
2060
2043
  })
2061
2044
  });
2062
2045
  };
@@ -10981,7 +10964,7 @@ const Sticky = ({
10981
10964
  open,
10982
10965
  position,
10983
10966
  children
10984
- }) => /*#__PURE__*/jsx(SlidingPanel$1, {
10967
+ }) => /*#__PURE__*/jsx(SlidingPanel, {
10985
10968
  open: open,
10986
10969
  position: position,
10987
10970
  slidingPanelPositionFixed: true,
@@ -15113,5 +15096,5 @@ const translations = {
15113
15096
  'zh-HK': zhHK
15114
15097
  };
15115
15098
 
15116
- export { Accordion, ActionButton, ActionOption, Alert$1 as Alert, ArrowPosition as AlertArrowPosition, Avatar, AvatarType, AvatarWrapper, Badge, Card as BaseCard, Body, BottomSheet$2 as BottomSheet, Breakpoint, Button, Card$2 as Card, Checkbox$1 as Checkbox, CheckboxButton$1 as CheckboxButton, CheckboxOption, Chevron, Chip, Chips, CircularButton, ControlType, CriticalCommsBanner, DEFAULT_LANG, DEFAULT_LOCALE, DateInput, DateLookup$1 as DateLookup, DateMode, Decision, DecisionPresentation, DecisionType, DefinitionList$1 as DefinitionList, Dimmer$1 as Dimmer, Direction, DirectionProvider, Display, Drawer$1 as Drawer, DropFade, DynamicFieldDefinitionList$1 as DynamicFieldDefinitionList, Emphasis, FileType, FlowNavigation, Header, Image, Info, InfoPresentation, InlineAlert, Input, InputGroup, InputWithDisplayFormat, InstructionsList, LanguageProvider, Layout, Link, ListItem$1 as ListItem, Loader$1 as Loader, Logo$1 as Logo, LogoType, Markdown, MarkdownNodeType, Modal, Money$1 as Money, MoneyInput$1 as MoneyInput, MonthFormat, NavigationOption, NavigationOptionList$1 as NavigationOptionsList, Nudge, Option$2 as Option, OverlayHeader$1 as OverlayHeader, PhoneNumberInput, Popover$2 as Popover, Position, Priority, ProcessIndicator$1 as ProcessIndicator, ProfileType, Progress, ProgressBar, PromoCard$1 as PromoCard, PromoCard$1 as PromoCardGroup, Provider$1 as Provider, RTL_LANGUAGES, Radio, RadioGroup, RadioOption, SUPPORTED_LANGUAGES, Scroll, SearchInput, Section, SegmentedControl, Select, SelectInput, SelectInputOptionContent, SelectInputTriggerButton, Sentiment, Size, SlidingPanel$1 as SlidingPanel, SnackbarConsumer, SnackbarContext, SnackbarPortal, SnackbarProvider, Status, StatusIcon, Stepper, Sticky$1 as Sticky, Summary, Switch, SwitchOption, Tabs$1 as Tabs, TextArea, TextareaWithDisplayFormat, Theme, Title, Tooltip$1 as Tooltip, Type, Typeahead, Typography, Upload$1 as Upload, UploadInput, UploadStep, Variant, Width, adjustLocale, getCountryFromLocale, getDirectionFromLocale, getLangFromLocale, isBrowser, isServerSide, translations, useDirection, useLayout, useScreenSize, useSnackbar };
15099
+ export { Accordion, ActionButton, ActionOption, Alert$1 as Alert, ArrowPosition as AlertArrowPosition, Avatar, AvatarType, AvatarWrapper, Badge, Card as BaseCard, Body, BottomSheet$2 as BottomSheet, Breakpoint, Button, Card$2 as Card, Checkbox$1 as Checkbox, CheckboxButton$1 as CheckboxButton, CheckboxOption, Chevron, Chip, Chips, CircularButton, ControlType, CriticalCommsBanner, DEFAULT_LANG, DEFAULT_LOCALE, DateInput, DateLookup$1 as DateLookup, DateMode, Decision, DecisionPresentation, DecisionType, DefinitionList$1 as DefinitionList, Dimmer$1 as Dimmer, Direction, DirectionProvider, Display, Drawer$1 as Drawer, DropFade, DynamicFieldDefinitionList$1 as DynamicFieldDefinitionList, Emphasis, FileType, FlowNavigation, Header, Image, Info, InfoPresentation, InlineAlert, Input, InputGroup, InputWithDisplayFormat, InstructionsList, LanguageProvider, Layout, Link, ListItem$1 as ListItem, Loader$1 as Loader, Logo$1 as Logo, LogoType, Markdown, MarkdownNodeType, Modal, Money$1 as Money, MoneyInput$1 as MoneyInput, MonthFormat, NavigationOption, NavigationOptionList$1 as NavigationOptionsList, Nudge, Option$2 as Option, OverlayHeader$1 as OverlayHeader, PhoneNumberInput, Popover$2 as Popover, Position, Priority, ProcessIndicator$1 as ProcessIndicator, ProfileType, Progress, ProgressBar, PromoCard$1 as PromoCard, PromoCard$1 as PromoCardGroup, Provider$1 as Provider, RTL_LANGUAGES, Radio, RadioGroup, RadioOption, SUPPORTED_LANGUAGES, Scroll, SearchInput, Section, SegmentedControl, Select, SelectInput, SelectInputOptionContent, SelectInputTriggerButton, Sentiment, Size, SlidingPanel, SnackbarConsumer, SnackbarContext, SnackbarPortal, SnackbarProvider, Status, StatusIcon, Stepper, Sticky$1 as Sticky, Summary, Switch, SwitchOption, Tabs$1 as Tabs, TextArea, TextareaWithDisplayFormat, Theme, Title, Tooltip$1 as Tooltip, Type, Typeahead, Typography, Upload$1 as Upload, UploadInput, UploadStep, Variant, Width, adjustLocale, getCountryFromLocale, getDirectionFromLocale, getLangFromLocale, isBrowser, isServerSide, translations, useDirection, useLayout, useScreenSize, useSnackbar };
15117
15100
  //# sourceMappingURL=index.esm.js.map