npm - @transferwise/components - Versions diffs - 46.87.2 → 46.88.1 - Mend

@transferwise/components 46.87.2 → 46.88.1

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 (122) hide show

package/build/avatarLayout/AvatarLayout.js +9 -2
package/build/avatarLayout/AvatarLayout.js.map +1 -1
package/build/avatarLayout/AvatarLayout.mjs +9 -2
package/build/avatarLayout/AvatarLayout.mjs.map +1 -1
package/build/button/Button.js +92 -79
package/build/button/Button.js.map +1 -1
package/build/button/Button.mjs +93 -80
package/build/button/Button.mjs.map +1 -1
package/build/button/Button.resolver.js +74 -0
package/build/button/Button.resolver.js.map +1 -0
package/build/button/Button.resolver.mjs +72 -0
package/build/button/Button.resolver.mjs.map +1 -0
package/build/button/LegacyButton.js +114 -0
package/build/button/LegacyButton.js.map +1 -0
package/build/button/LegacyButton.mjs +112 -0
package/build/button/LegacyButton.mjs.map +1 -0
package/build/circularButton/CircularButton.js.map +1 -1
package/build/circularButton/CircularButton.mjs.map +1 -1
package/build/criticalBanner/CriticalCommsBanner.js +2 -2
package/build/criticalBanner/CriticalCommsBanner.js.map +1 -1
package/build/criticalBanner/CriticalCommsBanner.mjs +1 -1
package/build/header/Header.js +2 -2
package/build/header/Header.js.map +1 -1
package/build/header/Header.mjs +1 -1
package/build/index.js +2 -2
package/build/index.mjs +1 -1
package/build/link/Link.js +8 -3
package/build/link/Link.js.map +1 -1
package/build/link/Link.mjs +8 -3
package/build/link/Link.mjs.map +1 -1
package/build/main.css +247 -0
package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.js +2 -4
package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.js.map +1 -1
package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.mjs +2 -4
package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.mjs.map +1 -1
package/build/primitives/PrimitiveButton/src/PrimitiveButton.js +3 -5
package/build/primitives/PrimitiveButton/src/PrimitiveButton.js.map +1 -1
package/build/primitives/PrimitiveButton/src/PrimitiveButton.mjs +3 -5
package/build/primitives/PrimitiveButton/src/PrimitiveButton.mjs.map +1 -1
package/build/select/Select.js +2 -2
package/build/select/Select.js.map +1 -1
package/build/select/Select.mjs +1 -1
package/build/styles/avatarLayout/AvatarLayout.css +11 -0
package/build/styles/button/Button.css +228 -15
package/build/styles/button/Button.vars.css +46 -0
package/build/styles/button/LegacyButton.css +23 -0
package/build/styles/main.css +247 -0
package/build/types/avatarLayout/AvatarLayout.d.ts.map +1 -1
package/build/types/button/Button.d.ts +4 -23
package/build/types/button/Button.d.ts.map +1 -1
package/build/types/button/Button.resolver.d.ts +11 -0
package/build/types/button/Button.resolver.d.ts.map +1 -0
package/build/types/button/Button.types.d.ts +70 -0
package/build/types/button/Button.types.d.ts.map +1 -0
package/build/types/button/LegacyButton.d.ts +44 -0
package/build/types/button/LegacyButton.d.ts.map +1 -0
package/build/types/button/index.d.ts +3 -2
package/build/types/button/index.d.ts.map +1 -1
package/build/types/circularButton/CircularButton.d.ts.map +1 -1
package/build/types/index.d.ts +1 -1
package/build/types/index.d.ts.map +1 -1
package/build/types/link/Link.d.ts +2 -2
package/build/types/link/Link.d.ts.map +1 -1
package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.d.ts.map +1 -1
package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.d.ts +6 -2
package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.d.ts.map +1 -1
package/build/types/primitives/PrimitiveButton/src/PrimitiveButton.d.ts.map +1 -1
package/build/types/test-utils/story-config.d.ts +1 -1
package/build/types/test-utils/story-config.d.ts.map +1 -1
package/build/upload/steps/completeStep/completeStep.js +2 -2
package/build/upload/steps/completeStep/completeStep.js.map +1 -1
package/build/upload/steps/completeStep/completeStep.mjs +1 -1
package/build/upload/steps/processingStep/processingStep.js +2 -2
package/build/upload/steps/processingStep/processingStep.js.map +1 -1
package/build/upload/steps/processingStep/processingStep.mjs +1 -1
package/build/uploadInput/UploadInput.js +3 -3
package/build/uploadInput/UploadInput.js.map +1 -1
package/build/uploadInput/UploadInput.mjs +1 -1
package/package.json +3 -3
package/src/alert/Alert.tests.story.tsx +1 -1
package/src/avatar/Avatar.story.tsx +1 -1
package/src/avatarLayout/AvatarLayout.css +11 -0
package/src/avatarLayout/AvatarLayout.less +18 -1
package/src/avatarLayout/AvatarLayout.tsx +10 -2
package/src/avatarWrapper/AvatarWrapper.story.tsx +1 -1
package/src/badge/Badge.story.tsx +1 -1
package/src/button/Button.accessibility.docs.mdx +103 -0
package/src/button/Button.css +228 -15
package/src/button/Button.less +242 -14
package/src/button/Button.resolver.tsx +73 -0
package/src/button/Button.spec.tsx +329 -213
package/src/button/Button.story.tsx +782 -134
package/src/button/Button.tests.story.tsx +27 -0
package/src/button/Button.tsx +109 -132
package/src/button/Button.types.ts +92 -0
package/src/button/Button.vars.css +46 -0
package/src/button/Button.vars.less +59 -0
package/src/button/LegacyButton.css +23 -0
package/src/button/LegacyButton.less +24 -0
package/src/button/LegacyButton.spec.tsx +147 -0
package/src/button/LegacyButton.story.tsx +228 -0
package/src/button/LegacyButton.tsx +177 -0
package/src/button/index.ts +6 -2
package/src/card/Card.story.tsx +6 -1
package/src/circularButton/CircularButton.tsx +1 -0
package/src/field/Field.story.tsx +1 -1
package/src/flowNavigation/__snapshots__/FlowNavigation.spec.js.snap +1 -2
package/src/index.ts +1 -1
package/src/inputs/SelectInput.story.tsx +1 -1
package/src/label/Label.story.tsx +1 -1
package/src/link/Link.tsx +15 -6
package/src/main.css +247 -0
package/src/main.less +1 -0
package/src/primitives/PrimitiveAnchor/src/PrimitiveAnchor.tsx +2 -8
package/src/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.ts +7 -2
package/src/primitives/PrimitiveAnchor/test/PrimitiveAnchor.spec.tsx +1 -3
package/src/primitives/PrimitiveButton/src/PrimitiveButton.tsx +4 -12
package/src/primitives/PrimitiveButton/test/PrimitiveButton.spec.tsx +16 -13
package/src/select/Select.story.tsx +4 -1
package/src/test-utils/Parameters.d.ts +9 -1
package/src/test-utils/story-config.ts +10 -1
package/src/button/__snapshots__/Button.spec.tsx.snap +0 -309

