@transferwise/components 0.0.0-experimental-68c810c → 0.0.0-experimental-ff22dc3

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.
Files changed (9) hide show
  1. package/build/index.esm.js +75 -68
  2. package/build/index.esm.js.map +1 -1
  3. package/build/index.js +75 -68
  4. package/build/index.js.map +1 -1
  5. package/build/types/inputs/_BottomSheet.d.ts.map +1 -1
  6. package/build/types/inputs/_Popover.d.ts.map +1 -1
  7. package/package.json +3 -3
  8. package/src/inputs/_BottomSheet.tsx +47 -37
  9. package/src/inputs/_Popover.tsx +30 -27
package/build/index.esm.js CHANGED
@@ -1506,7 +1506,6 @@ const FocusBoundary = ({
1506
1506
  })
1507
1507
  });
1508
1508
  };
1509
- var FocusBoundary$1 = FocusBoundary;
1510
1509
 
1511
1510
  function withNextPortalWrapper(Component) {
1512
1511
  return function (props) {
@@ -1648,7 +1647,7 @@ const Dimmer = ({
1648
1647
  onExited: onExited,
1649
1648
  children: /*#__PURE__*/jsx(DimmerContentWrapper, {
1650
1649
  scrollBody: !transparent,
1651
- children: /*#__PURE__*/jsx(FocusBoundary$1, {
1650
+ children: /*#__PURE__*/jsx(FocusBoundary, {
1652
1651
  children: /*#__PURE__*/jsx("div", {
1653
1652
  ref: dimmerReference,
1654
1653
  className: classNames('dimmer', {
@@ -6411,43 +6410,47 @@ function BottomSheet({
6411
6410
  children: /*#__PURE__*/jsx("div", {
6412
6411
  className: "np-bottom-sheet-v2-backdrop"
6413
6412
  })
6414
- }), /*#__PURE__*/jsx(FloatingFocusManager, {
6415
- context: context,
6416
- initialFocus: initialFocusRef,
6417
- children: /*#__PURE__*/jsx("div", {
6418
- className: "np-bottom-sheet-v2",
6419
- children: /*#__PURE__*/jsx(Transition.Child, {
6420
- className: "np-bottom-sheet-v2-content",
6421
- enter: "np-bottom-sheet-v2-content--enter",
6422
- enterFrom: "np-bottom-sheet-v2-content--enter-from",
6423
- leave: "np-bottom-sheet-v2-content--leave",
6424
- leaveTo: "np-bottom-sheet-v2-content--leave-to",
6425
- children: /*#__PURE__*/jsxs("div", {
6426
- // Force inner state invalidation on open
6427
- ref: refs.setFloating,
6428
- className: "np-bottom-sheet-v2-content-inner-container",
6429
- ...getFloatingProps(),
6430
- children: [/*#__PURE__*/jsx("div", {
6431
- className: "np-bottom-sheet-v2-header",
6432
- children: /*#__PURE__*/jsx(CloseButton, {
6433
- size: Size.SMALL,
6434
- onClick: () => {
6435
- onClose?.();
6436
- }
6437
- })
6438
- }), /*#__PURE__*/jsxs("div", {
6439
- className: classNames('np-bottom-sheet-v2-content-inner', title && 'np-bottom-sheet-v2-content-inner--has-title', {
6440
- 'np-bottom-sheet-v2-content-inner--padding-md': padding === 'md'
6441
- }),
6442
- children: [title ? /*#__PURE__*/jsx("h2", {
6443
- className: "np-bottom-sheet-v2-title np-text-title-body",
6444
- children: title
6445
- }) : null, /*#__PURE__*/jsx("div", {
6446
- className: "np-bottom-sheet-v2-body np-text-body-default",
6447
- children: children
6413
+ }), /*#__PURE__*/jsx(FocusBoundary, {
6414
+ children: /*#__PURE__*/jsx(FloatingFocusManager, {
6415
+ context: context,
6416
+ initialFocus: initialFocusRef,
6417
+ guards: false,
6418
+ modal: false,
6419
+ children: /*#__PURE__*/jsx("div", {
6420
+ className: "np-bottom-sheet-v2",
6421
+ children: /*#__PURE__*/jsx(Transition.Child, {
6422
+ className: "np-bottom-sheet-v2-content",
6423
+ enter: "np-bottom-sheet-v2-content--enter",
6424
+ enterFrom: "np-bottom-sheet-v2-content--enter-from",
6425
+ leave: "np-bottom-sheet-v2-content--leave",
6426
+ leaveTo: "np-bottom-sheet-v2-content--leave-to",
6427
+ children: /*#__PURE__*/jsxs("div", {
6428
+ // Force inner state invalidation on open
6429
+ ref: refs.setFloating,
6430
+ className: "np-bottom-sheet-v2-content-inner-container",
6431
+ ...getFloatingProps(),
6432
+ children: [/*#__PURE__*/jsx("div", {
6433
+ className: "np-bottom-sheet-v2-header",
6434
+ children: /*#__PURE__*/jsx(CloseButton, {
6435
+ size: Size.SMALL,
6436
+ onClick: () => {
6437
+ onClose?.();
6438
+ }
6439
+ })
6440
+ }), /*#__PURE__*/jsxs("div", {
6441
+ className: classNames('np-bottom-sheet-v2-content-inner', title && 'np-bottom-sheet-v2-content-inner--has-title', {
6442
+ 'np-bottom-sheet-v2-content-inner--padding-md': padding === 'md'
6443
+ }),
6444
+ children: [title ? /*#__PURE__*/jsx("h2", {
6445
+ className: "np-bottom-sheet-v2-title np-text-title-body",
6446
+ children: title
6447
+ }) : null, /*#__PURE__*/jsx("div", {
6448
+ className: "np-bottom-sheet-v2-body np-text-body-default",
6449
+ children: children
6450
+ })]
6448
6451
  })]
6449
- })]
6450
- }, floatingKey)
6452
+ }, floatingKey)
6453
+ })
6451
6454
  })
6452
6455
  })
6453
6456
  })]
@@ -6540,36 +6543,40 @@ function Popover({
6540
6543
  theme: theme,
6541
6544
  screenMode: screenMode,
6542
6545
  isNotRootProvider: true,
6543
- children: /*#__PURE__*/jsx(FloatingFocusManager, {
6544
- context: context,
6545
- children: /*#__PURE__*/jsx(Transition, {
6546
- show: open,
6547
- leave: "transition-opacity",
6548
- leaveTo: "opacity-0",
6549
- beforeEnter: () => {
6550
- setFloatingKey(prev => prev + 1);
6551
- },
6552
- children: /*#__PURE__*/jsx("div", {
6553
- // Force inner state invalidation on open
6554
- ref: refs.setFloating,
6555
- className: "np-popover-v2-container"
6556
- // eslint-disable-next-line react/forbid-dom-props
6557
- ,
6558
- style: floatingStyles,
6559
- ...getFloatingProps(),
6560
- children: /*#__PURE__*/jsxs("div", {
6561
- className: classNames('np-popover-v2', title && 'np-popover-v2--has-title', {
6562
- 'np-popover-v2--padding-md': padding === 'md'
6563
- }),
6564
- children: [title ? /*#__PURE__*/jsx("h2", {
6565
- className: "np-popover-v2-title np-text-title-body",
6566
- children: title
6567
- }) : null, /*#__PURE__*/jsx("div", {
6568
- className: "np-popover-v2-content np-text-body-default",
6569
- children: children
6570
- })]
6571
- })
6572
- }, floatingKey)
6546
+ children: /*#__PURE__*/jsx(Transition, {
6547
+ show: open,
6548
+ leave: "transition-opacity",
6549
+ leaveTo: "opacity-0",
6550
+ beforeEnter: () => {
6551
+ setFloatingKey(prev => prev + 1);
6552
+ },
6553
+ children: /*#__PURE__*/jsx(FocusBoundary, {
6554
+ children: /*#__PURE__*/jsx(FloatingFocusManager, {
6555
+ context: context,
6556
+ guards: false,
6557
+ modal: false,
6558
+ children: /*#__PURE__*/jsx("div", {
6559
+ // Force inner state invalidation on open
6560
+ ref: refs.setFloating,
6561
+ className: "np-popover-v2-container"
6562
+ // eslint-disable-next-line react/forbid-dom-props
6563
+ ,
6564
+ style: floatingStyles,
6565
+ ...getFloatingProps(),
6566
+ children: /*#__PURE__*/jsxs("div", {
6567
+ className: classNames('np-popover-v2', title && 'np-popover-v2--has-title', {
6568
+ 'np-popover-v2--padding-md': padding === 'md'
6569
+ }),
6570
+ children: [title ? /*#__PURE__*/jsx("h2", {
6571
+ className: "np-popover-v2-title np-text-title-body",
6572
+ children: title
6573
+ }) : null, /*#__PURE__*/jsx("div", {
6574
+ className: "np-popover-v2-content np-text-body-default",
6575
+ children: children
6576
+ })]
6577
+ })
6578
+ }, floatingKey)
6579
+ })
6573
6580
  })
6574
6581
  })
6575
6582
  })