@transferwise/components 46.84.1 → 46.86.0
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/avatarLayout/AvatarLayout.js +1 -0
- package/build/avatarLayout/AvatarLayout.js.map +1 -1
- package/build/avatarLayout/AvatarLayout.mjs +1 -0
- package/build/avatarLayout/AvatarLayout.mjs.map +1 -1
- package/build/circularButton/CircularButton.js +18 -21
- package/build/circularButton/CircularButton.js.map +1 -1
- package/build/circularButton/CircularButton.mjs +19 -22
- package/build/circularButton/CircularButton.mjs.map +1 -1
- package/build/definitionList/DefinitionList.js.map +1 -1
- package/build/definitionList/DefinitionList.mjs.map +1 -1
- package/build/dimmer/Dimmer.js.map +1 -1
- package/build/dimmer/Dimmer.mjs.map +1 -1
- package/build/i18n/de.json +1 -0
- package/build/i18n/de.json.js +1 -0
- package/build/i18n/de.json.js.map +1 -1
- package/build/i18n/de.json.mjs +1 -0
- package/build/i18n/de.json.mjs.map +1 -1
- package/build/i18n/en.json +1 -0
- package/build/i18n/en.json.js +1 -0
- package/build/i18n/en.json.js.map +1 -1
- package/build/i18n/en.json.mjs +1 -0
- package/build/i18n/en.json.mjs.map +1 -1
- package/build/i18n/es.json +1 -0
- package/build/i18n/es.json.js +1 -0
- package/build/i18n/es.json.js.map +1 -1
- package/build/i18n/es.json.mjs +1 -0
- package/build/i18n/es.json.mjs.map +1 -1
- package/build/i18n/fr.json +6 -5
- package/build/i18n/fr.json.js +6 -5
- package/build/i18n/fr.json.js.map +1 -1
- package/build/i18n/fr.json.mjs +6 -5
- package/build/i18n/fr.json.mjs.map +1 -1
- package/build/i18n/hu.json +1 -0
- package/build/i18n/hu.json.js +1 -0
- package/build/i18n/hu.json.js.map +1 -1
- package/build/i18n/hu.json.mjs +1 -0
- package/build/i18n/hu.json.mjs.map +1 -1
- package/build/i18n/id.json +1 -0
- package/build/i18n/id.json.js +1 -0
- package/build/i18n/id.json.js.map +1 -1
- package/build/i18n/id.json.mjs +1 -0
- package/build/i18n/id.json.mjs.map +1 -1
- package/build/i18n/it.json +1 -0
- package/build/i18n/it.json.js +1 -0
- package/build/i18n/it.json.js.map +1 -1
- package/build/i18n/it.json.mjs +1 -0
- package/build/i18n/it.json.mjs.map +1 -1
- package/build/i18n/pl.json +1 -0
- package/build/i18n/pl.json.js +1 -0
- package/build/i18n/pl.json.js.map +1 -1
- package/build/i18n/pl.json.mjs +1 -0
- package/build/i18n/pl.json.mjs.map +1 -1
- package/build/i18n/ro.json +1 -0
- package/build/i18n/ro.json.js +1 -0
- package/build/i18n/ro.json.js.map +1 -1
- package/build/i18n/ro.json.mjs +1 -0
- package/build/i18n/ro.json.mjs.map +1 -1
- package/build/i18n/th.json +6 -0
- package/build/i18n/th.json.js +6 -0
- package/build/i18n/th.json.js.map +1 -1
- package/build/i18n/th.json.mjs +6 -0
- package/build/i18n/th.json.mjs.map +1 -1
- package/build/i18n/tr.json +1 -0
- package/build/i18n/tr.json.js +1 -0
- package/build/i18n/tr.json.js.map +1 -1
- package/build/i18n/tr.json.mjs +1 -0
- package/build/i18n/tr.json.mjs.map +1 -1
- package/build/i18n/zh-CN.json +11 -0
- package/build/i18n/zh-CN.json.js +11 -0
- package/build/i18n/zh-CN.json.js.map +1 -1
- package/build/i18n/zh-CN.json.mjs +11 -0
- package/build/i18n/zh-CN.json.mjs.map +1 -1
- package/build/i18n/zh-HK.json +5 -0
- package/build/i18n/zh-HK.json.js +5 -0
- package/build/i18n/zh-HK.json.js.map +1 -1
- package/build/i18n/zh-HK.json.mjs +5 -0
- package/build/i18n/zh-HK.json.mjs.map +1 -1
- package/build/main.css +17 -158
- package/build/moneyInput/MoneyInput.js.map +1 -1
- package/build/moneyInput/MoneyInput.mjs.map +1 -1
- package/build/stepper/Stepper.js +6 -3
- package/build/stepper/Stepper.js.map +1 -1
- package/build/stepper/Stepper.mjs +6 -3
- package/build/stepper/Stepper.mjs.map +1 -1
- package/build/styles/circularButton/CircularButton.css +17 -158
- package/build/styles/main.css +17 -158
- package/build/types/avatarLayout/AvatarLayout.d.ts.map +1 -1
- package/build/types/circularButton/CircularButton.d.ts +11 -4
- package/build/types/circularButton/CircularButton.d.ts.map +1 -1
- package/build/types/definitionList/DefinitionList.d.ts +1 -2
- package/build/types/definitionList/DefinitionList.d.ts.map +1 -1
- package/build/types/dimmer/Dimmer.d.ts +1 -1
- package/build/types/dimmer/Dimmer.d.ts.map +1 -1
- package/build/types/moneyInput/MoneyInput.d.ts +1 -1
- package/build/types/moneyInput/MoneyInput.d.ts.map +1 -1
- package/build/types/stepper/Stepper.d.ts +2 -1
- package/build/types/stepper/Stepper.d.ts.map +1 -1
- package/build/types/test-utils/index.d.ts +2 -0
- package/build/types/test-utils/index.d.ts.map +1 -1
- package/build/types/uploadInput/uploadButton/UploadButton.messages.d.ts +5 -0
- package/build/types/uploadInput/uploadButton/UploadButton.messages.d.ts.map +1 -1
- package/build/uploadInput/uploadButton/UploadButton.js +3 -1
- package/build/uploadInput/uploadButton/UploadButton.js.map +1 -1
- package/build/uploadInput/uploadButton/UploadButton.messages.js +3 -0
- package/build/uploadInput/uploadButton/UploadButton.messages.js.map +1 -1
- package/build/uploadInput/uploadButton/UploadButton.messages.mjs +3 -0
- package/build/uploadInput/uploadButton/UploadButton.messages.mjs.map +1 -1
- package/build/uploadInput/uploadButton/UploadButton.mjs +3 -1
- package/build/uploadInput/uploadButton/UploadButton.mjs.map +1 -1
- package/package.json +5 -5
- package/src/avatar/Avatar.story.tsx +4 -1
- package/src/avatarLayout/AvatarLayout.story.tsx +2 -0
- package/src/avatarLayout/AvatarLayout.tsx +3 -1
- package/src/avatarWrapper/AvatarWrapper.story.tsx +4 -0
- package/src/badge/Badge.story.tsx +4 -0
- package/src/circularButton/CircularButton.css +17 -158
- package/src/circularButton/CircularButton.less +22 -91
- package/src/circularButton/CircularButton.story.tsx +45 -24
- package/src/circularButton/CircularButton.tsx +38 -25
- package/src/definitionList/DefinitionList.story.tsx +57 -57
- package/src/definitionList/DefinitionList.tsx +1 -1
- package/src/dimmer/{Dimmer.rtl.spec.tsx → Dimmer.spec.tsx} +33 -29
- package/src/dimmer/Dimmer.tsx +4 -4
- package/src/flowNavigation/__snapshots__/FlowNavigation.spec.js.snap +3 -1
- package/src/i18n/de.json +1 -0
- package/src/i18n/en.json +1 -0
- package/src/i18n/es.json +1 -0
- package/src/i18n/fr.json +6 -5
- package/src/i18n/hu.json +1 -0
- package/src/i18n/id.json +1 -0
- package/src/i18n/it.json +1 -0
- package/src/i18n/pl.json +1 -0
- package/src/i18n/ro.json +1 -0
- package/src/i18n/th.json +6 -0
- package/src/i18n/tr.json +1 -0
- package/src/i18n/zh-CN.json +11 -0
- package/src/i18n/zh-HK.json +5 -0
- package/src/iconButton/IconButton.story.tsx +6 -6
- package/src/main.css +17 -158
- package/src/moneyInput/MoneyInput.spec.tsx +468 -0
- package/src/moneyInput/MoneyInput.tsx +2 -1
- package/src/navigationOption/NavigationOption.spec.tsx +113 -0
- package/src/phoneNumberInput/PhoneNumberInput.spec.tsx +283 -0
- package/src/radioOption/RadioOption.spec.tsx +73 -0
- package/src/slidingPanel/SlidingPanel.spec.tsx +69 -0
- package/src/stepper/Stepper.spec.tsx +236 -0
- package/src/stepper/Stepper.tests.story.tsx +89 -0
- package/src/stepper/Stepper.tsx +9 -4
- package/src/stepper/{deviceDetection.spec.js → deviceDetection.spec.ts} +6 -3
- package/src/uploadInput/uploadButton/UploadButton.messages.ts +7 -0
- package/src/uploadInput/uploadButton/UploadButton.tsx +1 -1
- package/src/circularButton/_button-label-states.less +0 -34
- package/src/definitionList/DefinitionList.spec.js +0 -91
- package/src/dimmer/Dimmer.spec.js +0 -87
- package/src/moneyInput/MoneyInput.rtl.spec.tsx +0 -149
- package/src/moneyInput/MoneyInput.spec.js +0 -820
- package/src/navigationOption/NavigationOption.spec.js +0 -93
- package/src/phoneNumberInput/PhoneNumberInput.rtl.spec.tsx +0 -32
- package/src/phoneNumberInput/PhoneNumberInput.spec.js +0 -356
- package/src/radioOption/RadioOption.spec.js +0 -67
- package/src/slidingPanel/SlidingPanel.spec.js +0 -56
- package/src/stepper/Stepper.spec.js +0 -233
- /package/src/alert/{Alert.spec.story.tsx → Alert.tests.story.tsx} +0 -0
|
@@ -17,6 +17,7 @@ function AvatarLayout({
|
|
|
17
17
|
const avatarSize = isDiagonal ? DIAGONAL_LAYOUT_STYLE_CONFIG[size]?.avatarSize : size;
|
|
18
18
|
return avatars.length < 1 ? null : avatars.length === 1 ? /*#__PURE__*/jsxRuntime.jsx(AvatarView, {
|
|
19
19
|
...avatars[0],
|
|
20
|
+
size: size,
|
|
20
21
|
children: avatars[0].asset
|
|
21
22
|
}) : /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
22
23
|
className: clsx.clsx('np-avatar-layout', `np-avatar-layout-${orientation}`, className),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarLayout.js","sources":["../../src/avatarLayout/AvatarLayout.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport AvatarView, { AvatarViewProps } from '../avatarView';\n\ntype SingleAvatarType = { asset?: AvatarViewProps['children'] } & Omit<\n AvatarViewProps,\n 'notification' | 'selected' | 'size' | 'badge' | 'children' | 'interactive'\n>;\n\nexport type Props = {\n avatars: SingleAvatarType[];\n orientation?: 'horizontal' | 'diagonal';\n} & Pick<\n AvatarViewProps,\n 'size' | 'interactive' | 'className' | 'role' | 'aria-label' | 'aria-labelledby' | 'aria-hidden'\n>;\n\nexport default function AvatarLayout({\n avatars = [],\n orientation: orientationProp = 'horizontal',\n size = 48,\n className,\n interactive,\n ...restProps\n}: Props) {\n const orientation =\n size === 16 && orientationProp === 'diagonal' ? 'horizontal' : orientationProp;\n const isDiagonal = orientation === 'diagonal';\n const avatarSize = isDiagonal ? DIAGONAL_LAYOUT_STYLE_CONFIG[size]?.avatarSize : size;\n return avatars.length < 1 ? null : avatars.length === 1 ? (\n <AvatarView {...avatars[0]}
|
|
1
|
+
{"version":3,"file":"AvatarLayout.js","sources":["../../src/avatarLayout/AvatarLayout.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport AvatarView, { AvatarViewProps } from '../avatarView';\n\ntype SingleAvatarType = { asset?: AvatarViewProps['children'] } & Omit<\n AvatarViewProps,\n 'notification' | 'selected' | 'size' | 'badge' | 'children' | 'interactive'\n>;\n\nexport type Props = {\n avatars: SingleAvatarType[];\n orientation?: 'horizontal' | 'diagonal';\n} & Pick<\n AvatarViewProps,\n 'size' | 'interactive' | 'className' | 'role' | 'aria-label' | 'aria-labelledby' | 'aria-hidden'\n>;\n\nexport default function AvatarLayout({\n avatars = [],\n orientation: orientationProp = 'horizontal',\n size = 48,\n className,\n interactive,\n ...restProps\n}: Props) {\n const orientation =\n size === 16 && orientationProp === 'diagonal' ? 'horizontal' : orientationProp;\n const isDiagonal = orientation === 'diagonal';\n const avatarSize = isDiagonal ? DIAGONAL_LAYOUT_STYLE_CONFIG[size]?.avatarSize : size;\n return avatars.length < 1 ? null : avatars.length === 1 ? (\n <AvatarView {...avatars[0]} size={size}>\n {avatars[0].asset}\n </AvatarView>\n ) : (\n <div\n className={clsx('np-avatar-layout', `np-avatar-layout-${orientation}`, className)}\n style={{\n // @ts-expect-error CSS custom props allowed\n '--np-avatar-layout-size': `${size}px`,\n '--np-avatar-size': `${avatarSize}px`,\n '--np-avatar-offset': `${isDiagonal ? DIAGONAL_LAYOUT_STYLE_CONFIG[size].offset : HORIZONTAL_LAYOUT_OFFSET[size]}px`,\n }}\n {...restProps}\n >\n {avatars.map(({ asset, style, ...avatar }, index) => (\n <div\n // eslint-disable-next-line react/no-array-index-key\n key={index}\n className={clsx(\n { [`np-avatar-layout-${orientation}-child`]: index !== 0 },\n { [`np-avatar-layout-${orientation}-mask`]: index !== avatars.length - 1 },\n )}\n >\n <AvatarView\n {...avatar}\n size={avatarSize as Props['size']}\n style={{\n ...(isDiagonal && {\n '--circle-size': `${avatarSize}px`,\n '--circle-icon-size': `${DIAGONAL_LAYOUT_STYLE_CONFIG[size].iconSize}px`,\n '--circle-font-size': `${DIAGONAL_LAYOUT_STYLE_CONFIG[size].fontSize}px`,\n }),\n ...style,\n }}\n interactive={interactive}\n >\n {asset}\n </AvatarView>\n </div>\n ))}\n </div>\n );\n}\n\n/** Diagonal layout have custom sizes for avatar, font and icon */\nconst DIAGONAL_LAYOUT_STYLE_CONFIG = {\n // Diagonal layout doesn't support 16 size\n 16: { avatarSize: undefined, offset: undefined, fontSize: undefined, iconSize: undefined },\n 24: { avatarSize: 15, offset: 2.5, fontSize: 8, iconSize: 11.25 },\n 32: { avatarSize: 20, offset: 2.5, fontSize: 12, iconSize: 15 },\n 40: { avatarSize: 24, offset: 4.5, fontSize: 12, iconSize: 18 },\n 48: { avatarSize: 30, offset: 3.5, fontSize: 14, iconSize: 16.87 },\n 56: { avatarSize: 34, offset: 5, fontSize: 14, iconSize: 19.12 },\n 72: { avatarSize: 44, offset: 6, fontSize: 22, iconSize: 22 },\n};\n\n/** Horizontal layout have custom offset between avatars */\nconst HORIZONTAL_LAYOUT_OFFSET = {\n 16: 2,\n 24: 2,\n 32: 4,\n 40: 4,\n 48: 4,\n 56: 5,\n 72: 5,\n};\n"],"names":["AvatarLayout","avatars","orientation","orientationProp","size","className","interactive","restProps","isDiagonal","avatarSize","DIAGONAL_LAYOUT_STYLE_CONFIG","length","_jsx","AvatarView","children","asset","clsx","style","offset","HORIZONTAL_LAYOUT_OFFSET","map","avatar","index","iconSize","fontSize","undefined"],"mappings":"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"}
|
|
@@ -15,6 +15,7 @@ function AvatarLayout({
|
|
|
15
15
|
const avatarSize = isDiagonal ? DIAGONAL_LAYOUT_STYLE_CONFIG[size]?.avatarSize : size;
|
|
16
16
|
return avatars.length < 1 ? null : avatars.length === 1 ? /*#__PURE__*/jsx(AvatarView, {
|
|
17
17
|
...avatars[0],
|
|
18
|
+
size: size,
|
|
18
19
|
children: avatars[0].asset
|
|
19
20
|
}) : /*#__PURE__*/jsx("div", {
|
|
20
21
|
className: clsx('np-avatar-layout', `np-avatar-layout-${orientation}`, className),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarLayout.mjs","sources":["../../src/avatarLayout/AvatarLayout.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport AvatarView, { AvatarViewProps } from '../avatarView';\n\ntype SingleAvatarType = { asset?: AvatarViewProps['children'] } & Omit<\n AvatarViewProps,\n 'notification' | 'selected' | 'size' | 'badge' | 'children' | 'interactive'\n>;\n\nexport type Props = {\n avatars: SingleAvatarType[];\n orientation?: 'horizontal' | 'diagonal';\n} & Pick<\n AvatarViewProps,\n 'size' | 'interactive' | 'className' | 'role' | 'aria-label' | 'aria-labelledby' | 'aria-hidden'\n>;\n\nexport default function AvatarLayout({\n avatars = [],\n orientation: orientationProp = 'horizontal',\n size = 48,\n className,\n interactive,\n ...restProps\n}: Props) {\n const orientation =\n size === 16 && orientationProp === 'diagonal' ? 'horizontal' : orientationProp;\n const isDiagonal = orientation === 'diagonal';\n const avatarSize = isDiagonal ? DIAGONAL_LAYOUT_STYLE_CONFIG[size]?.avatarSize : size;\n return avatars.length < 1 ? null : avatars.length === 1 ? (\n <AvatarView {...avatars[0]}
|
|
1
|
+
{"version":3,"file":"AvatarLayout.mjs","sources":["../../src/avatarLayout/AvatarLayout.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport AvatarView, { AvatarViewProps } from '../avatarView';\n\ntype SingleAvatarType = { asset?: AvatarViewProps['children'] } & Omit<\n AvatarViewProps,\n 'notification' | 'selected' | 'size' | 'badge' | 'children' | 'interactive'\n>;\n\nexport type Props = {\n avatars: SingleAvatarType[];\n orientation?: 'horizontal' | 'diagonal';\n} & Pick<\n AvatarViewProps,\n 'size' | 'interactive' | 'className' | 'role' | 'aria-label' | 'aria-labelledby' | 'aria-hidden'\n>;\n\nexport default function AvatarLayout({\n avatars = [],\n orientation: orientationProp = 'horizontal',\n size = 48,\n className,\n interactive,\n ...restProps\n}: Props) {\n const orientation =\n size === 16 && orientationProp === 'diagonal' ? 'horizontal' : orientationProp;\n const isDiagonal = orientation === 'diagonal';\n const avatarSize = isDiagonal ? DIAGONAL_LAYOUT_STYLE_CONFIG[size]?.avatarSize : size;\n return avatars.length < 1 ? null : avatars.length === 1 ? (\n <AvatarView {...avatars[0]} size={size}>\n {avatars[0].asset}\n </AvatarView>\n ) : (\n <div\n className={clsx('np-avatar-layout', `np-avatar-layout-${orientation}`, className)}\n style={{\n // @ts-expect-error CSS custom props allowed\n '--np-avatar-layout-size': `${size}px`,\n '--np-avatar-size': `${avatarSize}px`,\n '--np-avatar-offset': `${isDiagonal ? DIAGONAL_LAYOUT_STYLE_CONFIG[size].offset : HORIZONTAL_LAYOUT_OFFSET[size]}px`,\n }}\n {...restProps}\n >\n {avatars.map(({ asset, style, ...avatar }, index) => (\n <div\n // eslint-disable-next-line react/no-array-index-key\n key={index}\n className={clsx(\n { [`np-avatar-layout-${orientation}-child`]: index !== 0 },\n { [`np-avatar-layout-${orientation}-mask`]: index !== avatars.length - 1 },\n )}\n >\n <AvatarView\n {...avatar}\n size={avatarSize as Props['size']}\n style={{\n ...(isDiagonal && {\n '--circle-size': `${avatarSize}px`,\n '--circle-icon-size': `${DIAGONAL_LAYOUT_STYLE_CONFIG[size].iconSize}px`,\n '--circle-font-size': `${DIAGONAL_LAYOUT_STYLE_CONFIG[size].fontSize}px`,\n }),\n ...style,\n }}\n interactive={interactive}\n >\n {asset}\n </AvatarView>\n </div>\n ))}\n </div>\n );\n}\n\n/** Diagonal layout have custom sizes for avatar, font and icon */\nconst DIAGONAL_LAYOUT_STYLE_CONFIG = {\n // Diagonal layout doesn't support 16 size\n 16: { avatarSize: undefined, offset: undefined, fontSize: undefined, iconSize: undefined },\n 24: { avatarSize: 15, offset: 2.5, fontSize: 8, iconSize: 11.25 },\n 32: { avatarSize: 20, offset: 2.5, fontSize: 12, iconSize: 15 },\n 40: { avatarSize: 24, offset: 4.5, fontSize: 12, iconSize: 18 },\n 48: { avatarSize: 30, offset: 3.5, fontSize: 14, iconSize: 16.87 },\n 56: { avatarSize: 34, offset: 5, fontSize: 14, iconSize: 19.12 },\n 72: { avatarSize: 44, offset: 6, fontSize: 22, iconSize: 22 },\n};\n\n/** Horizontal layout have custom offset between avatars */\nconst HORIZONTAL_LAYOUT_OFFSET = {\n 16: 2,\n 24: 2,\n 32: 4,\n 40: 4,\n 48: 4,\n 56: 5,\n 72: 5,\n};\n"],"names":["AvatarLayout","avatars","orientation","orientationProp","size","className","interactive","restProps","isDiagonal","avatarSize","DIAGONAL_LAYOUT_STYLE_CONFIG","length","_jsx","AvatarView","children","asset","clsx","style","offset","HORIZONTAL_LAYOUT_OFFSET","map","avatar","index","iconSize","fontSize","undefined"],"mappings":"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"}
|
|
@@ -1,9 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var clsx = require('clsx');
|
|
4
|
-
var React = require('react');
|
|
5
4
|
var Body = require('../body/Body.js');
|
|
6
|
-
var classMap = require('../button/classMap.js');
|
|
7
5
|
require('../common/theme.js');
|
|
8
6
|
require('../common/direction.js');
|
|
9
7
|
var control = require('../common/propsValues/control.js');
|
|
@@ -24,10 +22,11 @@ require('../common/propsValues/scroll.js');
|
|
|
24
22
|
require('../common/propsValues/markdownNodeType.js');
|
|
25
23
|
require('../common/fileType.js');
|
|
26
24
|
require('@transferwise/icons');
|
|
25
|
+
require('react');
|
|
27
26
|
require('react-intl');
|
|
28
27
|
require('../common/closeButton/CloseButton.messages.js');
|
|
29
28
|
var jsxRuntime = require('react/jsx-runtime');
|
|
30
|
-
var
|
|
29
|
+
var IconButton = require('../iconButton/IconButton.js');
|
|
31
30
|
var useMedia = require('../common/hooks/useMedia.js');
|
|
32
31
|
|
|
33
32
|
const CircularButton = ({
|
|
@@ -35,30 +34,28 @@ const CircularButton = ({
|
|
|
35
34
|
children,
|
|
36
35
|
disabled,
|
|
37
36
|
icon,
|
|
37
|
+
onClick,
|
|
38
38
|
priority = control.Priority.PRIMARY,
|
|
39
|
-
type =
|
|
40
|
-
...rest
|
|
39
|
+
type = 'default'
|
|
41
40
|
}) => {
|
|
42
|
-
const classes = clsx.clsx('btn np-btn', 'm-b-1', classMap.typeClassMap[type], classMap.priorityClassMap[priority]);
|
|
43
|
-
const iconElement = Number(icon.props.size) !== 24 ? /*#__PURE__*/React.cloneElement(icon, {
|
|
44
|
-
size: 24
|
|
45
|
-
}) : icon;
|
|
46
41
|
const isTinyViewport = useMedia.useMedia(`(max-width: ${breakpoint.Breakpoint.ZOOM_400}px)`);
|
|
47
42
|
return /*#__PURE__*/jsxRuntime.jsxs("label", {
|
|
48
|
-
className: clsx.clsx('np-circular-btn', priority
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
,
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
className: classes,
|
|
43
|
+
className: clsx.clsx('np-circular-btn', `np-circular-btn-${priority}-${type}`, {
|
|
44
|
+
'np-circular-btn-disabled': disabled
|
|
45
|
+
}, className),
|
|
46
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(IconButton, {
|
|
47
|
+
size: isTinyViewport ? 32 : 56,
|
|
48
|
+
priority: priority,
|
|
49
|
+
type: ['accent', 'positive'].includes(type) ? 'default' : type,
|
|
50
|
+
className: clsx.clsx('m-b-1'),
|
|
57
51
|
disabled: disabled,
|
|
58
|
-
|
|
59
|
-
|
|
52
|
+
onClick: onClick,
|
|
53
|
+
children: icon
|
|
54
|
+
}), /*#__PURE__*/jsxRuntime.jsx(Body, {
|
|
60
55
|
as: "span",
|
|
61
|
-
className:
|
|
56
|
+
className: clsx.clsx('np-circular-btn-label', {
|
|
57
|
+
disabled
|
|
58
|
+
}),
|
|
62
59
|
type: typography.Typography.BODY_DEFAULT_BOLD,
|
|
63
60
|
children: children
|
|
64
61
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CircularButton.js","sources":["../../src/circularButton/CircularButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\
|
|
1
|
+
{"version":3,"file":"CircularButton.js","sources":["../../src/circularButton/CircularButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport Body from '../body/Body';\nimport { Breakpoint, ControlType, Priority, Typography } from '../common';\nimport IconButton, { IconButtonProps } from '../iconButton';\nimport { useMedia } from '../common/hooks/useMedia';\n\n/**\n * @deprecated use `'default'` instead\n */\ntype DeprecatedTypes = `${ControlType.ACCENT | ControlType.POSITIVE}`;\n\nexport interface CircularButtonProps {\n className?: string;\n children: string;\n disabled?: boolean;\n icon: React.ReactElement<{ size?: unknown }> | React.ReactNode;\n onClick?: React.MouseEventHandler<HTMLInputElement> &\n React.MouseEventHandler<HTMLButtonElement> &\n React.MouseEventHandler<HTMLAnchorElement>;\n priority?: `${Priority.PRIMARY | Priority.SECONDARY}`;\n /**\n * `\"accent\"` and `\"positive\"` values are **deprecated**, please use `\"default\"` instead\n */\n type?: DeprecatedTypes | 'default' | `${ControlType.NEGATIVE}`;\n}\n\nconst CircularButton = ({\n className,\n children,\n disabled,\n icon,\n onClick,\n priority = Priority.PRIMARY,\n type = 'default',\n}: CircularButtonProps) => {\n const isTinyViewport = useMedia(`(max-width: ${Breakpoint.ZOOM_400}px)`);\n return (\n <label\n className={clsx(\n 'np-circular-btn',\n `np-circular-btn-${priority}-${type}`,\n { 'np-circular-btn-disabled': disabled },\n className,\n )}\n >\n <IconButton\n size={isTinyViewport ? 32 : 56}\n priority={priority}\n type={['accent', 'positive'].includes(type) ? 'default' : (type as IconButtonProps['type'])}\n className={clsx('m-b-1')}\n disabled={disabled}\n onClick={onClick}\n >\n {icon}\n </IconButton>\n <Body\n as=\"span\"\n className={clsx('np-circular-btn-label', { disabled })}\n type={Typography.BODY_DEFAULT_BOLD}\n >\n {children}\n </Body>\n </label>\n );\n};\n\nexport default CircularButton;\n"],"names":["CircularButton","className","children","disabled","icon","onClick","priority","Priority","PRIMARY","type","isTinyViewport","useMedia","Breakpoint","ZOOM_400","_jsxs","clsx","_jsx","IconButton","size","includes","Body","as","Typography","BODY_DEFAULT_BOLD"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BMA,MAAAA,cAAc,GAAGA,CAAC;EACtBC,SAAS;EACTC,QAAQ;EACRC,QAAQ;EACRC,IAAI;EACJC,OAAO;EACPC,QAAQ,GAAGC,gBAAQ,CAACC,OAAO;AAC3BC,EAAAA,IAAI,GAAG,SAAA;AACa,CAAA,KAAI;EACxB,MAAMC,cAAc,GAAGC,iBAAQ,CAAC,eAAeC,qBAAU,CAACC,QAAQ,CAAA,GAAA,CAAK,CAAC,CAAA;AACxE,EAAA,oBACEC,eAAA,CAAA,OAAA,EAAA;IACEb,SAAS,EAAEc,SAAI,CACb,iBAAiB,EACjB,mBAAmBT,QAAQ,CAAA,CAAA,EAAIG,IAAI,CAAA,CAAE,EACrC;AAAE,MAAA,0BAA0B,EAAEN,QAAAA;KAAU,EACxCF,SAAS,CACT;IAAAC,QAAA,EAAA,cAEFc,cAAA,CAACC,UAAU,EAAA;AACTC,MAAAA,IAAI,EAAER,cAAc,GAAG,EAAE,GAAG,EAAG;AAC/BJ,MAAAA,QAAQ,EAAEA,QAAS;AACnBG,MAAAA,IAAI,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC,CAACU,QAAQ,CAACV,IAAI,CAAC,GAAG,SAAS,GAAIA,IAAiC;AAC5FR,MAAAA,SAAS,EAAEc,SAAI,CAAC,OAAO,CAAE;AACzBZ,MAAAA,QAAQ,EAAEA,QAAS;AACnBE,MAAAA,OAAO,EAAEA,OAAQ;AAAAH,MAAAA,QAAA,EAEhBE,IAAAA;AAAI,KACK,CACZ,eAAAY,cAAA,CAACI,IAAI,EAAA;AACHC,MAAAA,EAAE,EAAC,MAAM;AACTpB,MAAAA,SAAS,EAAEc,SAAI,CAAC,uBAAuB,EAAE;AAAEZ,QAAAA,QAAAA;AAAQ,OAAE,CAAE;MACvDM,IAAI,EAAEa,qBAAU,CAACC,iBAAkB;AAAArB,MAAAA,QAAA,EAElCA,QAAAA;AAAQ,KACL,CACR,CAAA;AAAA,GAAO,CAAC,CAAA;AAEZ;;;;"}
|
|
@@ -1,10 +1,8 @@
|
|
|
1
1
|
import { clsx } from 'clsx';
|
|
2
|
-
import { cloneElement } from 'react';
|
|
3
2
|
import Body from '../body/Body.mjs';
|
|
4
|
-
import { typeClassMap, priorityClassMap } from '../button/classMap.mjs';
|
|
5
3
|
import '../common/theme.mjs';
|
|
6
4
|
import '../common/direction.mjs';
|
|
7
|
-
import { Priority
|
|
5
|
+
import { Priority } from '../common/propsValues/control.mjs';
|
|
8
6
|
import { Breakpoint } from '../common/propsValues/breakpoint.mjs';
|
|
9
7
|
import '../common/propsValues/size.mjs';
|
|
10
8
|
import { Typography } from '../common/propsValues/typography.mjs';
|
|
@@ -22,10 +20,11 @@ import '../common/propsValues/scroll.mjs';
|
|
|
22
20
|
import '../common/propsValues/markdownNodeType.mjs';
|
|
23
21
|
import '../common/fileType.mjs';
|
|
24
22
|
import '@transferwise/icons';
|
|
23
|
+
import 'react';
|
|
25
24
|
import 'react-intl';
|
|
26
25
|
import '../common/closeButton/CloseButton.messages.mjs';
|
|
27
26
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
28
|
-
import
|
|
27
|
+
import IconButton from '../iconButton/IconButton.mjs';
|
|
29
28
|
import { useMedia } from '../common/hooks/useMedia.mjs';
|
|
30
29
|
|
|
31
30
|
const CircularButton = ({
|
|
@@ -33,30 +32,28 @@ const CircularButton = ({
|
|
|
33
32
|
children,
|
|
34
33
|
disabled,
|
|
35
34
|
icon,
|
|
35
|
+
onClick,
|
|
36
36
|
priority = Priority.PRIMARY,
|
|
37
|
-
type =
|
|
38
|
-
...rest
|
|
37
|
+
type = 'default'
|
|
39
38
|
}) => {
|
|
40
|
-
const classes = clsx('btn np-btn', 'm-b-1', typeClassMap[type], priorityClassMap[priority]);
|
|
41
|
-
const iconElement = Number(icon.props.size) !== 24 ? /*#__PURE__*/cloneElement(icon, {
|
|
42
|
-
size: 24
|
|
43
|
-
}) : icon;
|
|
44
39
|
const isTinyViewport = useMedia(`(max-width: ${Breakpoint.ZOOM_400}px)`);
|
|
45
40
|
return /*#__PURE__*/jsxs("label", {
|
|
46
|
-
className: clsx('np-circular-btn', priority
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
,
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
className: classes,
|
|
41
|
+
className: clsx('np-circular-btn', `np-circular-btn-${priority}-${type}`, {
|
|
42
|
+
'np-circular-btn-disabled': disabled
|
|
43
|
+
}, className),
|
|
44
|
+
children: [/*#__PURE__*/jsx(IconButton, {
|
|
45
|
+
size: isTinyViewport ? 32 : 56,
|
|
46
|
+
priority: priority,
|
|
47
|
+
type: ['accent', 'positive'].includes(type) ? 'default' : type,
|
|
48
|
+
className: clsx('m-b-1'),
|
|
55
49
|
disabled: disabled,
|
|
56
|
-
|
|
57
|
-
|
|
50
|
+
onClick: onClick,
|
|
51
|
+
children: icon
|
|
52
|
+
}), /*#__PURE__*/jsx(Body, {
|
|
58
53
|
as: "span",
|
|
59
|
-
className:
|
|
54
|
+
className: clsx('np-circular-btn-label', {
|
|
55
|
+
disabled
|
|
56
|
+
}),
|
|
60
57
|
type: Typography.BODY_DEFAULT_BOLD,
|
|
61
58
|
children: children
|
|
62
59
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CircularButton.mjs","sources":["../../src/circularButton/CircularButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\
|
|
1
|
+
{"version":3,"file":"CircularButton.mjs","sources":["../../src/circularButton/CircularButton.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport Body from '../body/Body';\nimport { Breakpoint, ControlType, Priority, Typography } from '../common';\nimport IconButton, { IconButtonProps } from '../iconButton';\nimport { useMedia } from '../common/hooks/useMedia';\n\n/**\n * @deprecated use `'default'` instead\n */\ntype DeprecatedTypes = `${ControlType.ACCENT | ControlType.POSITIVE}`;\n\nexport interface CircularButtonProps {\n className?: string;\n children: string;\n disabled?: boolean;\n icon: React.ReactElement<{ size?: unknown }> | React.ReactNode;\n onClick?: React.MouseEventHandler<HTMLInputElement> &\n React.MouseEventHandler<HTMLButtonElement> &\n React.MouseEventHandler<HTMLAnchorElement>;\n priority?: `${Priority.PRIMARY | Priority.SECONDARY}`;\n /**\n * `\"accent\"` and `\"positive\"` values are **deprecated**, please use `\"default\"` instead\n */\n type?: DeprecatedTypes | 'default' | `${ControlType.NEGATIVE}`;\n}\n\nconst CircularButton = ({\n className,\n children,\n disabled,\n icon,\n onClick,\n priority = Priority.PRIMARY,\n type = 'default',\n}: CircularButtonProps) => {\n const isTinyViewport = useMedia(`(max-width: ${Breakpoint.ZOOM_400}px)`);\n return (\n <label\n className={clsx(\n 'np-circular-btn',\n `np-circular-btn-${priority}-${type}`,\n { 'np-circular-btn-disabled': disabled },\n className,\n )}\n >\n <IconButton\n size={isTinyViewport ? 32 : 56}\n priority={priority}\n type={['accent', 'positive'].includes(type) ? 'default' : (type as IconButtonProps['type'])}\n className={clsx('m-b-1')}\n disabled={disabled}\n onClick={onClick}\n >\n {icon}\n </IconButton>\n <Body\n as=\"span\"\n className={clsx('np-circular-btn-label', { disabled })}\n type={Typography.BODY_DEFAULT_BOLD}\n >\n {children}\n </Body>\n </label>\n );\n};\n\nexport default CircularButton;\n"],"names":["CircularButton","className","children","disabled","icon","onClick","priority","Priority","PRIMARY","type","isTinyViewport","useMedia","Breakpoint","ZOOM_400","_jsxs","clsx","_jsx","IconButton","size","includes","Body","as","Typography","BODY_DEFAULT_BOLD"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BMA,MAAAA,cAAc,GAAGA,CAAC;EACtBC,SAAS;EACTC,QAAQ;EACRC,QAAQ;EACRC,IAAI;EACJC,OAAO;EACPC,QAAQ,GAAGC,QAAQ,CAACC,OAAO;AAC3BC,EAAAA,IAAI,GAAG,SAAA;AACa,CAAA,KAAI;EACxB,MAAMC,cAAc,GAAGC,QAAQ,CAAC,eAAeC,UAAU,CAACC,QAAQ,CAAA,GAAA,CAAK,CAAC,CAAA;AACxE,EAAA,oBACEC,IAAA,CAAA,OAAA,EAAA;IACEb,SAAS,EAAEc,IAAI,CACb,iBAAiB,EACjB,mBAAmBT,QAAQ,CAAA,CAAA,EAAIG,IAAI,CAAA,CAAE,EACrC;AAAE,MAAA,0BAA0B,EAAEN,QAAAA;KAAU,EACxCF,SAAS,CACT;IAAAC,QAAA,EAAA,cAEFc,GAAA,CAACC,UAAU,EAAA;AACTC,MAAAA,IAAI,EAAER,cAAc,GAAG,EAAE,GAAG,EAAG;AAC/BJ,MAAAA,QAAQ,EAAEA,QAAS;AACnBG,MAAAA,IAAI,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC,CAACU,QAAQ,CAACV,IAAI,CAAC,GAAG,SAAS,GAAIA,IAAiC;AAC5FR,MAAAA,SAAS,EAAEc,IAAI,CAAC,OAAO,CAAE;AACzBZ,MAAAA,QAAQ,EAAEA,QAAS;AACnBE,MAAAA,OAAO,EAAEA,OAAQ;AAAAH,MAAAA,QAAA,EAEhBE,IAAAA;AAAI,KACK,CACZ,eAAAY,GAAA,CAACI,IAAI,EAAA;AACHC,MAAAA,EAAE,EAAC,MAAM;AACTpB,MAAAA,SAAS,EAAEc,IAAI,CAAC,uBAAuB,EAAE;AAAEZ,QAAAA,QAAAA;AAAQ,OAAE,CAAE;MACvDM,IAAI,EAAEa,UAAU,CAACC,iBAAkB;AAAArB,MAAAA,QAAA,EAElCA,QAAAA;AAAQ,KACL,CACR,CAAA;AAAA,GAAO,CAAC,CAAA;AAEZ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefinitionList.js","sources":["../../src/definitionList/DefinitionList.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport ActionButton from '../actionButton';\nimport { Layout } from '../common';\n\nexport interface DefinitionListDefinition {\n action?: {\n label: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n };\n title: React.ReactNode;\n value: React.ReactNode;\n key: string;\n}\n\
|
|
1
|
+
{"version":3,"file":"DefinitionList.js","sources":["../../src/definitionList/DefinitionList.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport ActionButton from '../actionButton';\nimport { Layout } from '../common';\n\nexport interface DefinitionListDefinition {\n action?: {\n label: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n };\n title: React.ReactNode;\n value: React.ReactNode;\n key: string;\n}\n\nexport type DefinitionListLayout =\n `${Layout.VERTICAL_TWO_COLUMN | Layout.VERTICAL_ONE_COLUMN | Layout.HORIZONTAL_JUSTIFIED | Layout.HORIZONTAL_LEFT_ALIGNED | Layout.HORIZONTAL_RIGHT_ALIGNED}`;\n\nexport interface DefinitionListProps {\n definitions?: DefinitionListDefinition[];\n layout?: DefinitionListLayout;\n muted?: boolean;\n}\n\nconst isLayoutHorizontal = (layout: DefinitionListLayout) =>\n layout === Layout.HORIZONTAL_LEFT_ALIGNED ||\n layout === Layout.HORIZONTAL_RIGHT_ALIGNED ||\n layout === Layout.HORIZONTAL_JUSTIFIED;\n\nconst getAlignmentClasses = (\n layout: DefinitionListLayout,\n action: DefinitionListDefinition['action'],\n) => {\n const classes = ['d-flex'];\n\n if (action) {\n if (isLayoutHorizontal(layout)) {\n classes.push('align-items-center');\n } else {\n classes.push('align-items-start');\n }\n }\n\n if (layout === Layout.HORIZONTAL_RIGHT_ALIGNED) {\n classes.push('text-sm-right tw-definition-list--right-aligned-desktop');\n } else {\n classes.push('justify-content-between');\n }\n\n if (layout === Layout.HORIZONTAL_JUSTIFIED) {\n classes.push('text-sm-justify');\n }\n\n return classes;\n};\n\nconst defaultDefinitions = [] satisfies DefinitionListProps['definitions'];\n\nexport default function DefinitionList({\n definitions = defaultDefinitions,\n layout = 'VERTICAL_TWO_COLUMN',\n muted,\n}: DefinitionListProps) {\n return (\n <dl\n className={clsx('tw-definition-list d-flex ', {\n 'text-muted': muted,\n 'flex-column': layout === Layout.VERTICAL_ONE_COLUMN,\n 'tw-definition-list--columns flex-column flex-row--sm':\n layout === Layout.VERTICAL_TWO_COLUMN,\n 'tw-definition-list--horizontal flex-column': isLayoutHorizontal(layout),\n })}\n >\n {definitions\n .filter((definition) => definition)\n .map(({ action, title, value, key }) => (\n <div key={key} className=\"tw-definition-list__item\">\n <dt>{title}</dt>\n <dd className={clsx(...getAlignmentClasses(layout, action))}>\n <div>{value}</div>\n {action ? (\n <div\n className={clsx(\n isLayoutHorizontal(layout) ? 'p-l-2' : 'p-x-2',\n 'tw-definition-list__action',\n )}\n >\n <ActionButton className=\"tw-definition-list__button\" onClick={action.onClick}>\n {action.label}\n </ActionButton>\n </div>\n ) : null}\n </dd>\n </div>\n ))}\n </dl>\n );\n}\n"],"names":["isLayoutHorizontal","layout","Layout","HORIZONTAL_LEFT_ALIGNED","HORIZONTAL_RIGHT_ALIGNED","HORIZONTAL_JUSTIFIED","getAlignmentClasses","action","classes","push","defaultDefinitions","DefinitionList","definitions","muted","_jsx","className","clsx","VERTICAL_ONE_COLUMN","VERTICAL_TWO_COLUMN","children","filter","definition","map","title","value","key","_jsxs","ActionButton","onClick","label"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefinitionList.mjs","sources":["../../src/definitionList/DefinitionList.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport ActionButton from '../actionButton';\nimport { Layout } from '../common';\n\nexport interface DefinitionListDefinition {\n action?: {\n label: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n };\n title: React.ReactNode;\n value: React.ReactNode;\n key: string;\n}\n\
|
|
1
|
+
{"version":3,"file":"DefinitionList.mjs","sources":["../../src/definitionList/DefinitionList.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport ActionButton from '../actionButton';\nimport { Layout } from '../common';\n\nexport interface DefinitionListDefinition {\n action?: {\n label: string;\n onClick?: React.MouseEventHandler<HTMLButtonElement>;\n };\n title: React.ReactNode;\n value: React.ReactNode;\n key: string;\n}\n\nexport type DefinitionListLayout =\n `${Layout.VERTICAL_TWO_COLUMN | Layout.VERTICAL_ONE_COLUMN | Layout.HORIZONTAL_JUSTIFIED | Layout.HORIZONTAL_LEFT_ALIGNED | Layout.HORIZONTAL_RIGHT_ALIGNED}`;\n\nexport interface DefinitionListProps {\n definitions?: DefinitionListDefinition[];\n layout?: DefinitionListLayout;\n muted?: boolean;\n}\n\nconst isLayoutHorizontal = (layout: DefinitionListLayout) =>\n layout === Layout.HORIZONTAL_LEFT_ALIGNED ||\n layout === Layout.HORIZONTAL_RIGHT_ALIGNED ||\n layout === Layout.HORIZONTAL_JUSTIFIED;\n\nconst getAlignmentClasses = (\n layout: DefinitionListLayout,\n action: DefinitionListDefinition['action'],\n) => {\n const classes = ['d-flex'];\n\n if (action) {\n if (isLayoutHorizontal(layout)) {\n classes.push('align-items-center');\n } else {\n classes.push('align-items-start');\n }\n }\n\n if (layout === Layout.HORIZONTAL_RIGHT_ALIGNED) {\n classes.push('text-sm-right tw-definition-list--right-aligned-desktop');\n } else {\n classes.push('justify-content-between');\n }\n\n if (layout === Layout.HORIZONTAL_JUSTIFIED) {\n classes.push('text-sm-justify');\n }\n\n return classes;\n};\n\nconst defaultDefinitions = [] satisfies DefinitionListProps['definitions'];\n\nexport default function DefinitionList({\n definitions = defaultDefinitions,\n layout = 'VERTICAL_TWO_COLUMN',\n muted,\n}: DefinitionListProps) {\n return (\n <dl\n className={clsx('tw-definition-list d-flex ', {\n 'text-muted': muted,\n 'flex-column': layout === Layout.VERTICAL_ONE_COLUMN,\n 'tw-definition-list--columns flex-column flex-row--sm':\n layout === Layout.VERTICAL_TWO_COLUMN,\n 'tw-definition-list--horizontal flex-column': isLayoutHorizontal(layout),\n })}\n >\n {definitions\n .filter((definition) => definition)\n .map(({ action, title, value, key }) => (\n <div key={key} className=\"tw-definition-list__item\">\n <dt>{title}</dt>\n <dd className={clsx(...getAlignmentClasses(layout, action))}>\n <div>{value}</div>\n {action ? (\n <div\n className={clsx(\n isLayoutHorizontal(layout) ? 'p-l-2' : 'p-x-2',\n 'tw-definition-list__action',\n )}\n >\n <ActionButton className=\"tw-definition-list__button\" onClick={action.onClick}>\n {action.label}\n </ActionButton>\n </div>\n ) : null}\n </dd>\n </div>\n ))}\n </dl>\n );\n}\n"],"names":["isLayoutHorizontal","layout","Layout","HORIZONTAL_LEFT_ALIGNED","HORIZONTAL_RIGHT_ALIGNED","HORIZONTAL_JUSTIFIED","getAlignmentClasses","action","classes","push","defaultDefinitions","DefinitionList","definitions","muted","_jsx","className","clsx","VERTICAL_ONE_COLUMN","VERTICAL_TWO_COLUMN","children","filter","definition","map","title","value","key","_jsxs","ActionButton","onClick","label"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dimmer.js","sources":["../../src/dimmer/Dimmer.tsx"],"sourcesContent":["import { ThemeProvider, useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { MouseEvent, ReactNode, useCallback, useEffect, useRef, useState } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport {\n addNoScrollClass,\n CommonProps,\n PositionBottom,\n PositionCenter,\n PositionTop,\n removeNoScrollClass,\n} from '../common';\nimport { isIosDevice } from '../common/deviceDetection';\nimport FocusBoundary from '../common/focusBoundary';\nimport withNextPortal from '../withNextPortal/withNextPortal';\n\nimport DimmerManager from './dimmerManager';\n\nexport const EXIT_ANIMATION = 350;\n\nconst dimmerManager = new DimmerManager();\n\nexport type DimmerProps = CommonProps & {\n children?: ReactNode;\n disableClickToClose?: boolean;\n contentPosition?: PositionTop | PositionCenter | PositionBottom;\n fadeContentOnEnter?: boolean;\n fadeContentOnExit?: boolean;\n open?: boolean;\n scrollable?: boolean;\n transparent?: boolean;\n onClose?: (event: KeyboardEvent | MouseEvent) => void;\n onExited?: () => void;\n};\n\nexport const handleTouchMove = (event: Event) => {\n const isTouchedElementDimmer = (event.target as HTMLDivElement).classList.contains('dimmer');\n\n // disable scroll on iOS devices for Dimmer area\n // this is because of bug in WebKit https://bugs.webkit.org/show_bug.cgi?id=220908\n // note: scrolling still works for children(s) as expected\n if (isIosDevice() && isTouchedElementDimmer) {\n event.stopPropagation();\n event.preventDefault();\n }\n};\n\nconst Dimmer = ({\n children,\n className,\n disableClickToClose = false,\n contentPosition,\n fadeContentOnEnter = false,\n fadeContentOnExit = false,\n open = false,\n scrollable = false,\n transparent = false,\n onClose,\n onExited: handleExited,\n}: DimmerProps) => {\n const [hasNotExited, setHasNotExited] = useState(false);\n const dimmerReference = useRef<HTMLDivElement>(null);\n\n const closeOnClick = (event: MouseEvent<HTMLDivElement>) => {\n if (event.target === dimmerReference.current) {\n onClose?.(event);\n }\n };\n\n const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n if (disableClickToClose || !onClose) {\n return;\n }\n\n closeOnClick(event);\n };\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key !== 'Escape') {\n return;\n }\n event.stopPropagation();\n\n if (onClose && dimmerReference.current && dimmerManager.isTop(dimmerReference.current)) {\n onClose(event);\n }\n },\n [onClose],\n );\n\n const onEnter = () => {\n setHasNotExited(true);\n\n if (dimmerReference.current) {\n dimmerManager.add(dimmerReference.current);\n }\n };\n const onExited = () => {\n setHasNotExited(false);\n\n if (dimmerReference.current) {\n dimmerManager.remove(dimmerReference.current);\n }\n\n handleExited?.();\n };\n\n useEffect(() => {\n const localReferenceCopy = dimmerReference.current;\n\n if (open) {\n document.addEventListener('keydown', handleKeyDown);\n localReferenceCopy?.addEventListener('touchmove', handleTouchMove, { passive: true });\n }\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n\n localReferenceCopy?.removeEventListener('touchmove', handleTouchMove);\n };\n }, [handleKeyDown, open]);\n\n return (\n <DimmerWrapper open={open} hasNotExited={hasNotExited}>\n <CSSTransition\n nodeRef={dimmerReference}\n in={open}\n appear\n // Wait for animation to finish before unmount.\n timeout={{ enter: 0, exit: EXIT_ANIMATION }}\n classNames={{\n enter: clsx({ 'dimmer--enter-fade': fadeContentOnEnter }),\n enterDone: clsx('dimmer--enter-done', {\n 'dimmer--enter-fade': fadeContentOnEnter,\n }),\n exit: clsx('dimmer--exit', { 'dimmer--exit-fade': fadeContentOnExit }),\n }}\n unmountOnExit\n onEnter={onEnter}\n onExited={onExited}\n >\n <DimmerContentWrapper scrollBody={!transparent}>\n <FocusBoundary>\n <div\n ref={dimmerReference}\n className={clsx(\n 'dimmer',\n { 'dimmer--scrollable': scrollable, 'dimmer--transparent': transparent },\n className,\n )}\n role=\"presentation\"\n onClick={handleClick}\n >\n <div\n className={clsx(\n 'dimmer-content-positioner',\n contentPosition != null && [\n 'd-flex justify-content-center',\n {\n 'align-items-start': contentPosition === 'top',\n 'align-items-center': contentPosition === 'center',\n 'align-items-end': contentPosition === 'bottom',\n },\n ],\n )}\n >\n {children}\n </div>\n </div>\n </FocusBoundary>\n </DimmerContentWrapper>\n </CSSTransition>\n </DimmerWrapper>\n );\n};\n\nconst DimmerWrapper: React.ComponentType<{\n open: boolean;\n hasNotExited: boolean;\n children: React.ReactNode;\n}> = ({ open, hasNotExited, children }) => {\n const { screenMode, theme } = useTheme();\n\n return open || hasNotExited ? (\n <ThemeProvider\n theme=\"personal\"\n screenMode={theme === 'personal' ? screenMode : 'light'}\n isNotRootProvider\n >\n {children}\n </ThemeProvider>\n ) : (\n <>{children}</>\n );\n};\n\nexport const DimmerContentWrapper = ({\n children,\n scrollBody,\n}: {\n children: React.ReactElement;\n scrollBody: boolean;\n}) => {\n useEffect(() => {\n if (scrollBody) {\n addNoScrollClass();\n }\n\n return () => {\n if (scrollBody) {\n removeNoScrollClass();\n }\n };\n }, [scrollBody]);\n\n return children;\n};\n\n// Export without the Portal for tests only\nexport { Dimmer };\n\nexport default withNextPortal(Dimmer);\n"],"names":["EXIT_ANIMATION","dimmerManager","DimmerManager","handleTouchMove","event","isTouchedElementDimmer","target","classList","contains","isIosDevice","stopPropagation","preventDefault","Dimmer","children","className","disableClickToClose","contentPosition","fadeContentOnEnter","fadeContentOnExit","open","scrollable","transparent","onClose","onExited","handleExited","hasNotExited","setHasNotExited","useState","dimmerReference","useRef","closeOnClick","current","handleClick","handleKeyDown","useCallback","key","isTop","onEnter","add","remove","useEffect","localReferenceCopy","document","addEventListener","passive","removeEventListener","_jsx","DimmerWrapper","CSSTransition","nodeRef","in","appear","timeout","enter","exit","classNames","clsx","enterDone","unmountOnExit","DimmerContentWrapper","scrollBody","FocusBoundary","ref","role","onClick","screenMode","theme","useTheme","ThemeProvider","isNotRootProvider","_Fragment","addNoScrollClass","removeNoScrollClass","withNextPortal"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Dimmer.js","sources":["../../src/dimmer/Dimmer.tsx"],"sourcesContent":["import { ThemeProvider, useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { MouseEvent, ReactNode, useCallback, useEffect, useRef, useState } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport {\n addNoScrollClass,\n removeNoScrollClass,\n type CommonProps,\n type PositionBottom,\n type PositionCenter,\n type PositionTop,\n} from '../common';\nimport { isIosDevice } from '../common/deviceDetection';\nimport FocusBoundary from '../common/focusBoundary';\nimport withNextPortal from '../withNextPortal/withNextPortal';\n\nimport DimmerManager from './dimmerManager';\n\nexport const EXIT_ANIMATION = 350;\n\nconst dimmerManager = new DimmerManager();\n\nexport type DimmerProps = CommonProps & {\n children?: ReactNode;\n disableClickToClose?: boolean;\n contentPosition?: PositionTop | PositionCenter | PositionBottom;\n fadeContentOnEnter?: boolean;\n fadeContentOnExit?: boolean;\n open?: boolean;\n scrollable?: boolean;\n transparent?: boolean;\n onClose?: (event: KeyboardEvent | MouseEvent) => void;\n onExited?: () => void;\n};\n\nexport const handleTouchMove = (event: Event) => {\n const isTouchedElementDimmer = (event.target as HTMLDivElement).classList.contains('dimmer');\n\n // disable scroll on iOS devices for Dimmer area\n // this is because of bug in WebKit https://bugs.webkit.org/show_bug.cgi?id=220908\n // note: scrolling still works for children(s) as expected\n if (isIosDevice() && isTouchedElementDimmer) {\n event.stopPropagation();\n event.preventDefault();\n }\n};\n\nconst Dimmer = ({\n children,\n className,\n disableClickToClose = false,\n contentPosition,\n fadeContentOnEnter = false,\n fadeContentOnExit = false,\n open = false,\n scrollable = false,\n transparent = false,\n onClose,\n onExited: handleExited,\n}: DimmerProps) => {\n const [hasNotExited, setHasNotExited] = useState(false);\n const dimmerReference = useRef<HTMLDivElement>(null);\n\n const closeOnClick = (event: MouseEvent<HTMLDivElement>) => {\n if (event.target === dimmerReference.current) {\n onClose?.(event);\n }\n };\n\n const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n if (disableClickToClose || !onClose) {\n return;\n }\n\n closeOnClick(event);\n };\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key !== 'Escape') {\n return;\n }\n event.stopPropagation();\n\n if (onClose && dimmerReference.current && dimmerManager.isTop(dimmerReference.current)) {\n onClose(event);\n }\n },\n [onClose],\n );\n\n const onEnter = () => {\n setHasNotExited(true);\n\n if (dimmerReference.current) {\n dimmerManager.add(dimmerReference.current);\n }\n };\n const onExited = () => {\n setHasNotExited(false);\n\n if (dimmerReference.current) {\n dimmerManager.remove(dimmerReference.current);\n }\n\n handleExited?.();\n };\n\n useEffect(() => {\n const localReferenceCopy = dimmerReference.current;\n\n if (open) {\n document.addEventListener('keydown', handleKeyDown);\n localReferenceCopy?.addEventListener('touchmove', handleTouchMove, { passive: true });\n }\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n\n localReferenceCopy?.removeEventListener('touchmove', handleTouchMove);\n };\n }, [handleKeyDown, open]);\n\n return (\n <DimmerWrapper open={open} hasNotExited={hasNotExited}>\n <CSSTransition\n nodeRef={dimmerReference}\n in={open}\n appear\n // Wait for animation to finish before unmount.\n timeout={{ enter: 0, exit: EXIT_ANIMATION }}\n classNames={{\n enter: clsx({ 'dimmer--enter-fade': fadeContentOnEnter }),\n enterDone: clsx('dimmer--enter-done', {\n 'dimmer--enter-fade': fadeContentOnEnter,\n }),\n exit: clsx('dimmer--exit', { 'dimmer--exit-fade': fadeContentOnExit }),\n }}\n unmountOnExit\n onEnter={onEnter}\n onExited={onExited}\n >\n <DimmerContentWrapper scrollBody={!transparent}>\n <FocusBoundary>\n <div\n ref={dimmerReference}\n className={clsx(\n 'dimmer',\n { 'dimmer--scrollable': scrollable, 'dimmer--transparent': transparent },\n className,\n )}\n role=\"presentation\"\n onClick={handleClick}\n >\n <div\n className={clsx(\n 'dimmer-content-positioner',\n contentPosition != null && [\n 'd-flex justify-content-center',\n {\n 'align-items-start': contentPosition === 'top',\n 'align-items-center': contentPosition === 'center',\n 'align-items-end': contentPosition === 'bottom',\n },\n ],\n )}\n >\n {children}\n </div>\n </div>\n </FocusBoundary>\n </DimmerContentWrapper>\n </CSSTransition>\n </DimmerWrapper>\n );\n};\n\nconst DimmerWrapper: React.ComponentType<{\n open: boolean;\n hasNotExited: boolean;\n children: React.ReactNode;\n}> = ({ open, hasNotExited, children }) => {\n const { screenMode, theme } = useTheme();\n\n return open || hasNotExited ? (\n <ThemeProvider\n theme=\"personal\"\n screenMode={theme === 'personal' ? screenMode : 'light'}\n isNotRootProvider\n >\n {children}\n </ThemeProvider>\n ) : (\n <>{children}</>\n );\n};\n\nexport const DimmerContentWrapper = ({\n children,\n scrollBody,\n}: {\n children: React.ReactElement;\n scrollBody: boolean;\n}) => {\n useEffect(() => {\n if (scrollBody) {\n addNoScrollClass();\n }\n\n return () => {\n if (scrollBody) {\n removeNoScrollClass();\n }\n };\n }, [scrollBody]);\n\n return children;\n};\n\n// Export without the Portal for tests only\nexport { Dimmer };\n\nexport default withNextPortal(Dimmer);\n"],"names":["EXIT_ANIMATION","dimmerManager","DimmerManager","handleTouchMove","event","isTouchedElementDimmer","target","classList","contains","isIosDevice","stopPropagation","preventDefault","Dimmer","children","className","disableClickToClose","contentPosition","fadeContentOnEnter","fadeContentOnExit","open","scrollable","transparent","onClose","onExited","handleExited","hasNotExited","setHasNotExited","useState","dimmerReference","useRef","closeOnClick","current","handleClick","handleKeyDown","useCallback","key","isTop","onEnter","add","remove","useEffect","localReferenceCopy","document","addEventListener","passive","removeEventListener","_jsx","DimmerWrapper","CSSTransition","nodeRef","in","appear","timeout","enter","exit","classNames","clsx","enterDone","unmountOnExit","DimmerContentWrapper","scrollBody","FocusBoundary","ref","role","onClick","screenMode","theme","useTheme","ThemeProvider","isNotRootProvider","_Fragment","addNoScrollClass","removeNoScrollClass","withNextPortal"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAMA,cAAc,GAAG,IAAG;AAEjC,MAAMC,aAAa,GAAG,IAAIC,aAAa,EAAE,CAAA;AAe5BC,MAAAA,eAAe,GAAIC,KAAY,IAAI;EAC9C,MAAMC,sBAAsB,GAAID,KAAK,CAACE,MAAyB,CAACC,SAAS,CAACC,QAAQ,CAAC,QAAQ,CAAC,CAAA;AAE5F;AACA;AACA;AACA,EAAA,IAAIC,2BAAW,EAAE,IAAIJ,sBAAsB,EAAE;IAC3CD,KAAK,CAACM,eAAe,EAAE,CAAA;IACvBN,KAAK,CAACO,cAAc,EAAE,CAAA;AACxB,GAAA;AACF,EAAC;AAEKC,MAAAA,MAAM,GAAGA,CAAC;EACdC,QAAQ;EACRC,SAAS;AACTC,EAAAA,mBAAmB,GAAG,KAAK;EAC3BC,eAAe;AACfC,EAAAA,kBAAkB,GAAG,KAAK;AAC1BC,EAAAA,iBAAiB,GAAG,KAAK;AACzBC,EAAAA,IAAI,GAAG,KAAK;AACZC,EAAAA,UAAU,GAAG,KAAK;AAClBC,EAAAA,WAAW,GAAG,KAAK;EACnBC,OAAO;AACPC,EAAAA,QAAQ,EAAEC,YAAAA;AAAY,CACV,KAAI;EAChB,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC,CAAA;AACvD,EAAA,MAAMC,eAAe,GAAGC,YAAM,CAAiB,IAAI,CAAC,CAAA;EAEpD,MAAMC,YAAY,GAAI1B,KAAiC,IAAI;AACzD,IAAA,IAAIA,KAAK,CAACE,MAAM,KAAKsB,eAAe,CAACG,OAAO,EAAE;MAC5CT,OAAO,GAAGlB,KAAK,CAAC,CAAA;AAClB,KAAA;GACD,CAAA;EAED,MAAM4B,WAAW,GAAI5B,KAAiC,IAAI;AACxD,IAAA,IAAIW,mBAAmB,IAAI,CAACO,OAAO,EAAE;AACnC,MAAA,OAAA;AACF,KAAA;IAEAQ,YAAY,CAAC1B,KAAK,CAAC,CAAA;GACpB,CAAA;AAED,EAAA,MAAM6B,aAAa,GAAGC,iBAAW,CAC9B9B,KAAoB,IAAI;AACvB,IAAA,IAAIA,KAAK,CAAC+B,GAAG,KAAK,QAAQ,EAAE;AAC1B,MAAA,OAAA;AACF,KAAA;IACA/B,KAAK,CAACM,eAAe,EAAE,CAAA;AAEvB,IAAA,IAAIY,OAAO,IAAIM,eAAe,CAACG,OAAO,IAAI9B,aAAa,CAACmC,KAAK,CAACR,eAAe,CAACG,OAAO,CAAC,EAAE;MACtFT,OAAO,CAAClB,KAAK,CAAC,CAAA;AAChB,KAAA;AACF,GAAC,EACD,CAACkB,OAAO,CAAC,CACV,CAAA;EAED,MAAMe,OAAO,GAAGA,MAAK;IACnBX,eAAe,CAAC,IAAI,CAAC,CAAA;IAErB,IAAIE,eAAe,CAACG,OAAO,EAAE;AAC3B9B,MAAAA,aAAa,CAACqC,GAAG,CAACV,eAAe,CAACG,OAAO,CAAC,CAAA;AAC5C,KAAA;GACD,CAAA;EACD,MAAMR,QAAQ,GAAGA,MAAK;IACpBG,eAAe,CAAC,KAAK,CAAC,CAAA;IAEtB,IAAIE,eAAe,CAACG,OAAO,EAAE;AAC3B9B,MAAAA,aAAa,CAACsC,MAAM,CAACX,eAAe,CAACG,OAAO,CAAC,CAAA;AAC/C,KAAA;AAEAP,IAAAA,YAAY,IAAI,CAAA;GACjB,CAAA;AAEDgB,EAAAA,eAAS,CAAC,MAAK;AACb,IAAA,MAAMC,kBAAkB,GAAGb,eAAe,CAACG,OAAO,CAAA;AAElD,IAAA,IAAIZ,IAAI,EAAE;AACRuB,MAAAA,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAEV,aAAa,CAAC,CAAA;AACnDQ,MAAAA,kBAAkB,EAAEE,gBAAgB,CAAC,WAAW,EAAExC,eAAe,EAAE;AAAEyC,QAAAA,OAAO,EAAE,IAAA;AAAI,OAAE,CAAC,CAAA;AACvF,KAAA;AACA,IAAA,OAAO,MAAK;AACVF,MAAAA,QAAQ,CAACG,mBAAmB,CAAC,SAAS,EAAEZ,aAAa,CAAC,CAAA;AAEtDQ,MAAAA,kBAAkB,EAAEI,mBAAmB,CAAC,WAAW,EAAE1C,eAAe,CAAC,CAAA;KACtE,CAAA;AACH,GAAC,EAAE,CAAC8B,aAAa,EAAEd,IAAI,CAAC,CAAC,CAAA;EAEzB,oBACE2B,cAAA,CAACC,aAAa,EAAA;AAAC5B,IAAAA,IAAI,EAAEA,IAAK;AAACM,IAAAA,YAAY,EAAEA,YAAa;IAAAZ,QAAA,eACpDiC,cAAA,CAACE,kCAAa,EAAA;AACZC,MAAAA,OAAO,EAAErB,eAAgB;AACzBsB,MAAAA,EAAE,EAAE/B,IAAK;MACTgC,MAAM,EAAA,IAAA;AACN;AAAA;AACAC,MAAAA,OAAO,EAAE;AAAEC,QAAAA,KAAK,EAAE,CAAC;AAAEC,QAAAA,IAAI,EAAEtD,cAAAA;OAAiB;AAC5CuD,MAAAA,UAAU,EAAE;QACVF,KAAK,EAAEG,SAAI,CAAC;AAAE,UAAA,oBAAoB,EAAEvC,kBAAAA;SAAoB,CAAC;AACzDwC,QAAAA,SAAS,EAAED,SAAI,CAAC,oBAAoB,EAAE;AACpC,UAAA,oBAAoB,EAAEvC,kBAAAA;SACvB,CAAC;AACFqC,QAAAA,IAAI,EAAEE,SAAI,CAAC,cAAc,EAAE;AAAE,UAAA,mBAAmB,EAAEtC,iBAAAA;SAAmB,CAAA;OACrE;MACFwC,aAAa,EAAA,IAAA;AACbrB,MAAAA,OAAO,EAAEA,OAAQ;AACjBd,MAAAA,QAAQ,EAAEA,QAAS;MAAAV,QAAA,eAEnBiC,cAAA,CAACa,oBAAoB,EAAA;QAACC,UAAU,EAAE,CAACvC,WAAY;QAAAR,QAAA,eAC7CiC,cAAA,CAACe,aAAa,EAAA;AAAAhD,UAAAA,QAAA,eACZiC,cAAA,CAAA,KAAA,EAAA;AACEgB,YAAAA,GAAG,EAAElC,eAAgB;AACrBd,YAAAA,SAAS,EAAE0C,SAAI,CACb,QAAQ,EACR;AAAE,cAAA,oBAAoB,EAAEpC,UAAU;AAAE,cAAA,qBAAqB,EAAEC,WAAAA;aAAa,EACxEP,SAAS,CACT;AACFiD,YAAAA,IAAI,EAAC,cAAc;AACnBC,YAAAA,OAAO,EAAEhC,WAAY;AAAAnB,YAAAA,QAAA,eAErBiC,cAAA,CAAA,KAAA,EAAA;cACEhC,SAAS,EAAE0C,SAAI,CACb,2BAA2B,EAC3BxC,eAAe,IAAI,IAAI,IAAI,CACzB,+BAA+B,EAC/B;gBACE,mBAAmB,EAAEA,eAAe,KAAK,KAAK;gBAC9C,oBAAoB,EAAEA,eAAe,KAAK,QAAQ;gBAClD,iBAAiB,EAAEA,eAAe,KAAK,QAAA;AACxC,eAAA,CACF,CACD;AAAAH,cAAAA,QAAA,EAEDA,QAAAA;aACE,CAAA;WACF,CAAA;SACQ,CAAA;OACK,CAAA;KACT,CAAA;AACjB,GAAe,CAAC,CAAA;AAEpB,EAAC;AAED,MAAMkC,aAAa,GAIdA,CAAC;EAAE5B,IAAI;EAAEM,YAAY;AAAEZ,EAAAA,QAAAA;AAAU,CAAA,KAAI;EACxC,MAAM;IAAEoD,UAAU;AAAEC,IAAAA,KAAAA;GAAO,GAAGC,0BAAQ,EAAE,CAAA;AAExC,EAAA,OAAOhD,IAAI,IAAIM,YAAY,gBACzBqB,cAAA,CAACsB,+BAAa,EAAA;AACZF,IAAAA,KAAK,EAAC,UAAU;AAChBD,IAAAA,UAAU,EAAEC,KAAK,KAAK,UAAU,GAAGD,UAAU,GAAG,OAAQ;IACxDI,iBAAiB,EAAA,IAAA;AAAAxD,IAAAA,QAAA,EAEhBA,QAAAA;AAAQ,GACI,CAAC,gBAEhBiC,cAAA,CAAAwB,mBAAA,EAAA;AAAAzD,IAAAA,QAAA,EAAGA,QAAAA;AAAQ,GAAC,CACb,CAAA;AACH,CAAC,CAAA;AAEM,MAAM8C,oBAAoB,GAAGA,CAAC;EACnC9C,QAAQ;AACR+C,EAAAA,UAAAA;AAID,CAAA,KAAI;AACHpB,EAAAA,eAAS,CAAC,MAAK;AACb,IAAA,IAAIoB,UAAU,EAAE;AACdW,MAAAA,8BAAgB,EAAE,CAAA;AACpB,KAAA;AAEA,IAAA,OAAO,MAAK;AACV,MAAA,IAAIX,UAAU,EAAE;AACdY,QAAAA,iCAAmB,EAAE,CAAA;AACvB,OAAA;KACD,CAAA;AACH,GAAC,EAAE,CAACZ,UAAU,CAAC,CAAC,CAAA;AAEhB,EAAA,OAAO/C,QAAQ,CAAA;AACjB,EAAC;AAKD,eAAe4D,cAAc,CAAC7D,MAAM,CAAC;;;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dimmer.mjs","sources":["../../src/dimmer/Dimmer.tsx"],"sourcesContent":["import { ThemeProvider, useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { MouseEvent, ReactNode, useCallback, useEffect, useRef, useState } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport {\n addNoScrollClass,\n CommonProps,\n PositionBottom,\n PositionCenter,\n PositionTop,\n removeNoScrollClass,\n} from '../common';\nimport { isIosDevice } from '../common/deviceDetection';\nimport FocusBoundary from '../common/focusBoundary';\nimport withNextPortal from '../withNextPortal/withNextPortal';\n\nimport DimmerManager from './dimmerManager';\n\nexport const EXIT_ANIMATION = 350;\n\nconst dimmerManager = new DimmerManager();\n\nexport type DimmerProps = CommonProps & {\n children?: ReactNode;\n disableClickToClose?: boolean;\n contentPosition?: PositionTop | PositionCenter | PositionBottom;\n fadeContentOnEnter?: boolean;\n fadeContentOnExit?: boolean;\n open?: boolean;\n scrollable?: boolean;\n transparent?: boolean;\n onClose?: (event: KeyboardEvent | MouseEvent) => void;\n onExited?: () => void;\n};\n\nexport const handleTouchMove = (event: Event) => {\n const isTouchedElementDimmer = (event.target as HTMLDivElement).classList.contains('dimmer');\n\n // disable scroll on iOS devices for Dimmer area\n // this is because of bug in WebKit https://bugs.webkit.org/show_bug.cgi?id=220908\n // note: scrolling still works for children(s) as expected\n if (isIosDevice() && isTouchedElementDimmer) {\n event.stopPropagation();\n event.preventDefault();\n }\n};\n\nconst Dimmer = ({\n children,\n className,\n disableClickToClose = false,\n contentPosition,\n fadeContentOnEnter = false,\n fadeContentOnExit = false,\n open = false,\n scrollable = false,\n transparent = false,\n onClose,\n onExited: handleExited,\n}: DimmerProps) => {\n const [hasNotExited, setHasNotExited] = useState(false);\n const dimmerReference = useRef<HTMLDivElement>(null);\n\n const closeOnClick = (event: MouseEvent<HTMLDivElement>) => {\n if (event.target === dimmerReference.current) {\n onClose?.(event);\n }\n };\n\n const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n if (disableClickToClose || !onClose) {\n return;\n }\n\n closeOnClick(event);\n };\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key !== 'Escape') {\n return;\n }\n event.stopPropagation();\n\n if (onClose && dimmerReference.current && dimmerManager.isTop(dimmerReference.current)) {\n onClose(event);\n }\n },\n [onClose],\n );\n\n const onEnter = () => {\n setHasNotExited(true);\n\n if (dimmerReference.current) {\n dimmerManager.add(dimmerReference.current);\n }\n };\n const onExited = () => {\n setHasNotExited(false);\n\n if (dimmerReference.current) {\n dimmerManager.remove(dimmerReference.current);\n }\n\n handleExited?.();\n };\n\n useEffect(() => {\n const localReferenceCopy = dimmerReference.current;\n\n if (open) {\n document.addEventListener('keydown', handleKeyDown);\n localReferenceCopy?.addEventListener('touchmove', handleTouchMove, { passive: true });\n }\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n\n localReferenceCopy?.removeEventListener('touchmove', handleTouchMove);\n };\n }, [handleKeyDown, open]);\n\n return (\n <DimmerWrapper open={open} hasNotExited={hasNotExited}>\n <CSSTransition\n nodeRef={dimmerReference}\n in={open}\n appear\n // Wait for animation to finish before unmount.\n timeout={{ enter: 0, exit: EXIT_ANIMATION }}\n classNames={{\n enter: clsx({ 'dimmer--enter-fade': fadeContentOnEnter }),\n enterDone: clsx('dimmer--enter-done', {\n 'dimmer--enter-fade': fadeContentOnEnter,\n }),\n exit: clsx('dimmer--exit', { 'dimmer--exit-fade': fadeContentOnExit }),\n }}\n unmountOnExit\n onEnter={onEnter}\n onExited={onExited}\n >\n <DimmerContentWrapper scrollBody={!transparent}>\n <FocusBoundary>\n <div\n ref={dimmerReference}\n className={clsx(\n 'dimmer',\n { 'dimmer--scrollable': scrollable, 'dimmer--transparent': transparent },\n className,\n )}\n role=\"presentation\"\n onClick={handleClick}\n >\n <div\n className={clsx(\n 'dimmer-content-positioner',\n contentPosition != null && [\n 'd-flex justify-content-center',\n {\n 'align-items-start': contentPosition === 'top',\n 'align-items-center': contentPosition === 'center',\n 'align-items-end': contentPosition === 'bottom',\n },\n ],\n )}\n >\n {children}\n </div>\n </div>\n </FocusBoundary>\n </DimmerContentWrapper>\n </CSSTransition>\n </DimmerWrapper>\n );\n};\n\nconst DimmerWrapper: React.ComponentType<{\n open: boolean;\n hasNotExited: boolean;\n children: React.ReactNode;\n}> = ({ open, hasNotExited, children }) => {\n const { screenMode, theme } = useTheme();\n\n return open || hasNotExited ? (\n <ThemeProvider\n theme=\"personal\"\n screenMode={theme === 'personal' ? screenMode : 'light'}\n isNotRootProvider\n >\n {children}\n </ThemeProvider>\n ) : (\n <>{children}</>\n );\n};\n\nexport const DimmerContentWrapper = ({\n children,\n scrollBody,\n}: {\n children: React.ReactElement;\n scrollBody: boolean;\n}) => {\n useEffect(() => {\n if (scrollBody) {\n addNoScrollClass();\n }\n\n return () => {\n if (scrollBody) {\n removeNoScrollClass();\n }\n };\n }, [scrollBody]);\n\n return children;\n};\n\n// Export without the Portal for tests only\nexport { Dimmer };\n\nexport default withNextPortal(Dimmer);\n"],"names":["EXIT_ANIMATION","dimmerManager","DimmerManager","handleTouchMove","event","isTouchedElementDimmer","target","classList","contains","isIosDevice","stopPropagation","preventDefault","Dimmer","children","className","disableClickToClose","contentPosition","fadeContentOnEnter","fadeContentOnExit","open","scrollable","transparent","onClose","onExited","handleExited","hasNotExited","setHasNotExited","useState","dimmerReference","useRef","closeOnClick","current","handleClick","handleKeyDown","useCallback","key","isTop","onEnter","add","remove","useEffect","localReferenceCopy","document","addEventListener","passive","removeEventListener","_jsx","DimmerWrapper","CSSTransition","nodeRef","in","appear","timeout","enter","exit","classNames","clsx","enterDone","unmountOnExit","DimmerContentWrapper","scrollBody","FocusBoundary","ref","role","onClick","screenMode","theme","useTheme","ThemeProvider","isNotRootProvider","_Fragment","addNoScrollClass","removeNoScrollClass","withNextPortal"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAMA,cAAc,GAAG,IAAG;AAEjC,MAAMC,aAAa,GAAG,IAAIC,aAAa,EAAE,CAAA;AAe5BC,MAAAA,eAAe,GAAIC,KAAY,IAAI;EAC9C,MAAMC,sBAAsB,GAAID,KAAK,CAACE,MAAyB,CAACC,SAAS,CAACC,QAAQ,CAAC,QAAQ,CAAC,CAAA;AAE5F;AACA;AACA;AACA,EAAA,IAAIC,WAAW,EAAE,IAAIJ,sBAAsB,EAAE;IAC3CD,KAAK,CAACM,eAAe,EAAE,CAAA;IACvBN,KAAK,CAACO,cAAc,EAAE,CAAA;AACxB,GAAA;AACF,EAAC;AAEKC,MAAAA,MAAM,GAAGA,CAAC;EACdC,QAAQ;EACRC,SAAS;AACTC,EAAAA,mBAAmB,GAAG,KAAK;EAC3BC,eAAe;AACfC,EAAAA,kBAAkB,GAAG,KAAK;AAC1BC,EAAAA,iBAAiB,GAAG,KAAK;AACzBC,EAAAA,IAAI,GAAG,KAAK;AACZC,EAAAA,UAAU,GAAG,KAAK;AAClBC,EAAAA,WAAW,GAAG,KAAK;EACnBC,OAAO;AACPC,EAAAA,QAAQ,EAAEC,YAAAA;AAAY,CACV,KAAI;EAChB,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC,CAAA;AACvD,EAAA,MAAMC,eAAe,GAAGC,MAAM,CAAiB,IAAI,CAAC,CAAA;EAEpD,MAAMC,YAAY,GAAI1B,KAAiC,IAAI;AACzD,IAAA,IAAIA,KAAK,CAACE,MAAM,KAAKsB,eAAe,CAACG,OAAO,EAAE;MAC5CT,OAAO,GAAGlB,KAAK,CAAC,CAAA;AAClB,KAAA;GACD,CAAA;EAED,MAAM4B,WAAW,GAAI5B,KAAiC,IAAI;AACxD,IAAA,IAAIW,mBAAmB,IAAI,CAACO,OAAO,EAAE;AACnC,MAAA,OAAA;AACF,KAAA;IAEAQ,YAAY,CAAC1B,KAAK,CAAC,CAAA;GACpB,CAAA;AAED,EAAA,MAAM6B,aAAa,GAAGC,WAAW,CAC9B9B,KAAoB,IAAI;AACvB,IAAA,IAAIA,KAAK,CAAC+B,GAAG,KAAK,QAAQ,EAAE;AAC1B,MAAA,OAAA;AACF,KAAA;IACA/B,KAAK,CAACM,eAAe,EAAE,CAAA;AAEvB,IAAA,IAAIY,OAAO,IAAIM,eAAe,CAACG,OAAO,IAAI9B,aAAa,CAACmC,KAAK,CAACR,eAAe,CAACG,OAAO,CAAC,EAAE;MACtFT,OAAO,CAAClB,KAAK,CAAC,CAAA;AAChB,KAAA;AACF,GAAC,EACD,CAACkB,OAAO,CAAC,CACV,CAAA;EAED,MAAMe,OAAO,GAAGA,MAAK;IACnBX,eAAe,CAAC,IAAI,CAAC,CAAA;IAErB,IAAIE,eAAe,CAACG,OAAO,EAAE;AAC3B9B,MAAAA,aAAa,CAACqC,GAAG,CAACV,eAAe,CAACG,OAAO,CAAC,CAAA;AAC5C,KAAA;GACD,CAAA;EACD,MAAMR,QAAQ,GAAGA,MAAK;IACpBG,eAAe,CAAC,KAAK,CAAC,CAAA;IAEtB,IAAIE,eAAe,CAACG,OAAO,EAAE;AAC3B9B,MAAAA,aAAa,CAACsC,MAAM,CAACX,eAAe,CAACG,OAAO,CAAC,CAAA;AAC/C,KAAA;AAEAP,IAAAA,YAAY,IAAI,CAAA;GACjB,CAAA;AAEDgB,EAAAA,SAAS,CAAC,MAAK;AACb,IAAA,MAAMC,kBAAkB,GAAGb,eAAe,CAACG,OAAO,CAAA;AAElD,IAAA,IAAIZ,IAAI,EAAE;AACRuB,MAAAA,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAEV,aAAa,CAAC,CAAA;AACnDQ,MAAAA,kBAAkB,EAAEE,gBAAgB,CAAC,WAAW,EAAExC,eAAe,EAAE;AAAEyC,QAAAA,OAAO,EAAE,IAAA;AAAI,OAAE,CAAC,CAAA;AACvF,KAAA;AACA,IAAA,OAAO,MAAK;AACVF,MAAAA,QAAQ,CAACG,mBAAmB,CAAC,SAAS,EAAEZ,aAAa,CAAC,CAAA;AAEtDQ,MAAAA,kBAAkB,EAAEI,mBAAmB,CAAC,WAAW,EAAE1C,eAAe,CAAC,CAAA;KACtE,CAAA;AACH,GAAC,EAAE,CAAC8B,aAAa,EAAEd,IAAI,CAAC,CAAC,CAAA;EAEzB,oBACE2B,GAAA,CAACC,aAAa,EAAA;AAAC5B,IAAAA,IAAI,EAAEA,IAAK;AAACM,IAAAA,YAAY,EAAEA,YAAa;IAAAZ,QAAA,eACpDiC,GAAA,CAACE,aAAa,EAAA;AACZC,MAAAA,OAAO,EAAErB,eAAgB;AACzBsB,MAAAA,EAAE,EAAE/B,IAAK;MACTgC,MAAM,EAAA,IAAA;AACN;AAAA;AACAC,MAAAA,OAAO,EAAE;AAAEC,QAAAA,KAAK,EAAE,CAAC;AAAEC,QAAAA,IAAI,EAAEtD,cAAAA;OAAiB;AAC5CuD,MAAAA,UAAU,EAAE;QACVF,KAAK,EAAEG,IAAI,CAAC;AAAE,UAAA,oBAAoB,EAAEvC,kBAAAA;SAAoB,CAAC;AACzDwC,QAAAA,SAAS,EAAED,IAAI,CAAC,oBAAoB,EAAE;AACpC,UAAA,oBAAoB,EAAEvC,kBAAAA;SACvB,CAAC;AACFqC,QAAAA,IAAI,EAAEE,IAAI,CAAC,cAAc,EAAE;AAAE,UAAA,mBAAmB,EAAEtC,iBAAAA;SAAmB,CAAA;OACrE;MACFwC,aAAa,EAAA,IAAA;AACbrB,MAAAA,OAAO,EAAEA,OAAQ;AACjBd,MAAAA,QAAQ,EAAEA,QAAS;MAAAV,QAAA,eAEnBiC,GAAA,CAACa,oBAAoB,EAAA;QAACC,UAAU,EAAE,CAACvC,WAAY;QAAAR,QAAA,eAC7CiC,GAAA,CAACe,aAAa,EAAA;AAAAhD,UAAAA,QAAA,eACZiC,GAAA,CAAA,KAAA,EAAA;AACEgB,YAAAA,GAAG,EAAElC,eAAgB;AACrBd,YAAAA,SAAS,EAAE0C,IAAI,CACb,QAAQ,EACR;AAAE,cAAA,oBAAoB,EAAEpC,UAAU;AAAE,cAAA,qBAAqB,EAAEC,WAAAA;aAAa,EACxEP,SAAS,CACT;AACFiD,YAAAA,IAAI,EAAC,cAAc;AACnBC,YAAAA,OAAO,EAAEhC,WAAY;AAAAnB,YAAAA,QAAA,eAErBiC,GAAA,CAAA,KAAA,EAAA;cACEhC,SAAS,EAAE0C,IAAI,CACb,2BAA2B,EAC3BxC,eAAe,IAAI,IAAI,IAAI,CACzB,+BAA+B,EAC/B;gBACE,mBAAmB,EAAEA,eAAe,KAAK,KAAK;gBAC9C,oBAAoB,EAAEA,eAAe,KAAK,QAAQ;gBAClD,iBAAiB,EAAEA,eAAe,KAAK,QAAA;AACxC,eAAA,CACF,CACD;AAAAH,cAAAA,QAAA,EAEDA,QAAAA;aACE,CAAA;WACF,CAAA;SACQ,CAAA;OACK,CAAA;KACT,CAAA;AACjB,GAAe,CAAC,CAAA;AAEpB,EAAC;AAED,MAAMkC,aAAa,GAIdA,CAAC;EAAE5B,IAAI;EAAEM,YAAY;AAAEZ,EAAAA,QAAAA;AAAU,CAAA,KAAI;EACxC,MAAM;IAAEoD,UAAU;AAAEC,IAAAA,KAAAA;GAAO,GAAGC,QAAQ,EAAE,CAAA;AAExC,EAAA,OAAOhD,IAAI,IAAIM,YAAY,gBACzBqB,GAAA,CAACsB,aAAa,EAAA;AACZF,IAAAA,KAAK,EAAC,UAAU;AAChBD,IAAAA,UAAU,EAAEC,KAAK,KAAK,UAAU,GAAGD,UAAU,GAAG,OAAQ;IACxDI,iBAAiB,EAAA,IAAA;AAAAxD,IAAAA,QAAA,EAEhBA,QAAAA;AAAQ,GACI,CAAC,gBAEhBiC,GAAA,CAAAwB,QAAA,EAAA;AAAAzD,IAAAA,QAAA,EAAGA,QAAAA;AAAQ,GAAC,CACb,CAAA;AACH,CAAC,CAAA;AAEM,MAAM8C,oBAAoB,GAAGA,CAAC;EACnC9C,QAAQ;AACR+C,EAAAA,UAAAA;AAID,CAAA,KAAI;AACHpB,EAAAA,SAAS,CAAC,MAAK;AACb,IAAA,IAAIoB,UAAU,EAAE;AACdW,MAAAA,gBAAgB,EAAE,CAAA;AACpB,KAAA;AAEA,IAAA,OAAO,MAAK;AACV,MAAA,IAAIX,UAAU,EAAE;AACdY,QAAAA,mBAAmB,EAAE,CAAA;AACvB,OAAA;KACD,CAAA;AACH,GAAC,EAAE,CAACZ,UAAU,CAAC,CAAC,CAAA;AAEhB,EAAA,OAAO/C,QAAQ,CAAA;AACjB,EAAC;AAKD,eAAe4D,qBAAc,CAAC7D,MAAM,CAAC;;;;"}
|
|
1
|
+
{"version":3,"file":"Dimmer.mjs","sources":["../../src/dimmer/Dimmer.tsx"],"sourcesContent":["import { ThemeProvider, useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\nimport { MouseEvent, ReactNode, useCallback, useEffect, useRef, useState } from 'react';\nimport { CSSTransition } from 'react-transition-group';\n\nimport {\n addNoScrollClass,\n removeNoScrollClass,\n type CommonProps,\n type PositionBottom,\n type PositionCenter,\n type PositionTop,\n} from '../common';\nimport { isIosDevice } from '../common/deviceDetection';\nimport FocusBoundary from '../common/focusBoundary';\nimport withNextPortal from '../withNextPortal/withNextPortal';\n\nimport DimmerManager from './dimmerManager';\n\nexport const EXIT_ANIMATION = 350;\n\nconst dimmerManager = new DimmerManager();\n\nexport type DimmerProps = CommonProps & {\n children?: ReactNode;\n disableClickToClose?: boolean;\n contentPosition?: PositionTop | PositionCenter | PositionBottom;\n fadeContentOnEnter?: boolean;\n fadeContentOnExit?: boolean;\n open?: boolean;\n scrollable?: boolean;\n transparent?: boolean;\n onClose?: (event: KeyboardEvent | MouseEvent) => void;\n onExited?: () => void;\n};\n\nexport const handleTouchMove = (event: Event) => {\n const isTouchedElementDimmer = (event.target as HTMLDivElement).classList.contains('dimmer');\n\n // disable scroll on iOS devices for Dimmer area\n // this is because of bug in WebKit https://bugs.webkit.org/show_bug.cgi?id=220908\n // note: scrolling still works for children(s) as expected\n if (isIosDevice() && isTouchedElementDimmer) {\n event.stopPropagation();\n event.preventDefault();\n }\n};\n\nconst Dimmer = ({\n children,\n className,\n disableClickToClose = false,\n contentPosition,\n fadeContentOnEnter = false,\n fadeContentOnExit = false,\n open = false,\n scrollable = false,\n transparent = false,\n onClose,\n onExited: handleExited,\n}: DimmerProps) => {\n const [hasNotExited, setHasNotExited] = useState(false);\n const dimmerReference = useRef<HTMLDivElement>(null);\n\n const closeOnClick = (event: MouseEvent<HTMLDivElement>) => {\n if (event.target === dimmerReference.current) {\n onClose?.(event);\n }\n };\n\n const handleClick = (event: MouseEvent<HTMLDivElement>) => {\n if (disableClickToClose || !onClose) {\n return;\n }\n\n closeOnClick(event);\n };\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key !== 'Escape') {\n return;\n }\n event.stopPropagation();\n\n if (onClose && dimmerReference.current && dimmerManager.isTop(dimmerReference.current)) {\n onClose(event);\n }\n },\n [onClose],\n );\n\n const onEnter = () => {\n setHasNotExited(true);\n\n if (dimmerReference.current) {\n dimmerManager.add(dimmerReference.current);\n }\n };\n const onExited = () => {\n setHasNotExited(false);\n\n if (dimmerReference.current) {\n dimmerManager.remove(dimmerReference.current);\n }\n\n handleExited?.();\n };\n\n useEffect(() => {\n const localReferenceCopy = dimmerReference.current;\n\n if (open) {\n document.addEventListener('keydown', handleKeyDown);\n localReferenceCopy?.addEventListener('touchmove', handleTouchMove, { passive: true });\n }\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n\n localReferenceCopy?.removeEventListener('touchmove', handleTouchMove);\n };\n }, [handleKeyDown, open]);\n\n return (\n <DimmerWrapper open={open} hasNotExited={hasNotExited}>\n <CSSTransition\n nodeRef={dimmerReference}\n in={open}\n appear\n // Wait for animation to finish before unmount.\n timeout={{ enter: 0, exit: EXIT_ANIMATION }}\n classNames={{\n enter: clsx({ 'dimmer--enter-fade': fadeContentOnEnter }),\n enterDone: clsx('dimmer--enter-done', {\n 'dimmer--enter-fade': fadeContentOnEnter,\n }),\n exit: clsx('dimmer--exit', { 'dimmer--exit-fade': fadeContentOnExit }),\n }}\n unmountOnExit\n onEnter={onEnter}\n onExited={onExited}\n >\n <DimmerContentWrapper scrollBody={!transparent}>\n <FocusBoundary>\n <div\n ref={dimmerReference}\n className={clsx(\n 'dimmer',\n { 'dimmer--scrollable': scrollable, 'dimmer--transparent': transparent },\n className,\n )}\n role=\"presentation\"\n onClick={handleClick}\n >\n <div\n className={clsx(\n 'dimmer-content-positioner',\n contentPosition != null && [\n 'd-flex justify-content-center',\n {\n 'align-items-start': contentPosition === 'top',\n 'align-items-center': contentPosition === 'center',\n 'align-items-end': contentPosition === 'bottom',\n },\n ],\n )}\n >\n {children}\n </div>\n </div>\n </FocusBoundary>\n </DimmerContentWrapper>\n </CSSTransition>\n </DimmerWrapper>\n );\n};\n\nconst DimmerWrapper: React.ComponentType<{\n open: boolean;\n hasNotExited: boolean;\n children: React.ReactNode;\n}> = ({ open, hasNotExited, children }) => {\n const { screenMode, theme } = useTheme();\n\n return open || hasNotExited ? (\n <ThemeProvider\n theme=\"personal\"\n screenMode={theme === 'personal' ? screenMode : 'light'}\n isNotRootProvider\n >\n {children}\n </ThemeProvider>\n ) : (\n <>{children}</>\n );\n};\n\nexport const DimmerContentWrapper = ({\n children,\n scrollBody,\n}: {\n children: React.ReactElement;\n scrollBody: boolean;\n}) => {\n useEffect(() => {\n if (scrollBody) {\n addNoScrollClass();\n }\n\n return () => {\n if (scrollBody) {\n removeNoScrollClass();\n }\n };\n }, [scrollBody]);\n\n return children;\n};\n\n// Export without the Portal for tests only\nexport { Dimmer };\n\nexport default withNextPortal(Dimmer);\n"],"names":["EXIT_ANIMATION","dimmerManager","DimmerManager","handleTouchMove","event","isTouchedElementDimmer","target","classList","contains","isIosDevice","stopPropagation","preventDefault","Dimmer","children","className","disableClickToClose","contentPosition","fadeContentOnEnter","fadeContentOnExit","open","scrollable","transparent","onClose","onExited","handleExited","hasNotExited","setHasNotExited","useState","dimmerReference","useRef","closeOnClick","current","handleClick","handleKeyDown","useCallback","key","isTop","onEnter","add","remove","useEffect","localReferenceCopy","document","addEventListener","passive","removeEventListener","_jsx","DimmerWrapper","CSSTransition","nodeRef","in","appear","timeout","enter","exit","classNames","clsx","enterDone","unmountOnExit","DimmerContentWrapper","scrollBody","FocusBoundary","ref","role","onClick","screenMode","theme","useTheme","ThemeProvider","isNotRootProvider","_Fragment","addNoScrollClass","removeNoScrollClass","withNextPortal"],"mappings":"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"}
|
package/build/i18n/de.json
CHANGED
|
@@ -54,6 +54,7 @@
|
|
|
54
54
|
"neptune.UploadButton.allFileTypes": "Alle Dateiformate",
|
|
55
55
|
"neptune.UploadButton.dropFiles": "Datei zum Hochladen in dieses Feld ziehen",
|
|
56
56
|
"neptune.UploadButton.instructions": "{fileTypes}, kleiner als {size} MB",
|
|
57
|
+
"neptune.UploadButton.maximumFiles": "Maximal {maxFiles} Dateien.",
|
|
57
58
|
"neptune.UploadButton.uploadFile": "Datei hochladen",
|
|
58
59
|
"neptune.UploadButton.uploadFiles": "Dateien hochladen",
|
|
59
60
|
"neptune.UploadInput.deleteModalBody": "Wenn du diese Datei entfernst, wird sie aus unserem System gelöscht werden.",
|
package/build/i18n/de.json.js
CHANGED
|
@@ -56,6 +56,7 @@ var de = {
|
|
|
56
56
|
"neptune.UploadButton.allFileTypes": "Alle Dateiformate",
|
|
57
57
|
"neptune.UploadButton.dropFiles": "Datei zum Hochladen in dieses Feld ziehen",
|
|
58
58
|
"neptune.UploadButton.instructions": "{fileTypes}, kleiner als {size} MB",
|
|
59
|
+
"neptune.UploadButton.maximumFiles": "Maximal {maxFiles} Dateien.",
|
|
59
60
|
"neptune.UploadButton.uploadFile": "Datei hochladen",
|
|
60
61
|
"neptune.UploadButton.uploadFiles": "Dateien hochladen",
|
|
61
62
|
"neptune.UploadInput.deleteModalBody": "Wenn du diese Datei entfernst, wird sie aus unserem System gelöscht werden.",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"de.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"de.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/build/i18n/de.json.mjs
CHANGED
|
@@ -54,6 +54,7 @@ var de = {
|
|
|
54
54
|
"neptune.UploadButton.allFileTypes": "Alle Dateiformate",
|
|
55
55
|
"neptune.UploadButton.dropFiles": "Datei zum Hochladen in dieses Feld ziehen",
|
|
56
56
|
"neptune.UploadButton.instructions": "{fileTypes}, kleiner als {size} MB",
|
|
57
|
+
"neptune.UploadButton.maximumFiles": "Maximal {maxFiles} Dateien.",
|
|
57
58
|
"neptune.UploadButton.uploadFile": "Datei hochladen",
|
|
58
59
|
"neptune.UploadButton.uploadFiles": "Dateien hochladen",
|
|
59
60
|
"neptune.UploadInput.deleteModalBody": "Wenn du diese Datei entfernst, wird sie aus unserem System gelöscht werden.",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"de.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"de.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/build/i18n/en.json
CHANGED
|
@@ -54,6 +54,7 @@
|
|
|
54
54
|
"neptune.UploadButton.allFileTypes": "All file types",
|
|
55
55
|
"neptune.UploadButton.dropFiles": "Drop file to start upload",
|
|
56
56
|
"neptune.UploadButton.instructions": "{fileTypes}, less than {size}MB",
|
|
57
|
+
"neptune.UploadButton.maximumFiles": "Maximum {maxFiles} files.",
|
|
57
58
|
"neptune.UploadButton.uploadFile": "Upload file",
|
|
58
59
|
"neptune.UploadButton.uploadFiles": "Upload files",
|
|
59
60
|
"neptune.UploadInput.deleteModalBody": "Removing this file will delete it from our system.",
|
package/build/i18n/en.json.js
CHANGED
|
@@ -56,6 +56,7 @@ var en = {
|
|
|
56
56
|
"neptune.UploadButton.allFileTypes": "All file types",
|
|
57
57
|
"neptune.UploadButton.dropFiles": "Drop file to start upload",
|
|
58
58
|
"neptune.UploadButton.instructions": "{fileTypes}, less than {size}MB",
|
|
59
|
+
"neptune.UploadButton.maximumFiles": "Maximum {maxFiles} files.",
|
|
59
60
|
"neptune.UploadButton.uploadFile": "Upload file",
|
|
60
61
|
"neptune.UploadButton.uploadFiles": "Upload files",
|
|
61
62
|
"neptune.UploadInput.deleteModalBody": "Removing this file will delete it from our system.",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/build/i18n/en.json.mjs
CHANGED
|
@@ -54,6 +54,7 @@ var en = {
|
|
|
54
54
|
"neptune.UploadButton.allFileTypes": "All file types",
|
|
55
55
|
"neptune.UploadButton.dropFiles": "Drop file to start upload",
|
|
56
56
|
"neptune.UploadButton.instructions": "{fileTypes}, less than {size}MB",
|
|
57
|
+
"neptune.UploadButton.maximumFiles": "Maximum {maxFiles} files.",
|
|
57
58
|
"neptune.UploadButton.uploadFile": "Upload file",
|
|
58
59
|
"neptune.UploadButton.uploadFiles": "Upload files",
|
|
59
60
|
"neptune.UploadInput.deleteModalBody": "Removing this file will delete it from our system.",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"en.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"en.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/build/i18n/es.json
CHANGED
|
@@ -54,6 +54,7 @@
|
|
|
54
54
|
"neptune.UploadButton.allFileTypes": "Todos los tipos de archivos",
|
|
55
55
|
"neptune.UploadButton.dropFiles": "Arrastra un archivo para subirlo",
|
|
56
56
|
"neptune.UploadButton.instructions": "{fileTypes}, menor que {size}MB",
|
|
57
|
+
"neptune.UploadButton.maximumFiles": "Máximo {maxFiles} archivos.",
|
|
57
58
|
"neptune.UploadButton.uploadFile": "Subir archivo",
|
|
58
59
|
"neptune.UploadButton.uploadFiles": "Subir archivos",
|
|
59
60
|
"neptune.UploadInput.deleteModalBody": "La eliminación de este archivo lo borrará de nuestro sistema.",
|
package/build/i18n/es.json.js
CHANGED
|
@@ -56,6 +56,7 @@ var es = {
|
|
|
56
56
|
"neptune.UploadButton.allFileTypes": "Todos los tipos de archivos",
|
|
57
57
|
"neptune.UploadButton.dropFiles": "Arrastra un archivo para subirlo",
|
|
58
58
|
"neptune.UploadButton.instructions": "{fileTypes}, menor que {size}MB",
|
|
59
|
+
"neptune.UploadButton.maximumFiles": "Máximo {maxFiles} archivos.",
|
|
59
60
|
"neptune.UploadButton.uploadFile": "Subir archivo",
|
|
60
61
|
"neptune.UploadButton.uploadFiles": "Subir archivos",
|
|
61
62
|
"neptune.UploadInput.deleteModalBody": "La eliminación de este archivo lo borrará de nuestro sistema.",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"es.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"es.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/build/i18n/es.json.mjs
CHANGED
|
@@ -54,6 +54,7 @@ var es = {
|
|
|
54
54
|
"neptune.UploadButton.allFileTypes": "Todos los tipos de archivos",
|
|
55
55
|
"neptune.UploadButton.dropFiles": "Arrastra un archivo para subirlo",
|
|
56
56
|
"neptune.UploadButton.instructions": "{fileTypes}, menor que {size}MB",
|
|
57
|
+
"neptune.UploadButton.maximumFiles": "Máximo {maxFiles} archivos.",
|
|
57
58
|
"neptune.UploadButton.uploadFile": "Subir archivo",
|
|
58
59
|
"neptune.UploadButton.uploadFiles": "Subir archivos",
|
|
59
60
|
"neptune.UploadInput.deleteModalBody": "La eliminación de este archivo lo borrará de nuestro sistema.",
|