package/build/upload/steps/completeStep/completeStep.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"completeStep.js","sources":["../../../../src/upload/steps/completeStep/completeStep.tsx"],"sourcesContent":["import { Document as DocumentIcon } from '@transferwise/icons';\n\nimport { Typography } from '../../..';\nimport Body from '../../../body';\nimport Button from '../../../button';\nimport Title from '../../../title';\n\nexport interface CompleteStepProps {\n csButtonText: string;\n csSuccessText: string;\n fileName: string;\n isComplete: boolean;\n isImage: boolean;\n uploadedImage?: string;\n onClear: React.MouseEventHandler<HTMLButtonElement>;\n}\n\nexport default function CompleteStep({\n csButtonText,\n csSuccessText,\n fileName,\n isComplete,\n isImage,\n onClear,\n uploadedImage,\n}: CompleteStepProps) {\n return (\n <div className=\"droppable-complete-card droppable-card\" aria-hidden={!isComplete}>\n <div className=\"droppable-card-content\">\n <div\n className=\"droppable-card-content d-flex flex-column align-items-center\"\n aria-live=\"polite\"\n >\n {isImage && uploadedImage ? (\n <img src={uploadedImage} alt=\"OK\" className=\"thumbnail \" />\n ) : (\n <DocumentIcon />\n )}\n\n {fileName && (\n <Body as=\"p\" className=\"m-b-0\">\n {fileName}\n </Body>\n )}\n {csSuccessText && (\n <Title className=\"caption m-t-1\" type={Typography.TITLE_BODY}>\n {csSuccessText}\n </Title>\n )}\n </div>\n {csButtonText && (\n <Button className=\"m-t-1\" onClick={onClear}>\n {csButtonText}\n </Button>\n )}\n </div>\n </div>\n );\n}\n"],"names":["CompleteStep","csButtonText","csSuccessText","fileName","isComplete","isImage","onClear","uploadedImage","_jsx","className","children","_jsxs","src","alt","DocumentIcon","Body","as","Title","type","Typography","TITLE_BODY","Button","onClick"],"mappings":";;;;;;;;;AAiBc,SAAUA,YAAYA,CAAC;EACnCC,YAAY;EACZC,aAAa;EACbC,QAAQ;EACRC,UAAU;EACVC,OAAO;EACPC,OAAO;AACPC,EAAAA,aAAAA;AACkB,CAAA,EAAA;AAClB,EAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,wCAAwC;AAAC,IAAA,aAAA,EAAa,CAACL,UAAW;AAAAM,IAAAA,QAAA,eAC/EC,eAAA,CAAA,KAAA,EAAA;AAAKF,MAAAA,SAAS,EAAC,wBAAwB;AAAAC,MAAAA,QAAA,gBACrCC,eAAA,CAAA,KAAA,EAAA;AACEF,QAAAA,SAAS,EAAC,8DAA8D;AACxE,QAAA,WAAA,EAAU,QAAQ;AAAAC,QAAAA,QAAA,EAEjBL,CAAAA,OAAO,IAAIE,aAAa,gBACvBC,cAAA,CAAA,KAAA,EAAA;AAAKI,UAAAA,GAAG,EAAEL,aAAc;AAACM,UAAAA,GAAG,EAAC,IAAI;AAACJ,UAAAA,SAAS,EAAC,YAAA;AAAY,SAAA,CAAG,gBAE3DD,cAAA,CAACM,cAAY,EAAA,EAAA,CACd,EAEAX,QAAQ,iBACPK,cAAA,CAACO,IAAI,EAAA;AAACC,UAAAA,EAAE,EAAC,GAAG;AAACP,UAAAA,SAAS,EAAC,OAAO;AAAAC,UAAAA,QAAA,EAC3BP,QAAAA;AAAQ,SACL,CACP,EACAD,aAAa,iBACZM,cAAA,CAACS,KAAK,EAAA;AAACR,UAAAA,SAAS,EAAC,eAAe;UAACS,IAAI,EAAEC,qBAAU,CAACC,UAAW;AAAAV,UAAAA,QAAA,EAC1DR,aAAAA;AAAa,SACT,CACR,CAAA;AAAA,OACE,CACL,EAACD,YAAY,iBACXO,cAAA,CAACa,~~MAAM~~,EAAA;AAACZ,QAAAA,SAAS,EAAC,OAAO;AAACa,QAAAA,OAAO,EAAEhB,OAAQ;AAAAI,QAAAA,QAAA,EACxCT,YAAAA;AAAY,OACP,CACT,CAAA;KACE,CAAA;AACP,GAAK,CAAC,CAAA;AAEV;;;;"}
1	+ {"version":3,"file":"completeStep.js","sources":["../../../../src/upload/steps/completeStep/completeStep.tsx"],"sourcesContent":["import { Document as DocumentIcon } from '@transferwise/icons';\n\nimport { Typography } from '../../..';\nimport Body from '../../../body';\nimport Button from '../../../button';\nimport Title from '../../../title';\n\nexport interface CompleteStepProps {\n csButtonText: string;\n csSuccessText: string;\n fileName: string;\n isComplete: boolean;\n isImage: boolean;\n uploadedImage?: string;\n onClear: React.MouseEventHandler<HTMLButtonElement>;\n}\n\nexport default function CompleteStep({\n csButtonText,\n csSuccessText,\n fileName,\n isComplete,\n isImage,\n onClear,\n uploadedImage,\n}: CompleteStepProps) {\n return (\n <div className=\"droppable-complete-card droppable-card\" aria-hidden={!isComplete}>\n <div className=\"droppable-card-content\">\n <div\n className=\"droppable-card-content d-flex flex-column align-items-center\"\n aria-live=\"polite\"\n >\n {isImage && uploadedImage ? (\n <img src={uploadedImage} alt=\"OK\" className=\"thumbnail \" />\n ) : (\n <DocumentIcon />\n )}\n\n {fileName && (\n <Body as=\"p\" className=\"m-b-0\">\n {fileName}\n </Body>\n )}\n {csSuccessText && (\n <Title className=\"caption m-t-1\" type={Typography.TITLE_BODY}>\n {csSuccessText}\n </Title>\n )}\n </div>\n {csButtonText && (\n <Button className=\"m-t-1\" onClick={onClear}>\n {csButtonText}\n </Button>\n )}\n </div>\n </div>\n );\n}\n"],"names":["CompleteStep","csButtonText","csSuccessText","fileName","isComplete","isImage","onClear","uploadedImage","_jsx","className","children","_jsxs","src","alt","DocumentIcon","Body","as","Title","type","Typography","TITLE_BODY","Button","onClick"],"mappings":";;;;;;;;;AAiBc,SAAUA,YAAYA,CAAC;EACnCC,YAAY;EACZC,aAAa;EACbC,QAAQ;EACRC,UAAU;EACVC,OAAO;EACPC,OAAO;AACPC,EAAAA,aAAAA;AACkB,CAAA,EAAA;AAClB,EAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,wCAAwC;AAAC,IAAA,aAAA,EAAa,CAACL,UAAW;AAAAM,IAAAA,QAAA,eAC/EC,eAAA,CAAA,KAAA,EAAA;AAAKF,MAAAA,SAAS,EAAC,wBAAwB;AAAAC,MAAAA,QAAA,gBACrCC,eAAA,CAAA,KAAA,EAAA;AACEF,QAAAA,SAAS,EAAC,8DAA8D;AACxE,QAAA,WAAA,EAAU,QAAQ;AAAAC,QAAAA,QAAA,EAEjBL,CAAAA,OAAO,IAAIE,aAAa,gBACvBC,cAAA,CAAA,KAAA,EAAA;AAAKI,UAAAA,GAAG,EAAEL,aAAc;AAACM,UAAAA,GAAG,EAAC,IAAI;AAACJ,UAAAA,SAAS,EAAC,YAAA;AAAY,SAAA,CAAG,gBAE3DD,cAAA,CAACM,cAAY,EAAA,EAAA,CACd,EAEAX,QAAQ,iBACPK,cAAA,CAACO,IAAI,EAAA;AAACC,UAAAA,EAAE,EAAC,GAAG;AAACP,UAAAA,SAAS,EAAC,OAAO;AAAAC,UAAAA,QAAA,EAC3BP,QAAAA;AAAQ,SACL,CACP,EACAD,aAAa,iBACZM,cAAA,CAACS,KAAK,EAAA;AAACR,UAAAA,SAAS,EAAC,eAAe;UAACS,IAAI,EAAEC,qBAAU,CAACC,UAAW;AAAAV,UAAAA,QAAA,EAC1DR,aAAAA;AAAa,SACT,CACR,CAAA;AAAA,OACE,CACL,EAACD,YAAY,iBACXO,cAAA,CAACa,eAAM,EAAA;AAACZ,QAAAA,SAAS,EAAC,OAAO;AAACa,QAAAA,OAAO,EAAEhB,OAAQ;AAAAI,QAAAA,QAAA,EACxCT,YAAAA;AAAY,OACP,CACT,CAAA;KACE,CAAA;AACP,GAAK,CAAC,CAAA;AAEV;;;;"}

package/build/upload/steps/completeStep/completeStep.mjs CHANGED Viewed

@@ -1,6 +1,6 @@
 import { Document } from '@transferwise/icons';
 import Body from '../../../body/Body.mjs';
-import Button from '../../../button/Button.mjs';
+import Button from '../../../button/Button.resolver.mjs';
 import Title from '../../../title/Title.mjs';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Typography } from '../../../common/propsValues/typography.mjs';

package/build/upload/steps/processingStep/processingStep.js CHANGED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-var Button = require('../../../button/Button.js');
+var Button_resolver = require('../../../button/Button.resolver.js');
 require('../../../common/theme.js');
 require('../../../common/direction.js');
 require('../../../common/propsValues/control.js');
@@ -59,7 +59,7 @@ function ProcessingStep({
         type: typography.Typography.TITLE_BODY,
         "aria-live": "polite",
         children: psProcessingText
-      }), psButtonText && /*#__PURE__*/jsxRuntime.jsx(Button, {
+      }), psButtonText && /*#__PURE__*/jsxRuntime.jsx(Button_resolver, {
         disabled: psButtonDisabled,
         onClick: onClear,
         children: psButtonText

package/build/upload/steps/processingStep/processingStep.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"processingStep.js","sources":["../../../../src/upload/steps/processingStep/processingStep.tsx"],"sourcesContent":["import Button from '../../../button';\nimport { Status, Typography } from '../../../common';\nimport ProcessIndicator, { ProcessIndicatorStatus } from '../../../processIndicator';\nimport Title from '../../../title';\n\nexport interface ProcessingStepProps {\n isComplete: boolean;\n isError: boolean;\n isSuccess: boolean;\n onAnimationCompleted: (status: ProcessIndicatorStatus) => void;\n onClear: React.MouseEventHandler<HTMLButtonElement>;\n psButtonText: string;\n psProcessingText: string;\n psButtonDisabled: boolean;\n}\n\nexport default function ProcessingStep({\n isComplete,\n isError,\n isSuccess,\n onAnimationCompleted,\n onClear,\n psButtonText,\n psProcessingText,\n psButtonDisabled,\n}: ProcessingStepProps) {\n let processStatus = Status.PROCESSING;\n if (isError) {\n processStatus = Status.FAILED;\n }\n if (isSuccess) {\n processStatus = Status.SUCCEEDED;\n }\n\n return (\n <div className=\"droppable-processing-card droppable-card\" aria-hidden={isComplete}>\n <div className=\"droppable-card-content\">\n <ProcessIndicator\n status={processStatus}\n onAnimationCompleted={(status) => onAnimationCompleted(status)}\n />\n <Title className=\"m-y-2\" type={Typography.TITLE_BODY} aria-live=\"polite\">\n {psProcessingText}\n </Title>\n {psButtonText && (\n <Button disabled={psButtonDisabled} onClick={onClear}>\n {psButtonText}\n </Button>\n )}\n </div>\n </div>\n );\n}\n"],"names":["ProcessingStep","isComplete","isError","isSuccess","onAnimationCompleted","onClear","psButtonText","psProcessingText","psButtonDisabled","processStatus","Status","PROCESSING","FAILED","SUCCEEDED","_jsx","className","children","_jsxs","ProcessIndicator","status","Title","type","Typography","TITLE_BODY","Button","disabled","onClick"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBwB,SAAAA,cAAcA,CAAC;EACrCC,UAAU;EACVC,OAAO;EACPC,SAAS;EACTC,oBAAoB;EACpBC,OAAO;EACPC,YAAY;EACZC,gBAAgB;AAChBC,EAAAA,gBAAAA;AACoB,CAAA,EAAA;AACpB,EAAA,IAAIC,aAAa,GAAGC,aAAM,CAACC,UAAU,CAAA;AACrC,EAAA,IAAIT,OAAO,EAAE;IACXO,aAAa,GAAGC,aAAM,CAACE,MAAM,CAAA;AAC/B,GAAA;AACA,EAAA,IAAIT,SAAS,EAAE;IACbM,aAAa,GAAGC,aAAM,CAACG,SAAS,CAAA;AAClC,GAAA;AAEA,EAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,0CAA0C;AAAC,IAAA,aAAA,EAAad,UAAW;AAAAe,IAAAA,QAAA,eAChFC,eAAA,CAAA,KAAA,EAAA;AAAKF,MAAAA,SAAS,EAAC,wBAAwB;MAAAC,QAAA,EAAA,cACrCF,cAAA,CAACI,gBAAgB,EAAA;AACfC,QAAAA,MAAM,EAAEV,aAAc;AACtBL,QAAAA,oBAAoB,EAAGe,MAAM,IAAKf,oBAAoB,CAACe,MAAM,CAAA;AAAE,OAEjE,CAAA,eAAAL,cAAA,CAACM,KAAK,EAAA;AAACL,QAAAA,SAAS,EAAC,OAAO;QAACM,IAAI,EAAEC,qBAAU,CAACC,UAAW;AAAC,QAAA,WAAA,EAAU,QAAQ;AAAAP,QAAAA,QAAA,EACrET,gBAAAA;AAAgB,OACZ,CACP,EAACD,YAAY,iBACXQ,cAAA,CAACU,~~MAAM~~,EAAA;AAACC,QAAAA,QAAQ,EAAEjB,gBAAiB;AAACkB,QAAAA,OAAO,EAAErB,OAAQ;AAAAW,QAAAA,QAAA,EAClDV,YAAAA;AAAY,OACP,CACT,CAAA;KACE,CAAA;AACP,GAAK,CAAC,CAAA;AAEV;;;;"}
1	+ {"version":3,"file":"processingStep.js","sources":["../../../../src/upload/steps/processingStep/processingStep.tsx"],"sourcesContent":["import Button from '../../../button';\nimport { Status, Typography } from '../../../common';\nimport ProcessIndicator, { ProcessIndicatorStatus } from '../../../processIndicator';\nimport Title from '../../../title';\n\nexport interface ProcessingStepProps {\n isComplete: boolean;\n isError: boolean;\n isSuccess: boolean;\n onAnimationCompleted: (status: ProcessIndicatorStatus) => void;\n onClear: React.MouseEventHandler<HTMLButtonElement>;\n psButtonText: string;\n psProcessingText: string;\n psButtonDisabled: boolean;\n}\n\nexport default function ProcessingStep({\n isComplete,\n isError,\n isSuccess,\n onAnimationCompleted,\n onClear,\n psButtonText,\n psProcessingText,\n psButtonDisabled,\n}: ProcessingStepProps) {\n let processStatus = Status.PROCESSING;\n if (isError) {\n processStatus = Status.FAILED;\n }\n if (isSuccess) {\n processStatus = Status.SUCCEEDED;\n }\n\n return (\n <div className=\"droppable-processing-card droppable-card\" aria-hidden={isComplete}>\n <div className=\"droppable-card-content\">\n <ProcessIndicator\n status={processStatus}\n onAnimationCompleted={(status) => onAnimationCompleted(status)}\n />\n <Title className=\"m-y-2\" type={Typography.TITLE_BODY} aria-live=\"polite\">\n {psProcessingText}\n </Title>\n {psButtonText && (\n <Button disabled={psButtonDisabled} onClick={onClear}>\n {psButtonText}\n </Button>\n )}\n </div>\n </div>\n );\n}\n"],"names":["ProcessingStep","isComplete","isError","isSuccess","onAnimationCompleted","onClear","psButtonText","psProcessingText","psButtonDisabled","processStatus","Status","PROCESSING","FAILED","SUCCEEDED","_jsx","className","children","_jsxs","ProcessIndicator","status","Title","type","Typography","TITLE_BODY","Button","disabled","onClick"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgBwB,SAAAA,cAAcA,CAAC;EACrCC,UAAU;EACVC,OAAO;EACPC,SAAS;EACTC,oBAAoB;EACpBC,OAAO;EACPC,YAAY;EACZC,gBAAgB;AAChBC,EAAAA,gBAAAA;AACoB,CAAA,EAAA;AACpB,EAAA,IAAIC,aAAa,GAAGC,aAAM,CAACC,UAAU,CAAA;AACrC,EAAA,IAAIT,OAAO,EAAE;IACXO,aAAa,GAAGC,aAAM,CAACE,MAAM,CAAA;AAC/B,GAAA;AACA,EAAA,IAAIT,SAAS,EAAE;IACbM,aAAa,GAAGC,aAAM,CAACG,SAAS,CAAA;AAClC,GAAA;AAEA,EAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,0CAA0C;AAAC,IAAA,aAAA,EAAad,UAAW;AAAAe,IAAAA,QAAA,eAChFC,eAAA,CAAA,KAAA,EAAA;AAAKF,MAAAA,SAAS,EAAC,wBAAwB;MAAAC,QAAA,EAAA,cACrCF,cAAA,CAACI,gBAAgB,EAAA;AACfC,QAAAA,MAAM,EAAEV,aAAc;AACtBL,QAAAA,oBAAoB,EAAGe,MAAM,IAAKf,oBAAoB,CAACe,MAAM,CAAA;AAAE,OAEjE,CAAA,eAAAL,cAAA,CAACM,KAAK,EAAA;AAACL,QAAAA,SAAS,EAAC,OAAO;QAACM,IAAI,EAAEC,qBAAU,CAACC,UAAW;AAAC,QAAA,WAAA,EAAU,QAAQ;AAAAP,QAAAA,QAAA,EACrET,gBAAAA;AAAgB,OACZ,CACP,EAACD,YAAY,iBACXQ,cAAA,CAACU,eAAM,EAAA;AAACC,QAAAA,QAAQ,EAAEjB,gBAAiB;AAACkB,QAAAA,OAAO,EAAErB,OAAQ;AAAAW,QAAAA,QAAA,EAClDV,YAAAA;AAAY,OACP,CACT,CAAA;KACE,CAAA;AACP,GAAK,CAAC,CAAA;AAEV;;;;"}

package/build/upload/steps/processingStep/processingStep.mjs CHANGED Viewed

@@ -1,4 +1,4 @@
-import Button from '../../../button/Button.mjs';
+import Button from '../../../button/Button.resolver.mjs';
 import '../../../common/theme.mjs';
 import '../../../common/direction.mjs';
 import '../../../common/propsValues/control.mjs';

package/build/uploadInput/UploadInput.js CHANGED Viewed

@@ -3,7 +3,7 @@
 var clsx = require('clsx');
 var React = require('react');
 var reactIntl = require('react-intl');
-var Button = require('../button/Button.js');
+var Button_resolver = require('../button/Button.resolver.js');
 require('../common/theme.js');
 require('../common/direction.js');
 var control = require('../common/propsValues/control.js');
@@ -294,13 +294,13 @@ const UploadInput = ({
       body: deleteConfirm?.body !== undefined ? deleteConfirm.body : formatMessage(UploadInput_messages.deleteModalBody),
       open: !!markedFileForDelete,
       footer: /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-        children: [/*#__PURE__*/jsxRuntime.jsx(Button, {
+        children: [/*#__PURE__*/jsxRuntime.jsx(Button_resolver, {
           block: true,
           onClick: () => {
             setMarkedFileForDelete(null);
           },
           children: deleteConfirm?.cancelText || formatMessage(UploadInput_messages.deleteModalCancelButtonText)
-        }), /*#__PURE__*/jsxRuntime.jsx(Button, {
+        }), /*#__PURE__*/jsxRuntime.jsx(Button_resolver, {
           block: true,
           priority: control.Priority.SECONDARY,
           type: control.ControlType.NEGATIVE,

package/build/uploadInput/UploadInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"UploadInput.js","sources":["../../src/uploadInput/UploadInput.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport Button from '../button';\nimport { CommonProps, ControlType, Priority, Status } from '../common';\nimport { useInputAttributes } from '../inputs/contexts';\nimport Modal from '../modal';\nimport { isSizeValid } from '../upload/utils/isSizeValid';\nimport { isTypeValid } from '../upload/utils/isTypeValid';\n\nimport MESSAGES from './UploadInput.messages';\nimport { UploadedFile, UploadError, UploadResponse } from './types';\nimport UploadButton, { UploadButtonProps } from './uploadButton/UploadButton';\nimport { DEFAULT_SIZE_LIMIT, imageFileTypes } from './uploadButton/defaults';\nimport UploadItem, { UploadItemProps } from './uploadItem/UploadItem';\n\nexport type UploadInputProps = {\n /*\n List of already existing, failed or in progress files\n /\n files?: readonly UploadedFile[];\n\n /\n The key of the file in the returned FormData object (default: file)\n /\n fileInputName?: string;\n\n /\n Callback that handles form submission\n \n @param formData\n /\n onUploadFile: (formData: FormData) => Promise<UploadResponse>;\n\n /\n Provide a callback if the file can be removed/deleted from the server\n * Your app is responsible for reloading the uploaded files list and updating the component to ensure that the file has in fact been deleted successfully\n \n @param id\n /\n onDeleteFile?: (id: string \| number) => Promise<any>;\n\n /\n Provide a callback to trigger on validation error\n \n @param file\n /\n onValidationError?: (file: UploadedFile) => void;\n\n /\n Provide a callback to trigger on change whenever the files are updated\n \n @param files\n /\n onFilesChange?: (files: UploadedFile[]) => void;\n\n /\n Confirmation modal displayed on delete\n /\n deleteConfirm?: {\n /\n The title of the confirmation modal on delete\n /\n title?: string;\n\n /\n The body of the confirmation modal on delete\n /\n body?: React.ReactNode;\n\n /\n The confirm button text of the confirmation modal on delete\n /\n confirmText?: string;\n\n /\n The cancel button text of the confirmation modal on delete\n /\n cancelText?: string;\n };\n\n /\n Maximum number of files allowed, if provided, shows error below file item\n /\n maxFiles?: number;\n\n /\n Error message to show when the maximum number of files are uploaded already\n /\n maxFilesErrorMessage?: string;\n\n /\n Error message to show when files over a allowed size limit are uploaded\n /\n sizeLimitErrorMessage?: string;\n} & Pick<\n UploadButtonProps,\n 'disabled' \| 'multiple' \| 'fileTypes' \| 'sizeLimit' \| 'description' \| 'id' \| 'uploadButtonTitle'\n> & { onDownload?: UploadItemProps['onDownload'] } & CommonProps;\n\n/\n Interface representing a reference to an UploadItem component.\n * Provides a method to focus the UploadItem.\n /\ninterface UploadItemRef {\n /\n Focuses the UploadItem component.\n /\n focus: () => void;\n\n /\n Required id of the UploadItem component.\n /\n id: string \| number;\n\n /\n Optional status of the UploadItem component.\n /\n status?: string;\n}\n\n/\n Generates a unique ID for a file based on its name, size, and the current timestamp\n /\nfunction generateFileId(file: File) {\n const { name, size } = file;\n const uploadTimeStamp = new Date().getTime();\n return `${name}_${size}_${uploadTimeStamp}`;\n}\n\n/\n The component allows users to upload files, manage the list of uploaded files,\n * and handle file validation and deletion.\n \n @param {UploadInputProps} props - The properties for the UploadInput component.\n \n @see {@link UploadInput} for further information.\n * @see {@link https://storybook.wise.design/?path=/docs/forms-uploadinput--docs\|Storybook Wise Design}\n /\nconst UploadInput = ({\n files = [],\n fileInputName = 'file',\n className,\n deleteConfirm,\n disabled,\n multiple = false,\n fileTypes = imageFileTypes,\n sizeLimit = DEFAULT_SIZE_LIMIT,\n description,\n onUploadFile,\n onDeleteFile,\n onValidationError,\n onFilesChange,\n onDownload,\n maxFiles,\n maxFilesErrorMessage,\n id,\n sizeLimitErrorMessage,\n uploadButtonTitle,\n}: UploadInputProps) => {\n const inputAttributes = useInputAttributes({ nonLabelable: true });\n const [markedFileForDelete, setMarkedFileForDelete] = useState<UploadedFile \| null>(null);\n const [mounted, setMounted] = useState(false);\n const { formatMessage } = useIntl();\n const uploadInputRef = useRef<HTMLInputElement \| null>(null);\n let fileRefs: (HTMLDivElement \| UploadItemRef \| null)[] = [];\n\n const PROGRESS_STATUSES = new Set([Status.PENDING, Status.PROCESSING]);\n\n const [uploadedFiles, setUploadedFiles] = useState<readonly UploadedFile[]>(\n multiple \|\| files.length === 0 ? files : [files[0]],\n );\n\n const uploadedFilesListReference = useRef(multiple \|\| files.length === 0 ? files : [files[0]]);\n\n function updateFileList(updateFn: (list: readonly UploadedFile[]) => readonly UploadedFile[]) {\n setUploadedFiles(updateFn);\n uploadedFilesListReference.current = updateFn(uploadedFilesListReference.current);\n }\n\n function addFileToList(recentUploadedFile: UploadedFile) {\n updateFileList((list) => [...list, recentUploadedFile]);\n }\n\n function removeFileFromList(file: UploadedFile) {\n updateFileList((list) =>\n list.filter((fileInList) => file !== fileInList && file.id !== fileInList.id),\n );\n fileRefs = fileRefs.filter((ref) => ref && ref.id !== file.id);\n }\n\n function modifyFileInList(file: UploadedFile, updates: Partial<UploadedFile>) {\n updateFileList((list) =>\n list.map((fileInList) =>\n fileInList === file \|\| fileInList.id === file.id ? { ...file, ...updates } : fileInList,\n ),\n );\n }\n\n const removeFile = async (file: UploadedFile) => {\n const { id, status } = file;\n fileRefs = fileRefs.filter((item) => item && item.id !== file.id);\n\n if (status === Status.FAILED) {\n removeFileFromList(file);\n return Promise.resolve();\n }\n\n if (onDeleteFile && id) {\n modifyFileInList(file, { status: Status.PROCESSING, error: undefined });\n\n return onDeleteFile(id)\n .then(() => {\n removeFileFromList(file);\n })\n .catch((error) => {\n modifyFileInList(file, { error: error as UploadError });\n });\n }\n };\n\n function handleFileUploadFailure(file: File, failureMessage: string) {\n const { name } = file;\n\n const failedUpload = {\n id: generateFileId(file),\n filename: name,\n status: Status.FAILED,\n error: failureMessage,\n };\n\n addFileToList(failedUpload);\n\n if (onValidationError) {\n onValidationError(failedUpload);\n }\n }\n\n function getNumberOfFilesUploaded() {\n const uploadInitiatedStatus = new Set([Status.SUCCEEDED, Status.PENDING]);\n const validFiles = uploadedFilesListReference.current.filter(\n (file) => file.status && uploadInitiatedStatus.has(file.status),\n );\n return validFiles.length;\n }\n\n function areMaximumFilesUploadedAlready() {\n if (!maxFiles) {\n return false;\n }\n\n const numberOfValidFiles = getNumberOfFilesUploaded();\n return numberOfValidFiles >= maxFiles;\n }\n\n const addFiles = (selectedFiles: FileList) => {\n for (let i = 0; i < selectedFiles.length; i += 1) {\n const file = selectedFiles.item(i);\n\n const formData = new FormData();\n\n if (file) {\n const allowedFileTypes = typeof fileTypes === 'string' ? fileTypes : fileTypes.join(',');\n\n if (!isTypeValid(file, allowedFileTypes)) {\n handleFileUploadFailure(file, formatMessage(MESSAGES.fileTypeNotSupported));\n continue;\n }\n\n if (!isSizeValid(file, sizeLimit 1000)) {\n const failureMessage = sizeLimitErrorMessage \|\| formatMessage(MESSAGES.fileIsTooLarge);\n handleFileUploadFailure(file, failureMessage);\n continue;\n }\n\n if (areMaximumFilesUploadedAlready()) {\n const failureMessage =\n maxFilesErrorMessage \|\|\n formatMessage(MESSAGES.maximumFilesAlreadyUploaded, { maxFilesAllowed: maxFiles });\n handleFileUploadFailure(file, failureMessage);\n continue;\n }\n\n const existingFile = uploadedFiles.find((f) => f.filename === file.name);\n if (existingFile) {\n removeFileFromList(existingFile);\n }\n\n formData.append(fileInputName, file);\n const pendingFile = {\n id: generateFileId(file),\n filename: file.name,\n status: Status.PENDING,\n };\n\n addFileToList(pendingFile);\n\n onUploadFile(formData)\n .then(({ id, url, error }: UploadResponse) => {\n modifyFileInList(pendingFile, { id, url, error, status: Status.SUCCEEDED });\n })\n .catch((error) => {\n modifyFileInList(pendingFile, { error: error as UploadError, status: Status.FAILED });\n });\n\n if (!multiple) {\n break;\n }\n }\n }\n };\n\n useEffect(() => {\n setMounted(true);\n }, []);\n\n useEffect(() => {\n if (onFilesChange && mounted) {\n onFilesChange([...uploadedFiles]);\n }\n }, [onFilesChange, uploadedFiles]); // eslint-disable-line react-hooks/exhaustive-deps\n\n const [nextFocusable, setNextFocusable] = useState<HTMLDivElement \| UploadItemRef \| null>(\n uploadInputRef.current,\n );\n\n const handleFocus = (fileId: string \| number) => {\n fileRefs = fileRefs.filter((ref) => {\n return ref && ref.id !== markedFileForDelete?.id;\n });\n\n const filesCount = fileRefs.length;\n let next: HTMLDivElement \| UploadItemRef \| null = uploadInputRef.current;\n\n if (filesCount > 1) {\n const currentFileIndex = fileRefs.findIndex((file) => file?.id === fileId);\n const currentFileId = fileRefs?.[currentFileIndex]?.id;\n const lastFileId = fileRefs?.[filesCount - 1]?.id;\n\n // if last file, select a previous one\n if (currentFileId === lastFileId) {\n next = fileRefs[filesCount - 2];\n } else {\n next = fileRefs[currentFileIndex + 1];\n }\n }\n setNextFocusable(next);\n };\n\n const handleRefocus = () => {\n if (nextFocusable && 'focus' in nextFocusable && typeof nextFocusable.focus === 'function') {\n setTimeout(() => {\n nextFocusable.focus();\n }, 0);\n }\n };\n\n return (\n <>\n <div\n role=\"group\"\n className={clsx('np-upload-input', className, { disabled })}\n {...inputAttributes}\n >\n <div\n className=\"np-upload-input__section\"\n aria-live=\"polite\"\n aria-relevant=\"all\"\n role=\"region\"\n >\n {uploadedFiles.map((file, index) => (\n <UploadItem\n key={file.id}\n ref={(el: UploadItemRef \| null) => {\n if (\n el &&\n el.id !== markedFileForDelete?.id &&\n !fileRefs.some((ref) => ref && ref.id === el.id) &&\n el.status !== 'processing'\n ) {\n fileRefs.push(el);\n }\n }}\n file={file}\n singleFileUpload={!multiple}\n canDelete={\n (!!onDeleteFile \|\| file.status === Status.FAILED) &&\n (!file.status \|\| !PROGRESS_STATUSES.has(file.status))\n }\n onDelete={\n file.status === Status.FAILED\n ? async () => {\n await removeFile(file);\n handleRefocus();\n }\n : () => setMarkedFileForDelete(file)\n }\n onDownload={onDownload}\n onFocus={() => handleFocus(file.id)}\n />\n ))}\n </div>\n {(multiple \|\| (!multiple && !uploadedFiles.length)) && (\n <div className=\"np-upload-input__section np-upload-input__section--uploader\">\n <UploadButton\n ref={uploadInputRef}\n id={id}\n uploadButtonTitle={uploadButtonTitle}\n disabled={areMaximumFilesUploadedAlready() \|\| disabled}\n multiple={multiple}\n fileTypes={fileTypes}\n sizeLimit={sizeLimit}\n description={description}\n maxFiles={maxFiles}\n withEntries={Boolean(uploadedFiles.length)}\n onChange={addFiles}\n />\n </div>\n )}\n </div>\n <Modal\n title={\n deleteConfirm?.title !== undefined\n ? deleteConfirm.title\n : formatMessage(MESSAGES.deleteModalTitle)\n }\n body={\n deleteConfirm?.body !== undefined\n ? deleteConfirm.body\n : formatMessage(MESSAGES.deleteModalBody)\n }\n open={!!markedFileForDelete}\n footer={\n <>\n <Button\n block\n onClick={() => {\n setMarkedFileForDelete(null);\n }}\n >\n {deleteConfirm?.cancelText \|\| formatMessage(MESSAGES.deleteModalCancelButtonText)}\n </Button>\n <Button\n block\n priority={Priority.SECONDARY}\n type={ControlType.NEGATIVE}\n tabIndex={markedFileForDelete ? 0 : -1}\n onClick={() => {\n if (markedFileForDelete) {\n void removeFile(markedFileForDelete);\n }\n setMarkedFileForDelete(null);\n }}\n >\n {deleteConfirm?.confirmText \|\| formatMessage(MESSAGES.deleteModalConfirmButtonText)}\n </Button>\n </>\n }\n onUnmount={handleRefocus}\n onClose={() => {\n setMarkedFileForDelete(null);\n }}\n />\n </>\n );\n};\n\nexport default UploadInput;\n"],"names":["generateFileId","file","name","size","uploadTimeStamp","Date","getTime","UploadInput","files","fileInputName","className","deleteConfirm","disabled","multiple","fileTypes","imageFileTypes","sizeLimit","DEFAULT_SIZE_LIMIT","description","onUploadFile","onDeleteFile","onValidationError","onFilesChange","onDownload","maxFiles","maxFilesErrorMessage","id","sizeLimitErrorMessage","uploadButtonTitle","inputAttributes","useInputAttributes","nonLabelable","markedFileForDelete","setMarkedFileForDelete","useState","mounted","setMounted","formatMessage","useIntl","uploadInputRef","useRef","fileRefs","PROGRESS_STATUSES","Set","Status","PENDING","PROCESSING","uploadedFiles","setUploadedFiles","length","uploadedFilesListReference","updateFileList","updateFn","current","addFileToList","recentUploadedFile","list","removeFileFromList","filter","fileInList","ref","modifyFileInList","updates","map","removeFile","status","item","FAILED","Promise","resolve","error","undefined","then","catch","handleFileUploadFailure","failureMessage","failedUpload","filename","getNumberOfFilesUploaded","uploadInitiatedStatus","SUCCEEDED","validFiles","has","areMaximumFilesUploadedAlready","numberOfValidFiles","addFiles","selectedFiles","i","formData","FormData","allowedFileTypes","join","isTypeValid","MESSAGES","fileTypeNotSupported","isSizeValid","fileIsTooLarge","maximumFilesAlreadyUploaded","maxFilesAllowed","existingFile","find","f","append","pendingFile","url","useEffect","nextFocusable","setNextFocusable","handleFocus","fileId","filesCount","next","currentFileIndex","findIndex","currentFileId","lastFileId","handleRefocus","focus","setTimeout","_jsxs","_Fragment","children","role","clsx","_jsx","index","UploadItem","el","some","push","singleFileUpload","canDelete","onDelete","onFocus","UploadButton","withEntries","Boolean","onChange","Modal","title","deleteModalTitle","body","deleteModalBody","open","footer","Button","block","onClick","cancelText","deleteModalCancelButtonText","priority","Priority","SECONDARY","type","ControlType","NEGATIVE","tabIndex","confirmText","deleteModalConfirmButtonText","onUnmount","onClose"],"mappings":"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"}
1	+ {"version":3,"file":"UploadInput.js","sources":["../../src/uploadInput/UploadInput.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useEffect, useRef, useState } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport Button from '../button';\nimport { CommonProps, ControlType, Priority, Status } from '../common';\nimport { useInputAttributes } from '../inputs/contexts';\nimport Modal from '../modal';\nimport { isSizeValid } from '../upload/utils/isSizeValid';\nimport { isTypeValid } from '../upload/utils/isTypeValid';\n\nimport MESSAGES from './UploadInput.messages';\nimport { UploadedFile, UploadError, UploadResponse } from './types';\nimport UploadButton, { UploadButtonProps } from './uploadButton/UploadButton';\nimport { DEFAULT_SIZE_LIMIT, imageFileTypes } from './uploadButton/defaults';\nimport UploadItem, { UploadItemProps } from './uploadItem/UploadItem';\n\nexport type UploadInputProps = {\n /*\n List of already existing, failed or in progress files\n /\n files?: readonly UploadedFile[];\n\n /\n The key of the file in the returned FormData object (default: file)\n /\n fileInputName?: string;\n\n /\n Callback that handles form submission\n \n @param formData\n /\n onUploadFile: (formData: FormData) => Promise<UploadResponse>;\n\n /\n Provide a callback if the file can be removed/deleted from the server\n * Your app is responsible for reloading the uploaded files list and updating the component to ensure that the file has in fact been deleted successfully\n \n @param id\n /\n onDeleteFile?: (id: string \| number) => Promise<any>;\n\n /\n Provide a callback to trigger on validation error\n \n @param file\n /\n onValidationError?: (file: UploadedFile) => void;\n\n /\n Provide a callback to trigger on change whenever the files are updated\n \n @param files\n /\n onFilesChange?: (files: UploadedFile[]) => void;\n\n /\n Confirmation modal displayed on delete\n /\n deleteConfirm?: {\n /\n The title of the confirmation modal on delete\n /\n title?: string;\n\n /\n The body of the confirmation modal on delete\n /\n body?: React.ReactNode;\n\n /\n The confirm button text of the confirmation modal on delete\n /\n confirmText?: string;\n\n /\n The cancel button text of the confirmation modal on delete\n /\n cancelText?: string;\n };\n\n /\n Maximum number of files allowed, if provided, shows error below file item\n /\n maxFiles?: number;\n\n /\n Error message to show when the maximum number of files are uploaded already\n /\n maxFilesErrorMessage?: string;\n\n /\n Error message to show when files over a allowed size limit are uploaded\n /\n sizeLimitErrorMessage?: string;\n} & Pick<\n UploadButtonProps,\n 'disabled' \| 'multiple' \| 'fileTypes' \| 'sizeLimit' \| 'description' \| 'id' \| 'uploadButtonTitle'\n> & { onDownload?: UploadItemProps['onDownload'] } & CommonProps;\n\n/\n Interface representing a reference to an UploadItem component.\n * Provides a method to focus the UploadItem.\n /\ninterface UploadItemRef {\n /\n Focuses the UploadItem component.\n /\n focus: () => void;\n\n /\n Required id of the UploadItem component.\n /\n id: string \| number;\n\n /\n Optional status of the UploadItem component.\n /\n status?: string;\n}\n\n/\n Generates a unique ID for a file based on its name, size, and the current timestamp\n /\nfunction generateFileId(file: File) {\n const { name, size } = file;\n const uploadTimeStamp = new Date().getTime();\n return `${name}_${size}_${uploadTimeStamp}`;\n}\n\n/\n The component allows users to upload files, manage the list of uploaded files,\n * and handle file validation and deletion.\n \n @param {UploadInputProps} props - The properties for the UploadInput component.\n \n @see {@link UploadInput} for further information.\n * @see {@link https://storybook.wise.design/?path=/docs/forms-uploadinput--docs\|Storybook Wise Design}\n /\nconst UploadInput = ({\n files = [],\n fileInputName = 'file',\n className,\n deleteConfirm,\n disabled,\n multiple = false,\n fileTypes = imageFileTypes,\n sizeLimit = DEFAULT_SIZE_LIMIT,\n description,\n onUploadFile,\n onDeleteFile,\n onValidationError,\n onFilesChange,\n onDownload,\n maxFiles,\n maxFilesErrorMessage,\n id,\n sizeLimitErrorMessage,\n uploadButtonTitle,\n}: UploadInputProps) => {\n const inputAttributes = useInputAttributes({ nonLabelable: true });\n const [markedFileForDelete, setMarkedFileForDelete] = useState<UploadedFile \| null>(null);\n const [mounted, setMounted] = useState(false);\n const { formatMessage } = useIntl();\n const uploadInputRef = useRef<HTMLInputElement \| null>(null);\n let fileRefs: (HTMLDivElement \| UploadItemRef \| null)[] = [];\n\n const PROGRESS_STATUSES = new Set([Status.PENDING, Status.PROCESSING]);\n\n const [uploadedFiles, setUploadedFiles] = useState<readonly UploadedFile[]>(\n multiple \|\| files.length === 0 ? files : [files[0]],\n );\n\n const uploadedFilesListReference = useRef(multiple \|\| files.length === 0 ? files : [files[0]]);\n\n function updateFileList(updateFn: (list: readonly UploadedFile[]) => readonly UploadedFile[]) {\n setUploadedFiles(updateFn);\n uploadedFilesListReference.current = updateFn(uploadedFilesListReference.current);\n }\n\n function addFileToList(recentUploadedFile: UploadedFile) {\n updateFileList((list) => [...list, recentUploadedFile]);\n }\n\n function removeFileFromList(file: UploadedFile) {\n updateFileList((list) =>\n list.filter((fileInList) => file !== fileInList && file.id !== fileInList.id),\n );\n fileRefs = fileRefs.filter((ref) => ref && ref.id !== file.id);\n }\n\n function modifyFileInList(file: UploadedFile, updates: Partial<UploadedFile>) {\n updateFileList((list) =>\n list.map((fileInList) =>\n fileInList === file \|\| fileInList.id === file.id ? { ...file, ...updates } : fileInList,\n ),\n );\n }\n\n const removeFile = async (file: UploadedFile) => {\n const { id, status } = file;\n fileRefs = fileRefs.filter((item) => item && item.id !== file.id);\n\n if (status === Status.FAILED) {\n removeFileFromList(file);\n return Promise.resolve();\n }\n\n if (onDeleteFile && id) {\n modifyFileInList(file, { status: Status.PROCESSING, error: undefined });\n\n return onDeleteFile(id)\n .then(() => {\n removeFileFromList(file);\n })\n .catch((error) => {\n modifyFileInList(file, { error: error as UploadError });\n });\n }\n };\n\n function handleFileUploadFailure(file: File, failureMessage: string) {\n const { name } = file;\n\n const failedUpload = {\n id: generateFileId(file),\n filename: name,\n status: Status.FAILED,\n error: failureMessage,\n };\n\n addFileToList(failedUpload);\n\n if (onValidationError) {\n onValidationError(failedUpload);\n }\n }\n\n function getNumberOfFilesUploaded() {\n const uploadInitiatedStatus = new Set([Status.SUCCEEDED, Status.PENDING]);\n const validFiles = uploadedFilesListReference.current.filter(\n (file) => file.status && uploadInitiatedStatus.has(file.status),\n );\n return validFiles.length;\n }\n\n function areMaximumFilesUploadedAlready() {\n if (!maxFiles) {\n return false;\n }\n\n const numberOfValidFiles = getNumberOfFilesUploaded();\n return numberOfValidFiles >= maxFiles;\n }\n\n const addFiles = (selectedFiles: FileList) => {\n for (let i = 0; i < selectedFiles.length; i += 1) {\n const file = selectedFiles.item(i);\n\n const formData = new FormData();\n\n if (file) {\n const allowedFileTypes = typeof fileTypes === 'string' ? fileTypes : fileTypes.join(',');\n\n if (!isTypeValid(file, allowedFileTypes)) {\n handleFileUploadFailure(file, formatMessage(MESSAGES.fileTypeNotSupported));\n continue;\n }\n\n if (!isSizeValid(file, sizeLimit 1000)) {\n const failureMessage = sizeLimitErrorMessage \|\| formatMessage(MESSAGES.fileIsTooLarge);\n handleFileUploadFailure(file, failureMessage);\n continue;\n }\n\n if (areMaximumFilesUploadedAlready()) {\n const failureMessage =\n maxFilesErrorMessage \|\|\n formatMessage(MESSAGES.maximumFilesAlreadyUploaded, { maxFilesAllowed: maxFiles });\n handleFileUploadFailure(file, failureMessage);\n continue;\n }\n\n const existingFile = uploadedFiles.find((f) => f.filename === file.name);\n if (existingFile) {\n removeFileFromList(existingFile);\n }\n\n formData.append(fileInputName, file);\n const pendingFile = {\n id: generateFileId(file),\n filename: file.name,\n status: Status.PENDING,\n };\n\n addFileToList(pendingFile);\n\n onUploadFile(formData)\n .then(({ id, url, error }: UploadResponse) => {\n modifyFileInList(pendingFile, { id, url, error, status: Status.SUCCEEDED });\n })\n .catch((error) => {\n modifyFileInList(pendingFile, { error: error as UploadError, status: Status.FAILED });\n });\n\n if (!multiple) {\n break;\n }\n }\n }\n };\n\n useEffect(() => {\n setMounted(true);\n }, []);\n\n useEffect(() => {\n if (onFilesChange && mounted) {\n onFilesChange([...uploadedFiles]);\n }\n }, [onFilesChange, uploadedFiles]); // eslint-disable-line react-hooks/exhaustive-deps\n\n const [nextFocusable, setNextFocusable] = useState<HTMLDivElement \| UploadItemRef \| null>(\n uploadInputRef.current,\n );\n\n const handleFocus = (fileId: string \| number) => {\n fileRefs = fileRefs.filter((ref) => {\n return ref && ref.id !== markedFileForDelete?.id;\n });\n\n const filesCount = fileRefs.length;\n let next: HTMLDivElement \| UploadItemRef \| null = uploadInputRef.current;\n\n if (filesCount > 1) {\n const currentFileIndex = fileRefs.findIndex((file) => file?.id === fileId);\n const currentFileId = fileRefs?.[currentFileIndex]?.id;\n const lastFileId = fileRefs?.[filesCount - 1]?.id;\n\n // if last file, select a previous one\n if (currentFileId === lastFileId) {\n next = fileRefs[filesCount - 2];\n } else {\n next = fileRefs[currentFileIndex + 1];\n }\n }\n setNextFocusable(next);\n };\n\n const handleRefocus = () => {\n if (nextFocusable && 'focus' in nextFocusable && typeof nextFocusable.focus === 'function') {\n setTimeout(() => {\n nextFocusable.focus();\n }, 0);\n }\n };\n\n return (\n <>\n <div\n role=\"group\"\n className={clsx('np-upload-input', className, { disabled })}\n {...inputAttributes}\n >\n <div\n className=\"np-upload-input__section\"\n aria-live=\"polite\"\n aria-relevant=\"all\"\n role=\"region\"\n >\n {uploadedFiles.map((file, index) => (\n <UploadItem\n key={file.id}\n ref={(el: UploadItemRef \| null) => {\n if (\n el &&\n el.id !== markedFileForDelete?.id &&\n !fileRefs.some((ref) => ref && ref.id === el.id) &&\n el.status !== 'processing'\n ) {\n fileRefs.push(el);\n }\n }}\n file={file}\n singleFileUpload={!multiple}\n canDelete={\n (!!onDeleteFile \|\| file.status === Status.FAILED) &&\n (!file.status \|\| !PROGRESS_STATUSES.has(file.status))\n }\n onDelete={\n file.status === Status.FAILED\n ? async () => {\n await removeFile(file);\n handleRefocus();\n }\n : () => setMarkedFileForDelete(file)\n }\n onDownload={onDownload}\n onFocus={() => handleFocus(file.id)}\n />\n ))}\n </div>\n {(multiple \|\| (!multiple && !uploadedFiles.length)) && (\n <div className=\"np-upload-input__section np-upload-input__section--uploader\">\n <UploadButton\n ref={uploadInputRef}\n id={id}\n uploadButtonTitle={uploadButtonTitle}\n disabled={areMaximumFilesUploadedAlready() \|\| disabled}\n multiple={multiple}\n fileTypes={fileTypes}\n sizeLimit={sizeLimit}\n description={description}\n maxFiles={maxFiles}\n withEntries={Boolean(uploadedFiles.length)}\n onChange={addFiles}\n />\n </div>\n )}\n </div>\n <Modal\n title={\n deleteConfirm?.title !== undefined\n ? deleteConfirm.title\n : formatMessage(MESSAGES.deleteModalTitle)\n }\n body={\n deleteConfirm?.body !== undefined\n ? deleteConfirm.body\n : formatMessage(MESSAGES.deleteModalBody)\n }\n open={!!markedFileForDelete}\n footer={\n <>\n <Button\n block\n onClick={() => {\n setMarkedFileForDelete(null);\n }}\n >\n {deleteConfirm?.cancelText \|\| formatMessage(MESSAGES.deleteModalCancelButtonText)}\n </Button>\n <Button\n block\n priority={Priority.SECONDARY}\n type={ControlType.NEGATIVE}\n tabIndex={markedFileForDelete ? 0 : -1}\n onClick={() => {\n if (markedFileForDelete) {\n void removeFile(markedFileForDelete);\n }\n setMarkedFileForDelete(null);\n }}\n >\n {deleteConfirm?.confirmText \|\| formatMessage(MESSAGES.deleteModalConfirmButtonText)}\n </Button>\n </>\n }\n onUnmount={handleRefocus}\n onClose={() => {\n setMarkedFileForDelete(null);\n }}\n />\n </>\n );\n};\n\nexport default UploadInput;\n"],"names":["generateFileId","file","name","size","uploadTimeStamp","Date","getTime","UploadInput","files","fileInputName","className","deleteConfirm","disabled","multiple","fileTypes","imageFileTypes","sizeLimit","DEFAULT_SIZE_LIMIT","description","onUploadFile","onDeleteFile","onValidationError","onFilesChange","onDownload","maxFiles","maxFilesErrorMessage","id","sizeLimitErrorMessage","uploadButtonTitle","inputAttributes","useInputAttributes","nonLabelable","markedFileForDelete","setMarkedFileForDelete","useState","mounted","setMounted","formatMessage","useIntl","uploadInputRef","useRef","fileRefs","PROGRESS_STATUSES","Set","Status","PENDING","PROCESSING","uploadedFiles","setUploadedFiles","length","uploadedFilesListReference","updateFileList","updateFn","current","addFileToList","recentUploadedFile","list","removeFileFromList","filter","fileInList","ref","modifyFileInList","updates","map","removeFile","status","item","FAILED","Promise","resolve","error","undefined","then","catch","handleFileUploadFailure","failureMessage","failedUpload","filename","getNumberOfFilesUploaded","uploadInitiatedStatus","SUCCEEDED","validFiles","has","areMaximumFilesUploadedAlready","numberOfValidFiles","addFiles","selectedFiles","i","formData","FormData","allowedFileTypes","join","isTypeValid","MESSAGES","fileTypeNotSupported","isSizeValid","fileIsTooLarge","maximumFilesAlreadyUploaded","maxFilesAllowed","existingFile","find","f","append","pendingFile","url","useEffect","nextFocusable","setNextFocusable","handleFocus","fileId","filesCount","next","currentFileIndex","findIndex","currentFileId","lastFileId","handleRefocus","focus","setTimeout","_jsxs","_Fragment","children","role","clsx","_jsx","index","UploadItem","el","some","push","singleFileUpload","canDelete","onDelete","onFocus","UploadButton","withEntries","Boolean","onChange","Modal","title","deleteModalTitle","body","deleteModalBody","open","footer","Button","block","onClick","cancelText","deleteModalCancelButtonText","priority","Priority","SECONDARY","type","ControlType","NEGATIVE","tabIndex","confirmText","deleteModalConfirmButtonText","onUnmount","onClose"],"mappings":"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"}

package/build/uploadInput/UploadInput.mjs CHANGED Viewed

@@ -1,7 +1,7 @@
 import { clsx } from 'clsx';
 import { useState, useRef, useEffect } from 'react';
 import { useIntl } from 'react-intl';
-import Button from '../button/Button.mjs';
+import Button from '../button/Button.resolver.mjs';
 import '../common/theme.mjs';
 import '../common/direction.mjs';
 import { Priority, ControlType } from '../common/propsValues/control.mjs';

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@transferwise/components",
-  "version": "46.87.2",
+  "version": "46.88.1",
   "description": "Neptune React components",
   "license": "Apache-2.0",
   "repository": {
@@ -91,9 +91,9 @@
     "rollup": "^4.18.1",
     "rollup-preserve-directives": "^1.1.1",
     "storybook": "^8.2.2",
-    "@transferwise/less-config": "3.1.0",
+    "@transferwise/neptune-css": "14.21.0",
     "@wise/components-theming": "1.6.1",
-    "@transferwise/neptune-css": "14.20.1"
+    "@transferwise/less-config": "3.1.0"
   },
   "peerDependencies": {
     "@transferwise/icons": "^3.13.1",

package/src/alert/Alert.tests.story.tsx CHANGED Viewed

@@ -5,7 +5,7 @@ import { Button, Field, SelectInput, Sentiment } from '..';
 import Alert, { type AlertProps } from './Alert';
 const meta = {
-  title: 'Feedback/Alert/tests',
+  title: 'Feedback/Alert/Tests',
   component: Alert,
   argTypes: {},
   args: {

package/src/avatar/Avatar.story.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import Avatar, { AvatarType } from '.';
  */
 export default {
   component: Avatar,
-  title: 'Content/Avatar',
+  title: 'Content/Avatar (Deprecated)',
   tags: ['autodocs'],
 } satisfies Meta<typeof Avatar>;

package/src/avatarLayout/AvatarLayout.css CHANGED Viewed

@@ -11,10 +11,18 @@
   -webkit-mask-image: radial-gradient(circle at bottom calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)) right calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)), transparent 0, transparent calc(var(--np-avatar-size) / 2 + 2px), black 0);
           mask-image: radial-gradient(circle at bottom calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)) right calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)), transparent 0, transparent calc(var(--np-avatar-size) / 2 + 2px), black 0);
 }
+[dir="rtl"] .np-avatar-layout-diagonal-mask {
+  -webkit-mask-image: radial-gradient(circle at bottom calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)) left calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)), transparent 0, transparent calc(var(--np-avatar-size) / 2 + 2px), black 0);
+          mask-image: radial-gradient(circle at bottom calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)) left calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)), transparent 0, transparent calc(var(--np-avatar-size) / 2 + 2px), black 0);
+}
 .np-avatar-layout-diagonal-child {
   margin-left: calc(var(--np-avatar-layout-size) - var(--np-avatar-size) * 2);
   margin-top: calc(var(--np-avatar-layout-size) - var(--np-avatar-size));
 }
+[dir="rtl"] .np-avatar-layout-diagonal-child {
+  margin-left: 0;
+  margin-right: calc(var(--np-avatar-layout-size) - var(--np-avatar-size) * 2);
+}
 .np-avatar-layout-horizontal {
   width: calc(var(--np-avatar-size) * var(--np-avatar-avatars-count) - (var(--np-avatar-offset) * (var(--np-avatar-avatars-count) - 1)));
   width: calc(var(--np-avatar-size) * var(--np-avatar-avatars-count) - calc(var(--np-avatar-offset) * calc(var(--np-avatar-avatars-count) - 1)));
@@ -29,3 +37,6 @@
 .np-avatar-layout-horizontal-child {
   margin-left: calc(var(--np-avatar-offset) * -1);
 }
+[dir="rtl"] .np-avatar-layout-horizontal-child {
+  margin-right: calc(var(--np-avatar-offset) * -1);
+}

package/src/avatarLayout/AvatarLayout.less CHANGED Viewed

@@ -13,11 +13,24 @@
           transparent 0,
           transparent calc(var(--np-avatar-size) / 2 + 2px),
           black 0);
+      :dir(rtl) & {
+        mask-image:
+          radial-gradient(circle at bottom calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)) left calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)),
+            transparent 0,
+            transparent calc(var(--np-avatar-size) / 2 + 2px),
+            black 0);
+      }
     }
     &-child {
       margin-left: calc(var(--np-avatar-layout-size) - var(--np-avatar-size) * 2);
       margin-top: calc(var(--np-avatar-layout-size) - var(--np-avatar-size));
+      :dir(rtl) & {
+        margin-left: 0;
+        margin-right: calc(var(--np-avatar-layout-size) - var(--np-avatar-size) * 2);
+      }
     }
   }
@@ -34,6 +47,10 @@
     &-child {
       margin-left: calc(var(--np-avatar-offset) * -1);
+      :dir(rtl) & {
+        margin-right: calc(var(--np-avatar-offset) * -1);
+      }
     }
   }
-}
+}

package/src/avatarLayout/AvatarLayout.tsx CHANGED Viewed

@@ -1,5 +1,6 @@
 import { clsx } from 'clsx';
 import AvatarView, { AvatarViewProps } from '../avatarView';
+import { useDirection } from '../common/hooks';
 type SingleAvatarType = { asset?: AvatarViewProps['children'] } & Omit<
   AvatarViewProps,
@@ -24,6 +25,7 @@ export default function AvatarLayout({
 }: Props) {
   const orientation =
     size === 16 && orientationProp === 'diagonal' ? 'horizontal' : orientationProp;
+  const { isRTL } = useDirection();
   const isDiagonal = orientation === 'diagonal';
   const avatarSize = isDiagonal ? DIAGONAL_LAYOUT_STYLE_CONFIG[size]?.avatarSize : size;
   return avatars.length < 1 ? null : avatars.length === 1 ? (
@@ -47,8 +49,14 @@ export default function AvatarLayout({
           // eslint-disable-next-line react/no-array-index-key
           key={index}
           className={clsx(
-            { [`np-avatar-layout-${orientation}-child`]: index !== 0 },
-            { [`np-avatar-layout-${orientation}-mask`]: index !== avatars.length - 1 },
+            {
+              [`np-avatar-layout-${orientation}-child`]:
+                !isDiagonal && isRTL ? index !== avatars.length - 1 : index !== 0,
+            },
+            {
+              [`np-avatar-layout-${orientation}-mask`]:
+                !isDiagonal && isRTL ? index !== 0 : index !== avatars.length - 1,
+            },
           )}
         >
           <AvatarView

package/src/avatarWrapper/AvatarWrapper.story.tsx CHANGED Viewed

@@ -10,7 +10,7 @@ import AvatarWrapper from './AvatarWrapper';
 export default {
   tags: ['autodocs'],
   component: AvatarWrapper,
-  title: 'Content/AvatarWrapper',
+  title: 'Content/AvatarWrapper (Deprecated)',
 } satisfies Meta<typeof AvatarWrapper>;
 type Story = StoryObj<typeof AvatarWrapper>;

package/src/badge/Badge.story.tsx CHANGED Viewed

@@ -11,7 +11,7 @@ import Badge from './Badge';
 export default {
   tags: ['autodocs'],
   component: Badge,
-  title: 'Content/Badge',
+  title: 'Content/Badge (Deprecated)',
   excludeStories: ['ExampleBadgeCss'],
 };

package/src/button/Button.accessibility.docs.mdx ADDED Viewed

@@ -0,0 +1,103 @@
+import { Meta, Canvas, Source } from '@storybook/blocks';
+import { NavigationOption } from '..';
+import { Bulb } from '@transferwise/icons';
+import * as stories from './Button.story';
+<Meta title="Actions/Button/Accessibility" />
+# Accessibility
+Given the `Button` is a widely used and highly sensitive component, there are some instances where care is required to ensure inclusive and accessible experience.
+<NavigationOption
+  media={<Bulb size={24} />}
+  title="Design guidance"
+  content="Before you start, familiarise yourself with the dedicated accessibility documentation."
+  href="https://wise.design/components/button#accessibility"
+/>
+<br />
+<br />
+## Anchors
+While it's technically possible to make the `Button` component render as a link by using `as="a"` on its own, and there are use cases for it, this will not result in a semantic HTML anchor. For that to happen, you should set `href` instead – it will automatically render the component as a semantic anchor.
+<Source dark code={`
+// ⚠️ use with care
+<Button v2 as="a">Inaccessible anchor</Button>
+// ✅ semantic link
+<Button v2 href="https://wise.com">
+  Accessible anchor
+</Button>
+<Button v2 href="https://wise.com" as="a">
+  Accessible anchor
+</Button>
+`}/>
+It's also worth noting that HTML links without a valid `href` are not recognised by RTL via `getByRole('link')`.
+**Additional resources:**
+1. [Deque: Anchors must only be used as links with valid URLs or URL fragments](https://dequeuniversity.com/rules/axe-devtools/4.2/href-no-hash)
+2. [whatwg HTML standard: 4.6.2 Links created by a and area elements](https://html.spec.whatwg.org/multipage/links.html#links-created-by-a-and-area-elements)
+<br />
+## Disabled anchors
+Technically, there's no such thing as disabled HTML anchor and the `disabled` attribute is not recognised on the `<a />`. While the code shown below works in all major screen readers, should be overall considered a last resort and design teams should be encouraged to use it sporadically and consider alternative flows instead.
+<Source
+  dark
+  code={`
+// ⚠️ use with care
+<Button v2 href="https://wise.com" disabled>Emulated disabled anchor</Button>
+`}
+/>
+We're emulating this behaviour by applying a combination of the following:
+1. removing `href` attribute to strip out the link's semantics.
+2. adding `role="link"` to make it recognisable and discoverable by the assistive tech.
+3. setting `aria-disabled="true"` to inform assistive tech of the component state.
+**Additional resources:**
+1. [Scott O'Hara: Disabling a link](https://www.scottohara.me/blog/2021/05/28/disabled-links.html)
+2. [CSS-Tricks: How to Disable Links](https://css-tricks.com/how-to-disable-links/)
+<br />
+## Loading state
+While it might be tempting to use the native, HTML `disabled` attribute for the `loading` state, it would result in a component that is completely invisible to the assistive tech – not focusable and not parsable – entirely inaccessible experience for users relying on such tools.
+Instead, we're relying on ARIA attributes and roles to ensure the `Button` is focusable, correctly announced as "busy" and offering visual cue different to the disabled state.
+<Source dark code={`
+// ❌  do not use
+<Button v2 loading disabled>Invisible</Button>
+// ✅ semantic loading button
+<Button v2 loading>
+  Proper loading state
+</Button>
+`}/>
+`Button` instances rendered as HTML anchors, follow the strategy described in the [Disabled anchors](#disabled-anchors) section above.
+<br />
+## Working with addons (accessories)
+One of the core requirements of accessible experience is that all users have equal access to the same content, no matter how they interact with our products.
+This becomes troublesome for more complex instances of the `Button` such as those with contentful icons or avatars, e.g. those referring to particular currencies, people or action types.
+Exposing separate ARIA labels for such addons would likely become problematic due to syntactic differences between different languages and so instead we recommend using simple `aria-label` attribute to describe given components complete content. Please note, that screen readers will use that text over the visible label
+<Canvas of={stories.AccessibilityAddons} />