npm - @transferwise/components - Versions diffs - 46.99.0 → 46.100.1 - Mend

@transferwise/components 46.99.0 → 46.100.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 (551) hide show

package/build/primitives/PrimitiveButton/PrimitiveButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PrimitiveButton.js","sources":["../../../src/primitives/PrimitiveButton/PrimitiveButton.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type /\nimport React, { forwardRef, useCallback } from 'react';\nimport { clsx } from 'clsx';\nimport { useIntl, MessageDescriptor } from 'react-intl';\nimport messages from '../../i18n/commonMessages/Button.messages';\nimport type { PrimitiveButtonProps } from '.';\n\n/\n The Primitive `PrimitiveButton` component can be used in various parts the Wise Design\n * System internally. It supports different states such as disabled and loading,\n * and provides event handlers for common interactions like click, focus, blur,\n * mouse enter, mouse leave, and keydown.\n \n @see {@link PrimitiveButton} for further information.\n * @see {@link https://storybook.wise.design/?path=/docs/primitive-button--docs\|Storybook Wise Design}\n /\nconst PrimitiveButton = forwardRef<HTMLButtonElement, PrimitiveButtonProps>(\n (\n {\n children,\n className,\n id,\n disabled = false,\n loading = false,\n testId,\n type = 'button',\n onClick,\n onFocus,\n onBlur,\n onMouseEnter,\n onMouseLeave,\n onKeyDown,\n ...props\n },\n ref,\n ) => {\n const intl = useIntl();\n const classNames = clsx(className);\n\n const handleClick = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n if (disabled \|\| loading) {\n event.preventDefault();\n } else {\n onClick?.(event);\n }\n },\n [disabled, loading, onClick],\n );\n\n const handleFocus = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n onFocus?.(event);\n },\n [onFocus],\n );\n\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n onBlur?.(event);\n },\n [onBlur],\n );\n\n const handleMouseEnter = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n onMouseEnter?.(event);\n },\n [onMouseEnter],\n );\n\n const handleMouseLeave = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n onMouseLeave?.(event);\n },\n [onMouseLeave],\n );\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n onKeyDown?.(event);\n },\n [onKeyDown],\n );\n\n /\n The following props are used to manage the `disabled` and `loading`\n * states for the button:\n \n - `aria-disabled`: Communicates to assistive technologies that the button\n * is disabled when it is either disabled or loading.\n * - `aria-label`: Provides an accessible label for the button, using a\n * localized loading message when the button is in a loading state.\n * - `aria-live`: Ensures that updates to the button's content are announced\n * by assistive technologies, set to 'polite' during loading.\n */\n const buttonProps = {\n 'aria-disabled': loading \|\| undefined,\n 'aria-busy': loading \|\| undefined,\n 'aria-label': loading ? intl.formatMessage(messages.loadingAriaLabel) : props['aria-label'],\n 'aria-live': (loading ? 'polite' : 'off') as 'polite' \| 'off' \| 'assertive' \| undefined,\n className: classNames,\n 'data-testid': testId,\n disabled,\n id,\n ref,\n type,\n onBlur: handleBlur,\n onClick: handleClick,\n onFocus: handleFocus,\n onMouseEnter: handleMouseEnter,\n onMouseLeave: handleMouseLeave,\n onKeyDown: handleKeyDown,\n ...props,\n };\n\n return <button {...buttonProps}>{children}</button>;\n },\n);\n\nPrimitiveButton.displayName = 'PrimitiveButton';\n\nexport default PrimitiveButton;\n"],"names":["PrimitiveButton","forwardRef","children","className","id","disabled","loading","testId","type","onClick","onFocus","onBlur","onMouseEnter","onMouseLeave","onKeyDown","props","ref","intl","useIntl","classNames","clsx","handleClick","useCallback","event","preventDefault","handleFocus","handleBlur","handleMouseEnter","handleMouseLeave","handleKeyDown","buttonProps","undefined","formatMessage","messages","loadingAriaLabel","_jsx","displayName"],"mappings":";;;;;;;;;;AAAA;AAgBA,MAAMA,eAAe,gBAAGC,gBAAU,CAChC,CACE;EACEC,QAAQ;EACRC,SAAS;EACTC,EAAE;AACFC,EAAAA,QAAQ,GAAG,KAAK;AAChBC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;AACNC,EAAAA,IAAI,GAAG,QAAQ;EACfC,OAAO;EACPC,OAAO;EACPC,MAAM;EACNC,YAAY;EACZC,YAAY;EACZC,SAAS;EACT,GAAGC;CACJ,EACDC,GAAG,KACD;AACF,EAAA,MAAMC,IAAI,GAAGC,iBAAO,EAAE;AACtB,EAAA,MAAMC,UAAU,GAAGC,SAAI,CAACjB,SAAS,CAAC;AAElC,EAAA,MAAMkB,WAAW,GAAGC,iBAAW,CAC5BC,KAA0C,IAAI;IAC7C,IAAIlB,QAAQ,IAAIC,OAAO,EAAE;MACvBiB,KAAK,CAACC,cAAc,EAAE;AACxB,~~KAAC~~,MAAM;MACLf,OAAO,GAAGc,KAAK,CAAC;AAClB;~~GACD~~,EACD,CAAClB,QAAQ,EAAEC,OAAO,EAAEG,OAAO,CAAC,CAC7B;AAED,EAAA,MAAMgB,WAAW,GAAGH,iBAAW,CAC5BC,KAA0C,IAAI;IAC7Cb,OAAO,GAAGa,KAAK,CAAC;AAClB,~~GAAC~~,EACD,CAACb,OAAO,CAAC,CACV;AAED,EAAA,MAAMgB,UAAU,GAAGJ,iBAAW,CAC3BC,KAA0C,IAAI;IAC7CZ,MAAM,GAAGY,KAAK,CAAC;AACjB,~~GAAC~~,EACD,CAACZ,MAAM,CAAC,CACT;AAED,EAAA,MAAMgB,gBAAgB,GAAGL,iBAAW,CACjCC,KAA0C,IAAI;IAC7CX,YAAY,GAAGW,KAAK,CAAC;AACvB,~~GAAC~~,EACD,CAACX,YAAY,CAAC,CACf;AAED,EAAA,MAAMgB,gBAAgB,GAAGN,iBAAW,CACjCC,KAA0C,IAAI;IAC7CV,YAAY,GAAGU,KAAK,CAAC;AACvB,~~GAAC~~,EACD,CAACV,YAAY,CAAC,CACf;AAED,EAAA,MAAMgB,aAAa,GAAGP,iBAAW,CAC9BC,KAA6C,IAAI;IAChDT,SAAS,GAAGS,KAAK,CAAC;AACpB,~~GAAC~~,EACD,CAACT,SAAS,CAAC,CACZ;AAED;;;;;;;;;;AAUG;AACH,EAAA,MAAMgB,WAAW,GAAG;IAClB,eAAe,EAAExB,OAAO,IAAIyB,SAAS;IACrC,WAAW,EAAEzB,OAAO,IAAIyB,SAAS;AACjC,IAAA,YAAY,EAAEzB,OAAO,GAAGW,IAAI,CAACe,aAAa,CAACC,uBAAQ,CAACC,gBAAgB,CAAC,GAAGnB,KAAK,CAAC,YAAY,CAAC;AAC3F,IAAA,WAAW,EAAGT,OAAO,GAAG,QAAQ,GAAG,KAAoD;AACvFH,IAAAA,SAAS,EAAEgB,UAAU;AACrB,IAAA,aAAa,EAAEZ,MAAM;IACrBF,QAAQ;IACRD,EAAE;IACFY,GAAG;IACHR,IAAI;AACJG,IAAAA,MAAM,EAAEe,UAAU;AAClBjB,IAAAA,OAAO,EAAEY,WAAW;AACpBX,IAAAA,OAAO,EAAEe,WAAW;AACpBb,IAAAA,YAAY,EAAEe,gBAAgB;AAC9Bd,IAAAA,YAAY,EAAEe,gBAAgB;AAC9Bd,IAAAA,SAAS,EAAEe,aAAa;IACxB,GAAGd;GACJ;AAED,EAAA,oBAAOoB,cAAA,CAAA,QAAA,EAAA;AAAA,IAAA,GAAYL,WAAW;AAAA5B,IAAAA,QAAA,EAAGA;AAAQ,GAAS,CAAC;AACrD,CAAC;AAGHF,eAAe,CAACoC,WAAW,GAAG,iBAAiB;;;;"}
1	+ {"version":3,"file":"PrimitiveButton.js","sources":["../../../src/primitives/PrimitiveButton/PrimitiveButton.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type /\nimport React, { forwardRef, useCallback } from 'react';\nimport { clsx } from 'clsx';\nimport { useIntl, MessageDescriptor } from 'react-intl';\nimport messages from '../../i18n/commonMessages/Button.messages';\nimport type { PrimitiveButtonProps } from '.';\n\n/\n The Primitive `PrimitiveButton` component can be used in various parts the Wise Design\n * System internally. It supports different states such as disabled and loading,\n * and provides event handlers for common interactions like click, focus, blur,\n * mouse enter, mouse leave, and keydown.\n \n @see {@link PrimitiveButton} for further information.\n * @see {@link https://storybook.wise.design/?path=/docs/primitive-button--docs\|Storybook Wise Design}\n /\nconst PrimitiveButton = forwardRef<HTMLButtonElement, PrimitiveButtonProps>(\n (\n {\n children,\n className,\n id,\n disabled = false,\n loading = false,\n testId,\n type = 'button',\n onClick,\n onFocus,\n onBlur,\n onMouseEnter,\n onMouseLeave,\n onKeyDown,\n ...props\n },\n ref,\n ) => {\n const intl = useIntl();\n const classNames = clsx(className);\n\n const handleClick = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n if (disabled \|\| loading) {\n event.preventDefault();\n } else {\n onClick?.(event);\n }\n },\n [disabled, loading, onClick],\n );\n\n const handleFocus = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n onFocus?.(event);\n },\n [onFocus],\n );\n\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n onBlur?.(event);\n },\n [onBlur],\n );\n\n const handleMouseEnter = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n onMouseEnter?.(event);\n },\n [onMouseEnter],\n );\n\n const handleMouseLeave = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n onMouseLeave?.(event);\n },\n [onMouseLeave],\n );\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n onKeyDown?.(event);\n },\n [onKeyDown],\n );\n\n /\n The following props are used to manage the `disabled` and `loading`\n * states for the button:\n \n - `aria-disabled`: Communicates to assistive technologies that the button\n * is disabled when it is either disabled or loading.\n * - `aria-label`: Provides an accessible label for the button, using a\n * localized loading message when the button is in a loading state.\n * - `aria-live`: Ensures that updates to the button's content are announced\n * by assistive technologies, set to 'polite' during loading.\n */\n const buttonProps = {\n 'aria-disabled': loading \|\| undefined,\n 'aria-busy': loading \|\| undefined,\n 'aria-label': loading ? intl.formatMessage(messages.loadingAriaLabel) : props['aria-label'],\n 'aria-live': (loading ? 'polite' : 'off') as 'polite' \| 'off' \| 'assertive' \| undefined,\n className: classNames,\n 'data-testid': testId,\n disabled,\n id,\n ref,\n type,\n onBlur: handleBlur,\n onClick: handleClick,\n onFocus: handleFocus,\n onMouseEnter: handleMouseEnter,\n onMouseLeave: handleMouseLeave,\n onKeyDown: handleKeyDown,\n ...props,\n };\n\n return <button {...buttonProps}>{children}</button>;\n },\n);\n\nPrimitiveButton.displayName = 'PrimitiveButton';\n\nexport default PrimitiveButton;\n"],"names":["PrimitiveButton","forwardRef","children","className","id","disabled","loading","testId","type","onClick","onFocus","onBlur","onMouseEnter","onMouseLeave","onKeyDown","props","ref","intl","useIntl","classNames","clsx","handleClick","useCallback","event","preventDefault","handleFocus","handleBlur","handleMouseEnter","handleMouseLeave","handleKeyDown","buttonProps","undefined","formatMessage","messages","loadingAriaLabel","_jsx","displayName"],"mappings":";;;;;;;;;;AAAA;AAgBA,MAAMA,eAAe,gBAAGC,gBAAU,CAChC,CACE;EACEC,QAAQ;EACRC,SAAS;EACTC,EAAE;AACFC,EAAAA,QAAQ,GAAG,KAAK;AAChBC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;AACNC,EAAAA,IAAI,GAAG,QAAQ;EACfC,OAAO;EACPC,OAAO;EACPC,MAAM;EACNC,YAAY;EACZC,YAAY;EACZC,SAAS;EACT,GAAGC;CACJ,EACDC,GAAG,KACD;AACF,EAAA,MAAMC,IAAI,GAAGC,iBAAO,EAAE;AACtB,EAAA,MAAMC,UAAU,GAAGC,SAAI,CAACjB,SAAS,CAAC;AAElC,EAAA,MAAMkB,WAAW,GAAGC,iBAAW,CAC5BC,KAA0C,IAAI;IAC7C,IAAIlB,QAAQ,IAAIC,OAAO,EAAE;MACvBiB,KAAK,CAACC,cAAc,EAAE;AACxB,IAAA,CAAC,MAAM;MACLf,OAAO,GAAGc,KAAK,CAAC;AAClB,IAAA;EACF,CAAC,EACD,CAAClB,QAAQ,EAAEC,OAAO,EAAEG,OAAO,CAAC,CAC7B;AAED,EAAA,MAAMgB,WAAW,GAAGH,iBAAW,CAC5BC,KAA0C,IAAI;IAC7Cb,OAAO,GAAGa,KAAK,CAAC;AAClB,EAAA,CAAC,EACD,CAACb,OAAO,CAAC,CACV;AAED,EAAA,MAAMgB,UAAU,GAAGJ,iBAAW,CAC3BC,KAA0C,IAAI;IAC7CZ,MAAM,GAAGY,KAAK,CAAC;AACjB,EAAA,CAAC,EACD,CAACZ,MAAM,CAAC,CACT;AAED,EAAA,MAAMgB,gBAAgB,GAAGL,iBAAW,CACjCC,KAA0C,IAAI;IAC7CX,YAAY,GAAGW,KAAK,CAAC;AACvB,EAAA,CAAC,EACD,CAACX,YAAY,CAAC,CACf;AAED,EAAA,MAAMgB,gBAAgB,GAAGN,iBAAW,CACjCC,KAA0C,IAAI;IAC7CV,YAAY,GAAGU,KAAK,CAAC;AACvB,EAAA,CAAC,EACD,CAACV,YAAY,CAAC,CACf;AAED,EAAA,MAAMgB,aAAa,GAAGP,iBAAW,CAC9BC,KAA6C,IAAI;IAChDT,SAAS,GAAGS,KAAK,CAAC;AACpB,EAAA,CAAC,EACD,CAACT,SAAS,CAAC,CACZ;AAED;;;;;;;;;;AAUG;AACH,EAAA,MAAMgB,WAAW,GAAG;IAClB,eAAe,EAAExB,OAAO,IAAIyB,SAAS;IACrC,WAAW,EAAEzB,OAAO,IAAIyB,SAAS;AACjC,IAAA,YAAY,EAAEzB,OAAO,GAAGW,IAAI,CAACe,aAAa,CAACC,uBAAQ,CAACC,gBAAgB,CAAC,GAAGnB,KAAK,CAAC,YAAY,CAAC;AAC3F,IAAA,WAAW,EAAGT,OAAO,GAAG,QAAQ,GAAG,KAAoD;AACvFH,IAAAA,SAAS,EAAEgB,UAAU;AACrB,IAAA,aAAa,EAAEZ,MAAM;IACrBF,QAAQ;IACRD,EAAE;IACFY,GAAG;IACHR,IAAI;AACJG,IAAAA,MAAM,EAAEe,UAAU;AAClBjB,IAAAA,OAAO,EAAEY,WAAW;AACpBX,IAAAA,OAAO,EAAEe,WAAW;AACpBb,IAAAA,YAAY,EAAEe,gBAAgB;AAC9Bd,IAAAA,YAAY,EAAEe,gBAAgB;AAC9Bd,IAAAA,SAAS,EAAEe,aAAa;IACxB,GAAGd;GACJ;AAED,EAAA,oBAAOoB,cAAA,CAAA,QAAA,EAAA;AAAA,IAAA,GAAYL,WAAW;AAAA5B,IAAAA,QAAA,EAAGA;AAAQ,GAAS,CAAC;AACrD,CAAC;AAGHF,eAAe,CAACoC,WAAW,GAAG,iBAAiB;;;;"}

package/build/primitives/PrimitiveButton/PrimitiveButton.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PrimitiveButton.mjs","sources":["../../../src/primitives/PrimitiveButton/PrimitiveButton.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type /\nimport React, { forwardRef, useCallback } from 'react';\nimport { clsx } from 'clsx';\nimport { useIntl, MessageDescriptor } from 'react-intl';\nimport messages from '../../i18n/commonMessages/Button.messages';\nimport type { PrimitiveButtonProps } from '.';\n\n/\n The Primitive `PrimitiveButton` component can be used in various parts the Wise Design\n * System internally. It supports different states such as disabled and loading,\n * and provides event handlers for common interactions like click, focus, blur,\n * mouse enter, mouse leave, and keydown.\n \n @see {@link PrimitiveButton} for further information.\n * @see {@link https://storybook.wise.design/?path=/docs/primitive-button--docs\|Storybook Wise Design}\n /\nconst PrimitiveButton = forwardRef<HTMLButtonElement, PrimitiveButtonProps>(\n (\n {\n children,\n className,\n id,\n disabled = false,\n loading = false,\n testId,\n type = 'button',\n onClick,\n onFocus,\n onBlur,\n onMouseEnter,\n onMouseLeave,\n onKeyDown,\n ...props\n },\n ref,\n ) => {\n const intl = useIntl();\n const classNames = clsx(className);\n\n const handleClick = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n if (disabled \|\| loading) {\n event.preventDefault();\n } else {\n onClick?.(event);\n }\n },\n [disabled, loading, onClick],\n );\n\n const handleFocus = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n onFocus?.(event);\n },\n [onFocus],\n );\n\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n onBlur?.(event);\n },\n [onBlur],\n );\n\n const handleMouseEnter = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n onMouseEnter?.(event);\n },\n [onMouseEnter],\n );\n\n const handleMouseLeave = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n onMouseLeave?.(event);\n },\n [onMouseLeave],\n );\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n onKeyDown?.(event);\n },\n [onKeyDown],\n );\n\n /\n The following props are used to manage the `disabled` and `loading`\n * states for the button:\n \n - `aria-disabled`: Communicates to assistive technologies that the button\n * is disabled when it is either disabled or loading.\n * - `aria-label`: Provides an accessible label for the button, using a\n * localized loading message when the button is in a loading state.\n * - `aria-live`: Ensures that updates to the button's content are announced\n * by assistive technologies, set to 'polite' during loading.\n */\n const buttonProps = {\n 'aria-disabled': loading \|\| undefined,\n 'aria-busy': loading \|\| undefined,\n 'aria-label': loading ? intl.formatMessage(messages.loadingAriaLabel) : props['aria-label'],\n 'aria-live': (loading ? 'polite' : 'off') as 'polite' \| 'off' \| 'assertive' \| undefined,\n className: classNames,\n 'data-testid': testId,\n disabled,\n id,\n ref,\n type,\n onBlur: handleBlur,\n onClick: handleClick,\n onFocus: handleFocus,\n onMouseEnter: handleMouseEnter,\n onMouseLeave: handleMouseLeave,\n onKeyDown: handleKeyDown,\n ...props,\n };\n\n return <button {...buttonProps}>{children}</button>;\n },\n);\n\nPrimitiveButton.displayName = 'PrimitiveButton';\n\nexport default PrimitiveButton;\n"],"names":["PrimitiveButton","forwardRef","children","className","id","disabled","loading","testId","type","onClick","onFocus","onBlur","onMouseEnter","onMouseLeave","onKeyDown","props","ref","intl","useIntl","classNames","clsx","handleClick","useCallback","event","preventDefault","handleFocus","handleBlur","handleMouseEnter","handleMouseLeave","handleKeyDown","buttonProps","undefined","formatMessage","messages","loadingAriaLabel","_jsx","displayName"],"mappings":";;;;;;AAAA;AAgBA,MAAMA,eAAe,gBAAGC,UAAU,CAChC,CACE;EACEC,QAAQ;EACRC,SAAS;EACTC,EAAE;AACFC,EAAAA,QAAQ,GAAG,KAAK;AAChBC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;AACNC,EAAAA,IAAI,GAAG,QAAQ;EACfC,OAAO;EACPC,OAAO;EACPC,MAAM;EACNC,YAAY;EACZC,YAAY;EACZC,SAAS;EACT,GAAGC;CACJ,EACDC,GAAG,KACD;AACF,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE;AACtB,EAAA,MAAMC,UAAU,GAAGC,IAAI,CAACjB,SAAS,CAAC;AAElC,EAAA,MAAMkB,WAAW,GAAGC,WAAW,CAC5BC,KAA0C,IAAI;IAC7C,IAAIlB,QAAQ,IAAIC,OAAO,EAAE;MACvBiB,KAAK,CAACC,cAAc,EAAE;AACxB,~~KAAC~~,MAAM;MACLf,OAAO,GAAGc,KAAK,CAAC;AAClB;~~GACD~~,EACD,CAAClB,QAAQ,EAAEC,OAAO,EAAEG,OAAO,CAAC,CAC7B;AAED,EAAA,MAAMgB,WAAW,GAAGH,WAAW,CAC5BC,KAA0C,IAAI;IAC7Cb,OAAO,GAAGa,KAAK,CAAC;AAClB,~~GAAC~~,EACD,CAACb,OAAO,CAAC,CACV;AAED,EAAA,MAAMgB,UAAU,GAAGJ,WAAW,CAC3BC,KAA0C,IAAI;IAC7CZ,MAAM,GAAGY,KAAK,CAAC;AACjB,~~GAAC~~,EACD,CAACZ,MAAM,CAAC,CACT;AAED,EAAA,MAAMgB,gBAAgB,GAAGL,WAAW,CACjCC,KAA0C,IAAI;IAC7CX,YAAY,GAAGW,KAAK,CAAC;AACvB,~~GAAC~~,EACD,CAACX,YAAY,CAAC,CACf;AAED,EAAA,MAAMgB,gBAAgB,GAAGN,WAAW,CACjCC,KAA0C,IAAI;IAC7CV,YAAY,GAAGU,KAAK,CAAC;AACvB,~~GAAC~~,EACD,CAACV,YAAY,CAAC,CACf;AAED,EAAA,MAAMgB,aAAa,GAAGP,WAAW,CAC9BC,KAA6C,IAAI;IAChDT,SAAS,GAAGS,KAAK,CAAC;AACpB,~~GAAC~~,EACD,CAACT,SAAS,CAAC,CACZ;AAED;;;;;;;;;;AAUG;AACH,EAAA,MAAMgB,WAAW,GAAG;IAClB,eAAe,EAAExB,OAAO,IAAIyB,SAAS;IACrC,WAAW,EAAEzB,OAAO,IAAIyB,SAAS;AACjC,IAAA,YAAY,EAAEzB,OAAO,GAAGW,IAAI,CAACe,aAAa,CAACC,QAAQ,CAACC,gBAAgB,CAAC,GAAGnB,KAAK,CAAC,YAAY,CAAC;AAC3F,IAAA,WAAW,EAAGT,OAAO,GAAG,QAAQ,GAAG,KAAoD;AACvFH,IAAAA,SAAS,EAAEgB,UAAU;AACrB,IAAA,aAAa,EAAEZ,MAAM;IACrBF,QAAQ;IACRD,EAAE;IACFY,GAAG;IACHR,IAAI;AACJG,IAAAA,MAAM,EAAEe,UAAU;AAClBjB,IAAAA,OAAO,EAAEY,WAAW;AACpBX,IAAAA,OAAO,EAAEe,WAAW;AACpBb,IAAAA,YAAY,EAAEe,gBAAgB;AAC9Bd,IAAAA,YAAY,EAAEe,gBAAgB;AAC9Bd,IAAAA,SAAS,EAAEe,aAAa;IACxB,GAAGd;GACJ;AAED,EAAA,oBAAOoB,GAAA,CAAA,QAAA,EAAA;AAAA,IAAA,GAAYL,WAAW;AAAA5B,IAAAA,QAAA,EAAGA;AAAQ,GAAS,CAAC;AACrD,CAAC;AAGHF,eAAe,CAACoC,WAAW,GAAG,iBAAiB;;;;"}
1	+ {"version":3,"file":"PrimitiveButton.mjs","sources":["../../../src/primitives/PrimitiveButton/PrimitiveButton.tsx"],"sourcesContent":["/* eslint-disable react/button-has-type /\nimport React, { forwardRef, useCallback } from 'react';\nimport { clsx } from 'clsx';\nimport { useIntl, MessageDescriptor } from 'react-intl';\nimport messages from '../../i18n/commonMessages/Button.messages';\nimport type { PrimitiveButtonProps } from '.';\n\n/\n The Primitive `PrimitiveButton` component can be used in various parts the Wise Design\n * System internally. It supports different states such as disabled and loading,\n * and provides event handlers for common interactions like click, focus, blur,\n * mouse enter, mouse leave, and keydown.\n \n @see {@link PrimitiveButton} for further information.\n * @see {@link https://storybook.wise.design/?path=/docs/primitive-button--docs\|Storybook Wise Design}\n /\nconst PrimitiveButton = forwardRef<HTMLButtonElement, PrimitiveButtonProps>(\n (\n {\n children,\n className,\n id,\n disabled = false,\n loading = false,\n testId,\n type = 'button',\n onClick,\n onFocus,\n onBlur,\n onMouseEnter,\n onMouseLeave,\n onKeyDown,\n ...props\n },\n ref,\n ) => {\n const intl = useIntl();\n const classNames = clsx(className);\n\n const handleClick = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n if (disabled \|\| loading) {\n event.preventDefault();\n } else {\n onClick?.(event);\n }\n },\n [disabled, loading, onClick],\n );\n\n const handleFocus = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n onFocus?.(event);\n },\n [onFocus],\n );\n\n const handleBlur = useCallback(\n (event: React.FocusEvent<HTMLButtonElement>) => {\n onBlur?.(event);\n },\n [onBlur],\n );\n\n const handleMouseEnter = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n onMouseEnter?.(event);\n },\n [onMouseEnter],\n );\n\n const handleMouseLeave = useCallback(\n (event: React.MouseEvent<HTMLButtonElement>) => {\n onMouseLeave?.(event);\n },\n [onMouseLeave],\n );\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n onKeyDown?.(event);\n },\n [onKeyDown],\n );\n\n /\n The following props are used to manage the `disabled` and `loading`\n * states for the button:\n \n - `aria-disabled`: Communicates to assistive technologies that the button\n * is disabled when it is either disabled or loading.\n * - `aria-label`: Provides an accessible label for the button, using a\n * localized loading message when the button is in a loading state.\n * - `aria-live`: Ensures that updates to the button's content are announced\n * by assistive technologies, set to 'polite' during loading.\n */\n const buttonProps = {\n 'aria-disabled': loading \|\| undefined,\n 'aria-busy': loading \|\| undefined,\n 'aria-label': loading ? intl.formatMessage(messages.loadingAriaLabel) : props['aria-label'],\n 'aria-live': (loading ? 'polite' : 'off') as 'polite' \| 'off' \| 'assertive' \| undefined,\n className: classNames,\n 'data-testid': testId,\n disabled,\n id,\n ref,\n type,\n onBlur: handleBlur,\n onClick: handleClick,\n onFocus: handleFocus,\n onMouseEnter: handleMouseEnter,\n onMouseLeave: handleMouseLeave,\n onKeyDown: handleKeyDown,\n ...props,\n };\n\n return <button {...buttonProps}>{children}</button>;\n },\n);\n\nPrimitiveButton.displayName = 'PrimitiveButton';\n\nexport default PrimitiveButton;\n"],"names":["PrimitiveButton","forwardRef","children","className","id","disabled","loading","testId","type","onClick","onFocus","onBlur","onMouseEnter","onMouseLeave","onKeyDown","props","ref","intl","useIntl","classNames","clsx","handleClick","useCallback","event","preventDefault","handleFocus","handleBlur","handleMouseEnter","handleMouseLeave","handleKeyDown","buttonProps","undefined","formatMessage","messages","loadingAriaLabel","_jsx","displayName"],"mappings":";;;;;;AAAA;AAgBA,MAAMA,eAAe,gBAAGC,UAAU,CAChC,CACE;EACEC,QAAQ;EACRC,SAAS;EACTC,EAAE;AACFC,EAAAA,QAAQ,GAAG,KAAK;AAChBC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;AACNC,EAAAA,IAAI,GAAG,QAAQ;EACfC,OAAO;EACPC,OAAO;EACPC,MAAM;EACNC,YAAY;EACZC,YAAY;EACZC,SAAS;EACT,GAAGC;CACJ,EACDC,GAAG,KACD;AACF,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE;AACtB,EAAA,MAAMC,UAAU,GAAGC,IAAI,CAACjB,SAAS,CAAC;AAElC,EAAA,MAAMkB,WAAW,GAAGC,WAAW,CAC5BC,KAA0C,IAAI;IAC7C,IAAIlB,QAAQ,IAAIC,OAAO,EAAE;MACvBiB,KAAK,CAACC,cAAc,EAAE;AACxB,IAAA,CAAC,MAAM;MACLf,OAAO,GAAGc,KAAK,CAAC;AAClB,IAAA;EACF,CAAC,EACD,CAAClB,QAAQ,EAAEC,OAAO,EAAEG,OAAO,CAAC,CAC7B;AAED,EAAA,MAAMgB,WAAW,GAAGH,WAAW,CAC5BC,KAA0C,IAAI;IAC7Cb,OAAO,GAAGa,KAAK,CAAC;AAClB,EAAA,CAAC,EACD,CAACb,OAAO,CAAC,CACV;AAED,EAAA,MAAMgB,UAAU,GAAGJ,WAAW,CAC3BC,KAA0C,IAAI;IAC7CZ,MAAM,GAAGY,KAAK,CAAC;AACjB,EAAA,CAAC,EACD,CAACZ,MAAM,CAAC,CACT;AAED,EAAA,MAAMgB,gBAAgB,GAAGL,WAAW,CACjCC,KAA0C,IAAI;IAC7CX,YAAY,GAAGW,KAAK,CAAC;AACvB,EAAA,CAAC,EACD,CAACX,YAAY,CAAC,CACf;AAED,EAAA,MAAMgB,gBAAgB,GAAGN,WAAW,CACjCC,KAA0C,IAAI;IAC7CV,YAAY,GAAGU,KAAK,CAAC;AACvB,EAAA,CAAC,EACD,CAACV,YAAY,CAAC,CACf;AAED,EAAA,MAAMgB,aAAa,GAAGP,WAAW,CAC9BC,KAA6C,IAAI;IAChDT,SAAS,GAAGS,KAAK,CAAC;AACpB,EAAA,CAAC,EACD,CAACT,SAAS,CAAC,CACZ;AAED;;;;;;;;;;AAUG;AACH,EAAA,MAAMgB,WAAW,GAAG;IAClB,eAAe,EAAExB,OAAO,IAAIyB,SAAS;IACrC,WAAW,EAAEzB,OAAO,IAAIyB,SAAS;AACjC,IAAA,YAAY,EAAEzB,OAAO,GAAGW,IAAI,CAACe,aAAa,CAACC,QAAQ,CAACC,gBAAgB,CAAC,GAAGnB,KAAK,CAAC,YAAY,CAAC;AAC3F,IAAA,WAAW,EAAGT,OAAO,GAAG,QAAQ,GAAG,KAAoD;AACvFH,IAAAA,SAAS,EAAEgB,UAAU;AACrB,IAAA,aAAa,EAAEZ,MAAM;IACrBF,QAAQ;IACRD,EAAE;IACFY,GAAG;IACHR,IAAI;AACJG,IAAAA,MAAM,EAAEe,UAAU;AAClBjB,IAAAA,OAAO,EAAEY,WAAW;AACpBX,IAAAA,OAAO,EAAEe,WAAW;AACpBb,IAAAA,YAAY,EAAEe,gBAAgB;AAC9Bd,IAAAA,YAAY,EAAEe,gBAAgB;AAC9Bd,IAAAA,SAAS,EAAEe,aAAa;IACxB,GAAGd;GACJ;AAED,EAAA,oBAAOoB,GAAA,CAAA,QAAA,EAAA;AAAA,IAAA,GAAYL,WAAW;AAAA5B,IAAAA,QAAA,EAAGA;AAAQ,GAAS,CAAC;AACrD,CAAC;AAGHF,eAAe,CAACoC,WAAW,GAAG,iBAAiB;;;;"}

package/build/processIndicator/ProcessIndicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProcessIndicator.js","sources":["../../src/processIndicator/ProcessIndicator.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { Component } from 'react';\n\nimport { Status, Size } from '../common';\n\nconst radius = { xxs: 6, xs: 11, sm: 22, xl: 61 };\n\nconst ANIMATION_DURATION_IN_MS = 1500;\n\nexport type ProcessIndicatorStatus =\n `${Status.PROCESSING \| Status.FAILED \| Status.SUCCEEDED \| Status.HIDDEN}`;\n\nexport interface ProcessIndicatorProps {\n status?: ProcessIndicatorStatus;\n size?: 'xxs' \| `${Size.EXTRA_SMALL \| Size.SMALL \| Size.EXTRA_LARGE}`;\n className?: string;\n 'data-testid'?: string;\n onAnimationCompleted?: (status: ProcessIndicatorStatus) => void;\n}\n\ntype ProcessIndicatorState = Required<Pick<ProcessIndicatorProps, 'status' \| 'size'>>;\n\nexport default class ProcessIndicator extends Component<\n ProcessIndicatorProps,\n ProcessIndicatorState\n> {\n declare props: ProcessIndicatorProps &\n Required<Pick<ProcessIndicatorProps, keyof typeof ProcessIndicator.defaultProps>>;\n\n static defaultProps = {\n status: 'processing',\n size: 'sm',\n } satisfies Partial<ProcessIndicatorProps>;\n\n interval = 0;\n timeout = 0;\n\n constructor(props: ProcessIndicator['props']) {\n super(props);\n this.state = {\n status: props.status,\n size: props.size,\n };\n }\n\n /*\n Create interval for animation duration (1500ms)\n * Update state only at the end of every interval\n * (end of animation loop) if props changed before end of animation\n /\n componentDidMount() {\n this.interval = window.setInterval(() => {\n const { status: targetStatus, size: targetSize, onAnimationCompleted } = this.props;\n const { status: currentStatus, size: currentSize } = this.state;\n\n if (currentStatus !== targetStatus) {\n this.setState({ status: targetStatus }, () => {\n if (onAnimationCompleted) {\n this.timeout = window.setTimeout(() => {\n onAnimationCompleted(targetStatus);\n }, ANIMATION_DURATION_IN_MS);\n }\n });\n }\n\n if (currentSize !== targetSize) {\n this.setState({ size: targetSize });\n }\n }, ANIMATION_DURATION_IN_MS);\n }\n\n /\n Only trigger render if comopnent's state got\n * updated from interval callback\n */\n shouldComponentUpdate(nextProps: ProcessIndicator['props'], nextState: ProcessIndicatorState) {\n const isSameStatus = nextProps.status === nextState.status;\n const isSameSize = nextProps.size === nextState.size;\n\n return isSameStatus && isSameSize;\n }\n\n // Clear interval before destroying component\n componentWillUnmount() {\n window.clearInterval(this.interval);\n window.clearTimeout(this.timeout);\n }\n\n render() {\n const { className, 'data-testid': dataTestId } = this.props;\n const { size, status } = this.state;\n const classes = clsx(`process process-${size}`, className, {\n [`process-danger`]: status === Status.FAILED,\n [`process-stopped`]: status === Status.HIDDEN,\n [`process-success`]: status === Status.SUCCEEDED,\n });\n\n return (\n <span className={classes} data-testid={dataTestId}>\n <span className=\"process-icon-container\">\n <span className=\"process-icon-horizontal\" />\n <span className=\"process-icon-vertical\" />\n </span>\n <svg xmlns=\"http://www.w3.org/2000/svg\">\n <circle className=\"process-circle\" cx=\"50%\" cy=\"50%\" r={radius[size]} fillOpacity=\"0.0\" />\n </svg>\n </span>\n );\n }\n}\n"],"names":["radius","xxs","xs","sm","xl","ANIMATION_DURATION_IN_MS","ProcessIndicator","Component","defaultProps","status","size","interval","timeout","constructor","props","state","componentDidMount","window","setInterval","targetStatus","targetSize","onAnimationCompleted","currentStatus","currentSize","setState","setTimeout","shouldComponentUpdate","nextProps","nextState","isSameStatus","isSameSize","componentWillUnmount","clearInterval","clearTimeout","render","className","dataTestId","classes","clsx","Status","FAILED","HIDDEN","SUCCEEDED","_jsxs","children","_jsx","xmlns","cx","cy","r","fillOpacity"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,MAAMA,MAAM,GAAG;AAAEC,EAAAA,GAAG,EAAE,CAAC;AAAEC,EAAAA,EAAE,EAAE,EAAE;AAAEC,EAAAA,EAAE,EAAE,EAAE;AAAEC,EAAAA,EAAE,EAAE;CAAI;AAEjD,MAAMC,wBAAwB,GAAG,IAAI;~~AAehB~~,~~MAAAC~~,gBAAiB,SAAQC,eAG7C,CAAA;AAIC,EAAA,OAAOC,YAAY,GAAG;AACpBC,IAAAA,MAAM,EAAE,YAAY;AACpBC,IAAAA,IAAI,EAAE;GACkC;AAE1CC,EAAAA,QAAQ,GAAG,CAAC;AACZC,EAAAA,OAAO,GAAG,CAAC;EAEXC,WAAAA,CAAYC,KAAgC,EAAA;IAC1C,KAAK,CAACA,KAAK,CAAC;IACZ,IAAI,CAACC,KAAK,GAAG;MACXN,MAAM,EAAEK,KAAK,CAACL,MAAM;MACpBC,IAAI,EAAEI,KAAK,CAACJ;KACb;AACH;AAEA;;;;AAIG;AACHM,EAAAA,iBAAiBA,GAAA;AACf,IAAA,IAAI,CAACL,QAAQ,GAAGM,MAAM,CAACC,WAAW,CAAC,MAAK;MACtC,MAAM;AAAET,QAAAA,MAAM,EAAEU,YAAY;AAAET,QAAAA,IAAI,EAAEU,UAAU;AAAEC,QAAAA;OAAsB,GAAG,IAAI,CAACP,KAAK;MACnF,MAAM;AAAEL,QAAAA,MAAM,EAAEa,aAAa;AAAEZ,QAAAA,IAAI,EAAEa;OAAa,GAAG,IAAI,CAACR,KAAK;MAE/D,IAAIO,aAAa,KAAKH,YAAY,EAAE;QAClC,IAAI,CAACK,QAAQ,CAAC;AAAEf,UAAAA,MAAM,EAAEU;AAAY,SAAE,EAAE,MAAK;AAC3C,UAAA,IAAIE,oBAAoB,EAAE;AACxB,YAAA,IAAI,CAACT,OAAO,GAAGK,MAAM,CAACQ,UAAU,CAAC,MAAK;cACpCJ,oBAAoB,CAACF,YAAY,CAAC;~~aACnC~~,EAAEd,wBAAwB,CAAC;AAC9B;AACF,~~SAAC~~,CAAC;AACJ;MAEA,IAAIkB,WAAW,KAAKH,UAAU,EAAE;QAC9B,IAAI,CAACI,QAAQ,CAAC;AAAEd,UAAAA,IAAI,EAAEU;~~AAAY~~,~~SAAA~~,CAAC;AACrC;~~KACD~~,EAAEf,wBAAwB,CAAC;AAC9B;AAEA;;;AAGG;AACHqB,EAAAA,qBAAqBA,CAACC,SAAoC,EAAEC,SAAgC,EAAA;IAC1F,MAAMC,YAAY,GAAGF,SAAS,CAAClB,MAAM,KAAKmB,SAAS,CAACnB,MAAM;IAC1D,MAAMqB,UAAU,GAAGH,SAAS,CAACjB,IAAI,KAAKkB,SAAS,CAAClB,IAAI;IAEpD,OAAOmB,YAAY,IAAIC,UAAU;AACnC;AAEA;AACAC,EAAAA,oBAAoBA,GAAA;AAClBd,IAAAA,MAAM,CAACe,aAAa,CAAC,IAAI,CAACrB,QAAQ,CAAC;AACnCM,IAAAA,MAAM,CAACgB,YAAY,CAAC,IAAI,CAACrB,OAAO,CAAC;AACnC;AAEAsB,EAAAA,MAAMA,GAAA;IACJ,MAAM;MAAEC,SAAS;AAAE,MAAA,aAAa,EAAEC;KAAY,GAAG,IAAI,CAACtB,KAAK;IAC3D,MAAM;MAAEJ,IAAI;AAAED,cAAAA;KAAQ,GAAG,IAAI,CAACM,KAAK;IACnC,MAAMsB,OAAO,GAAGC,SAAI,CAAC,mBAAmB5B,IAAI,CAAA,CAAE,EAAEyB,SAAS,EAAE;AACzD,MAAA,CAAC,gBAAgB,GAAG1B,QAAM,KAAK8B,aAAM,CAACC,MAAM;AAC5C,MAAA,CAAC,iBAAiB,GAAG/B,QAAM,KAAK8B,aAAM,CAACE,MAAM;AAC7C,MAAA,CAAC,~~CAAiB~~,eAAA,~~CAAA~~,GAAGhC,QAAM,KAAK8B,aAAM,CAACG;AACxC,KAAA,CAAC;AAEF,IAAA,oBACEC,eAAA,CAAA,MAAA,EAAA;AAAMR,MAAAA,SAAS,EAAEE,OAAQ;AAAC,MAAA,aAAA,EAAaD,UAAW;AAAAQ,MAAAA,QAAA,gBAChDD,eAAA,CAAA,MAAA,EAAA;AAAMR,QAAAA,SAAS,EAAC,wBAAwB;AAAAS,QAAAA,QAAA,gBACtCC,cAAA,CAAA,MAAA,EAAA;AAAMV,UAAAA,SAAS,EAAC;~~SAChB~~,~~CAAA~~,eAAAU,cAAA,CAAA,MAAA,EAAA;AAAMV,UAAAA,SAAS,EAAC;AAAuB,~~SACzC~~,~~CAAA~~;OAAM,CACN,eAAAU,cAAA,CAAA,KAAA,EAAA;AAAKC,QAAAA,KAAK,EAAC,4BAA4B;AAAAF,QAAAA,QAAA,eACrCC,cAAA,CAAA,QAAA,EAAA;AAAQV,UAAAA,SAAS,EAAC,gBAAgB;AAACY,UAAAA,EAAE,EAAC,KAAK;AAACC,UAAAA,EAAE,EAAC,KAAK;AAACC,UAAAA,CAAC,EAAEjD,MAAM,CAACU,IAAI,CAAE;AAACwC,UAAAA,WAAW,EAAC;~~SACpF~~;~~AAAA~~,OAAK,CACP;AAAA,KAAM,CAAC;AAEX;;;;;"}
1	+ {"version":3,"file":"ProcessIndicator.js","sources":["../../src/processIndicator/ProcessIndicator.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { Component } from 'react';\n\nimport { Status, Size } from '../common';\n\nconst radius = { xxs: 6, xs: 11, sm: 22, xl: 61 };\n\nconst ANIMATION_DURATION_IN_MS = 1500;\n\nexport type ProcessIndicatorStatus =\n `${Status.PROCESSING \| Status.FAILED \| Status.SUCCEEDED \| Status.HIDDEN}`;\n\nexport interface ProcessIndicatorProps {\n status?: ProcessIndicatorStatus;\n size?: 'xxs' \| `${Size.EXTRA_SMALL \| Size.SMALL \| Size.EXTRA_LARGE}`;\n className?: string;\n 'data-testid'?: string;\n onAnimationCompleted?: (status: ProcessIndicatorStatus) => void;\n}\n\ntype ProcessIndicatorState = Required<Pick<ProcessIndicatorProps, 'status' \| 'size'>>;\n\nexport default class ProcessIndicator extends Component<\n ProcessIndicatorProps,\n ProcessIndicatorState\n> {\n declare props: ProcessIndicatorProps &\n Required<Pick<ProcessIndicatorProps, keyof typeof ProcessIndicator.defaultProps>>;\n\n static defaultProps = {\n status: 'processing',\n size: 'sm',\n } satisfies Partial<ProcessIndicatorProps>;\n\n interval = 0;\n timeout = 0;\n\n constructor(props: ProcessIndicator['props']) {\n super(props);\n this.state = {\n status: props.status,\n size: props.size,\n };\n }\n\n /*\n Create interval for animation duration (1500ms)\n * Update state only at the end of every interval\n * (end of animation loop) if props changed before end of animation\n /\n componentDidMount() {\n this.interval = window.setInterval(() => {\n const { status: targetStatus, size: targetSize, onAnimationCompleted } = this.props;\n const { status: currentStatus, size: currentSize } = this.state;\n\n if (currentStatus !== targetStatus) {\n this.setState({ status: targetStatus }, () => {\n if (onAnimationCompleted) {\n this.timeout = window.setTimeout(() => {\n onAnimationCompleted(targetStatus);\n }, ANIMATION_DURATION_IN_MS);\n }\n });\n }\n\n if (currentSize !== targetSize) {\n this.setState({ size: targetSize });\n }\n }, ANIMATION_DURATION_IN_MS);\n }\n\n /\n Only trigger render if comopnent's state got\n * updated from interval callback\n */\n shouldComponentUpdate(nextProps: ProcessIndicator['props'], nextState: ProcessIndicatorState) {\n const isSameStatus = nextProps.status === nextState.status;\n const isSameSize = nextProps.size === nextState.size;\n\n return isSameStatus && isSameSize;\n }\n\n // Clear interval before destroying component\n componentWillUnmount() {\n window.clearInterval(this.interval);\n window.clearTimeout(this.timeout);\n }\n\n render() {\n const { className, 'data-testid': dataTestId } = this.props;\n const { size, status } = this.state;\n const classes = clsx(`process process-${size}`, className, {\n [`process-danger`]: status === Status.FAILED,\n [`process-stopped`]: status === Status.HIDDEN,\n [`process-success`]: status === Status.SUCCEEDED,\n });\n\n return (\n <span className={classes} data-testid={dataTestId}>\n <span className=\"process-icon-container\">\n <span className=\"process-icon-horizontal\" />\n <span className=\"process-icon-vertical\" />\n </span>\n <svg xmlns=\"http://www.w3.org/2000/svg\">\n <circle className=\"process-circle\" cx=\"50%\" cy=\"50%\" r={radius[size]} fillOpacity=\"0.0\" />\n </svg>\n </span>\n );\n }\n}\n"],"names":["radius","xxs","xs","sm","xl","ANIMATION_DURATION_IN_MS","ProcessIndicator","Component","defaultProps","status","size","interval","timeout","constructor","props","state","componentDidMount","window","setInterval","targetStatus","targetSize","onAnimationCompleted","currentStatus","currentSize","setState","setTimeout","shouldComponentUpdate","nextProps","nextState","isSameStatus","isSameSize","componentWillUnmount","clearInterval","clearTimeout","render","className","dataTestId","classes","clsx","Status","FAILED","HIDDEN","SUCCEEDED","_jsxs","children","_jsx","xmlns","cx","cy","r","fillOpacity"],"mappings":"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"}

package/build/processIndicator/ProcessIndicator.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProcessIndicator.mjs","sources":["../../src/processIndicator/ProcessIndicator.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { Component } from 'react';\n\nimport { Status, Size } from '../common';\n\nconst radius = { xxs: 6, xs: 11, sm: 22, xl: 61 };\n\nconst ANIMATION_DURATION_IN_MS = 1500;\n\nexport type ProcessIndicatorStatus =\n `${Status.PROCESSING \| Status.FAILED \| Status.SUCCEEDED \| Status.HIDDEN}`;\n\nexport interface ProcessIndicatorProps {\n status?: ProcessIndicatorStatus;\n size?: 'xxs' \| `${Size.EXTRA_SMALL \| Size.SMALL \| Size.EXTRA_LARGE}`;\n className?: string;\n 'data-testid'?: string;\n onAnimationCompleted?: (status: ProcessIndicatorStatus) => void;\n}\n\ntype ProcessIndicatorState = Required<Pick<ProcessIndicatorProps, 'status' \| 'size'>>;\n\nexport default class ProcessIndicator extends Component<\n ProcessIndicatorProps,\n ProcessIndicatorState\n> {\n declare props: ProcessIndicatorProps &\n Required<Pick<ProcessIndicatorProps, keyof typeof ProcessIndicator.defaultProps>>;\n\n static defaultProps = {\n status: 'processing',\n size: 'sm',\n } satisfies Partial<ProcessIndicatorProps>;\n\n interval = 0;\n timeout = 0;\n\n constructor(props: ProcessIndicator['props']) {\n super(props);\n this.state = {\n status: props.status,\n size: props.size,\n };\n }\n\n /*\n Create interval for animation duration (1500ms)\n * Update state only at the end of every interval\n * (end of animation loop) if props changed before end of animation\n /\n componentDidMount() {\n this.interval = window.setInterval(() => {\n const { status: targetStatus, size: targetSize, onAnimationCompleted } = this.props;\n const { status: currentStatus, size: currentSize } = this.state;\n\n if (currentStatus !== targetStatus) {\n this.setState({ status: targetStatus }, () => {\n if (onAnimationCompleted) {\n this.timeout = window.setTimeout(() => {\n onAnimationCompleted(targetStatus);\n }, ANIMATION_DURATION_IN_MS);\n }\n });\n }\n\n if (currentSize !== targetSize) {\n this.setState({ size: targetSize });\n }\n }, ANIMATION_DURATION_IN_MS);\n }\n\n /\n Only trigger render if comopnent's state got\n * updated from interval callback\n */\n shouldComponentUpdate(nextProps: ProcessIndicator['props'], nextState: ProcessIndicatorState) {\n const isSameStatus = nextProps.status === nextState.status;\n const isSameSize = nextProps.size === nextState.size;\n\n return isSameStatus && isSameSize;\n }\n\n // Clear interval before destroying component\n componentWillUnmount() {\n window.clearInterval(this.interval);\n window.clearTimeout(this.timeout);\n }\n\n render() {\n const { className, 'data-testid': dataTestId } = this.props;\n const { size, status } = this.state;\n const classes = clsx(`process process-${size}`, className, {\n [`process-danger`]: status === Status.FAILED,\n [`process-stopped`]: status === Status.HIDDEN,\n [`process-success`]: status === Status.SUCCEEDED,\n });\n\n return (\n <span className={classes} data-testid={dataTestId}>\n <span className=\"process-icon-container\">\n <span className=\"process-icon-horizontal\" />\n <span className=\"process-icon-vertical\" />\n </span>\n <svg xmlns=\"http://www.w3.org/2000/svg\">\n <circle className=\"process-circle\" cx=\"50%\" cy=\"50%\" r={radius[size]} fillOpacity=\"0.0\" />\n </svg>\n </span>\n );\n }\n}\n"],"names":["radius","xxs","xs","sm","xl","ANIMATION_DURATION_IN_MS","ProcessIndicator","Component","defaultProps","status","size","interval","timeout","constructor","props","state","componentDidMount","window","setInterval","targetStatus","targetSize","onAnimationCompleted","currentStatus","currentSize","setState","setTimeout","shouldComponentUpdate","nextProps","nextState","isSameStatus","isSameSize","componentWillUnmount","clearInterval","clearTimeout","render","className","dataTestId","classes","clsx","Status","FAILED","HIDDEN","SUCCEEDED","_jsxs","children","_jsx","xmlns","cx","cy","r","fillOpacity"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,MAAMA,MAAM,GAAG;AAAEC,EAAAA,GAAG,EAAE,CAAC;AAAEC,EAAAA,EAAE,EAAE,EAAE;AAAEC,EAAAA,EAAE,EAAE,EAAE;AAAEC,EAAAA,EAAE,EAAE;CAAI;AAEjD,MAAMC,wBAAwB,GAAG,IAAI;~~AAehB~~,~~MAAAC~~,gBAAiB,SAAQC,SAG7C,CAAA;AAIC,EAAA,OAAOC,YAAY,GAAG;AACpBC,IAAAA,MAAM,EAAE,YAAY;AACpBC,IAAAA,IAAI,EAAE;GACkC;AAE1CC,EAAAA,QAAQ,GAAG,CAAC;AACZC,EAAAA,OAAO,GAAG,CAAC;EAEXC,WAAAA,CAAYC,KAAgC,EAAA;IAC1C,KAAK,CAACA,KAAK,CAAC;IACZ,IAAI,CAACC,KAAK,GAAG;MACXN,MAAM,EAAEK,KAAK,CAACL,MAAM;MACpBC,IAAI,EAAEI,KAAK,CAACJ;KACb;AACH;AAEA;;;;AAIG;AACHM,EAAAA,iBAAiBA,GAAA;AACf,IAAA,IAAI,CAACL,QAAQ,GAAGM,MAAM,CAACC,WAAW,CAAC,MAAK;MACtC,MAAM;AAAET,QAAAA,MAAM,EAAEU,YAAY;AAAET,QAAAA,IAAI,EAAEU,UAAU;AAAEC,QAAAA;OAAsB,GAAG,IAAI,CAACP,KAAK;MACnF,MAAM;AAAEL,QAAAA,MAAM,EAAEa,aAAa;AAAEZ,QAAAA,IAAI,EAAEa;OAAa,GAAG,IAAI,CAACR,KAAK;MAE/D,IAAIO,aAAa,KAAKH,YAAY,EAAE;QAClC,IAAI,CAACK,QAAQ,CAAC;AAAEf,UAAAA,MAAM,EAAEU;AAAY,SAAE,EAAE,MAAK;AAC3C,UAAA,IAAIE,oBAAoB,EAAE;AACxB,YAAA,IAAI,CAACT,OAAO,GAAGK,MAAM,CAACQ,UAAU,CAAC,MAAK;cACpCJ,oBAAoB,CAACF,YAAY,CAAC;~~aACnC~~,EAAEd,wBAAwB,CAAC;AAC9B;AACF,~~SAAC~~,CAAC;AACJ;MAEA,IAAIkB,WAAW,KAAKH,UAAU,EAAE;QAC9B,IAAI,CAACI,QAAQ,CAAC;AAAEd,UAAAA,IAAI,EAAEU;~~AAAY~~,~~SAAA~~,CAAC;AACrC;~~KACD~~,EAAEf,wBAAwB,CAAC;AAC9B;AAEA;;;AAGG;AACHqB,EAAAA,qBAAqBA,CAACC,SAAoC,EAAEC,SAAgC,EAAA;IAC1F,MAAMC,YAAY,GAAGF,SAAS,CAAClB,MAAM,KAAKmB,SAAS,CAACnB,MAAM;IAC1D,MAAMqB,UAAU,GAAGH,SAAS,CAACjB,IAAI,KAAKkB,SAAS,CAAClB,IAAI;IAEpD,OAAOmB,YAAY,IAAIC,UAAU;AACnC;AAEA;AACAC,EAAAA,oBAAoBA,GAAA;AAClBd,IAAAA,MAAM,CAACe,aAAa,CAAC,IAAI,CAACrB,QAAQ,CAAC;AACnCM,IAAAA,MAAM,CAACgB,YAAY,CAAC,IAAI,CAACrB,OAAO,CAAC;AACnC;AAEAsB,EAAAA,MAAMA,GAAA;IACJ,MAAM;MAAEC,SAAS;AAAE,MAAA,aAAa,EAAEC;KAAY,GAAG,IAAI,CAACtB,KAAK;IAC3D,MAAM;MAAEJ,IAAI;AAAED,MAAAA;KAAQ,GAAG,IAAI,CAACM,KAAK;IACnC,MAAMsB,OAAO,GAAGC,IAAI,CAAC,mBAAmB5B,IAAI,CAAA,CAAE,EAAEyB,SAAS,EAAE;AACzD,MAAA,CAAC,gBAAgB,GAAG1B,MAAM,KAAK8B,MAAM,CAACC,MAAM;AAC5C,MAAA,CAAC,iBAAiB,GAAG/B,MAAM,KAAK8B,MAAM,CAACE,MAAM;AAC7C,MAAA,CAAC,~~CAAiB~~,eAAA,~~CAAA~~,GAAGhC,MAAM,KAAK8B,MAAM,CAACG;AACxC,KAAA,CAAC;AAEF,IAAA,oBACEC,IAAA,CAAA,MAAA,EAAA;AAAMR,MAAAA,SAAS,EAAEE,OAAQ;AAAC,MAAA,aAAA,EAAaD,UAAW;AAAAQ,MAAAA,QAAA,gBAChDD,IAAA,CAAA,MAAA,EAAA;AAAMR,QAAAA,SAAS,EAAC,wBAAwB;AAAAS,QAAAA,QAAA,gBACtCC,GAAA,CAAA,MAAA,EAAA;AAAMV,UAAAA,SAAS,EAAC;~~SAChB~~,~~CAAA~~,eAAAU,GAAA,CAAA,MAAA,EAAA;AAAMV,UAAAA,SAAS,EAAC;AAAuB,~~SACzC~~,~~CAAA~~;OAAM,CACN,eAAAU,GAAA,CAAA,KAAA,EAAA;AAAKC,QAAAA,KAAK,EAAC,4BAA4B;AAAAF,QAAAA,QAAA,eACrCC,GAAA,CAAA,QAAA,EAAA;AAAQV,UAAAA,SAAS,EAAC,gBAAgB;AAACY,UAAAA,EAAE,EAAC,KAAK;AAACC,UAAAA,EAAE,EAAC,KAAK;AAACC,UAAAA,CAAC,EAAEjD,MAAM,CAACU,IAAI,CAAE;AAACwC,UAAAA,WAAW,EAAC;~~SACpF~~;~~AAAA~~,OAAK,CACP;AAAA,KAAM,CAAC;AAEX;;;;;"}
1	+ {"version":3,"file":"ProcessIndicator.mjs","sources":["../../src/processIndicator/ProcessIndicator.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { Component } from 'react';\n\nimport { Status, Size } from '../common';\n\nconst radius = { xxs: 6, xs: 11, sm: 22, xl: 61 };\n\nconst ANIMATION_DURATION_IN_MS = 1500;\n\nexport type ProcessIndicatorStatus =\n `${Status.PROCESSING \| Status.FAILED \| Status.SUCCEEDED \| Status.HIDDEN}`;\n\nexport interface ProcessIndicatorProps {\n status?: ProcessIndicatorStatus;\n size?: 'xxs' \| `${Size.EXTRA_SMALL \| Size.SMALL \| Size.EXTRA_LARGE}`;\n className?: string;\n 'data-testid'?: string;\n onAnimationCompleted?: (status: ProcessIndicatorStatus) => void;\n}\n\ntype ProcessIndicatorState = Required<Pick<ProcessIndicatorProps, 'status' \| 'size'>>;\n\nexport default class ProcessIndicator extends Component<\n ProcessIndicatorProps,\n ProcessIndicatorState\n> {\n declare props: ProcessIndicatorProps &\n Required<Pick<ProcessIndicatorProps, keyof typeof ProcessIndicator.defaultProps>>;\n\n static defaultProps = {\n status: 'processing',\n size: 'sm',\n } satisfies Partial<ProcessIndicatorProps>;\n\n interval = 0;\n timeout = 0;\n\n constructor(props: ProcessIndicator['props']) {\n super(props);\n this.state = {\n status: props.status,\n size: props.size,\n };\n }\n\n /*\n Create interval for animation duration (1500ms)\n * Update state only at the end of every interval\n * (end of animation loop) if props changed before end of animation\n /\n componentDidMount() {\n this.interval = window.setInterval(() => {\n const { status: targetStatus, size: targetSize, onAnimationCompleted } = this.props;\n const { status: currentStatus, size: currentSize } = this.state;\n\n if (currentStatus !== targetStatus) {\n this.setState({ status: targetStatus }, () => {\n if (onAnimationCompleted) {\n this.timeout = window.setTimeout(() => {\n onAnimationCompleted(targetStatus);\n }, ANIMATION_DURATION_IN_MS);\n }\n });\n }\n\n if (currentSize !== targetSize) {\n this.setState({ size: targetSize });\n }\n }, ANIMATION_DURATION_IN_MS);\n }\n\n /\n Only trigger render if comopnent's state got\n * updated from interval callback\n */\n shouldComponentUpdate(nextProps: ProcessIndicator['props'], nextState: ProcessIndicatorState) {\n const isSameStatus = nextProps.status === nextState.status;\n const isSameSize = nextProps.size === nextState.size;\n\n return isSameStatus && isSameSize;\n }\n\n // Clear interval before destroying component\n componentWillUnmount() {\n window.clearInterval(this.interval);\n window.clearTimeout(this.timeout);\n }\n\n render() {\n const { className, 'data-testid': dataTestId } = this.props;\n const { size, status } = this.state;\n const classes = clsx(`process process-${size}`, className, {\n [`process-danger`]: status === Status.FAILED,\n [`process-stopped`]: status === Status.HIDDEN,\n [`process-success`]: status === Status.SUCCEEDED,\n });\n\n return (\n <span className={classes} data-testid={dataTestId}>\n <span className=\"process-icon-container\">\n <span className=\"process-icon-horizontal\" />\n <span className=\"process-icon-vertical\" />\n </span>\n <svg xmlns=\"http://www.w3.org/2000/svg\">\n <circle className=\"process-circle\" cx=\"50%\" cy=\"50%\" r={radius[size]} fillOpacity=\"0.0\" />\n </svg>\n </span>\n );\n }\n}\n"],"names":["radius","xxs","xs","sm","xl","ANIMATION_DURATION_IN_MS","ProcessIndicator","Component","defaultProps","status","size","interval","timeout","constructor","props","state","componentDidMount","window","setInterval","targetStatus","targetSize","onAnimationCompleted","currentStatus","currentSize","setState","setTimeout","shouldComponentUpdate","nextProps","nextState","isSameStatus","isSameSize","componentWillUnmount","clearInterval","clearTimeout","render","className","dataTestId","classes","clsx","Status","FAILED","HIDDEN","SUCCEEDED","_jsxs","children","_jsx","xmlns","cx","cy","r","fillOpacity"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAKA,MAAMA,MAAM,GAAG;AAAEC,EAAAA,GAAG,EAAE,CAAC;AAAEC,EAAAA,EAAE,EAAE,EAAE;AAAEC,EAAAA,EAAE,EAAE,EAAE;AAAEC,EAAAA,EAAE,EAAE;CAAI;AAEjD,MAAMC,wBAAwB,GAAG,IAAI;AAevB,MAAOC,gBAAiB,SAAQC,SAG7C,CAAA;AAIC,EAAA,OAAOC,YAAY,GAAG;AACpBC,IAAAA,MAAM,EAAE,YAAY;AACpBC,IAAAA,IAAI,EAAE;GACkC;AAE1CC,EAAAA,QAAQ,GAAG,CAAC;AACZC,EAAAA,OAAO,GAAG,CAAC;EAEXC,WAAAA,CAAYC,KAAgC,EAAA;IAC1C,KAAK,CAACA,KAAK,CAAC;IACZ,IAAI,CAACC,KAAK,GAAG;MACXN,MAAM,EAAEK,KAAK,CAACL,MAAM;MACpBC,IAAI,EAAEI,KAAK,CAACJ;KACb;AACH,EAAA;AAEA;;;;AAIG;AACHM,EAAAA,iBAAiBA,GAAA;AACf,IAAA,IAAI,CAACL,QAAQ,GAAGM,MAAM,CAACC,WAAW,CAAC,MAAK;MACtC,MAAM;AAAET,QAAAA,MAAM,EAAEU,YAAY;AAAET,QAAAA,IAAI,EAAEU,UAAU;AAAEC,QAAAA;OAAsB,GAAG,IAAI,CAACP,KAAK;MACnF,MAAM;AAAEL,QAAAA,MAAM,EAAEa,aAAa;AAAEZ,QAAAA,IAAI,EAAEa;OAAa,GAAG,IAAI,CAACR,KAAK;MAE/D,IAAIO,aAAa,KAAKH,YAAY,EAAE;QAClC,IAAI,CAACK,QAAQ,CAAC;AAAEf,UAAAA,MAAM,EAAEU;AAAY,SAAE,EAAE,MAAK;AAC3C,UAAA,IAAIE,oBAAoB,EAAE;AACxB,YAAA,IAAI,CAACT,OAAO,GAAGK,MAAM,CAACQ,UAAU,CAAC,MAAK;cACpCJ,oBAAoB,CAACF,YAAY,CAAC;YACpC,CAAC,EAAEd,wBAAwB,CAAC;AAC9B,UAAA;AACF,QAAA,CAAC,CAAC;AACJ,MAAA;MAEA,IAAIkB,WAAW,KAAKH,UAAU,EAAE;QAC9B,IAAI,CAACI,QAAQ,CAAC;AAAEd,UAAAA,IAAI,EAAEU;AAAU,SAAE,CAAC;AACrC,MAAA;IACF,CAAC,EAAEf,wBAAwB,CAAC;AAC9B,EAAA;AAEA;;;AAGG;AACHqB,EAAAA,qBAAqBA,CAACC,SAAoC,EAAEC,SAAgC,EAAA;IAC1F,MAAMC,YAAY,GAAGF,SAAS,CAAClB,MAAM,KAAKmB,SAAS,CAACnB,MAAM;IAC1D,MAAMqB,UAAU,GAAGH,SAAS,CAACjB,IAAI,KAAKkB,SAAS,CAAClB,IAAI;IAEpD,OAAOmB,YAAY,IAAIC,UAAU;AACnC,EAAA;AAEA;AACAC,EAAAA,oBAAoBA,GAAA;AAClBd,IAAAA,MAAM,CAACe,aAAa,CAAC,IAAI,CAACrB,QAAQ,CAAC;AACnCM,IAAAA,MAAM,CAACgB,YAAY,CAAC,IAAI,CAACrB,OAAO,CAAC;AACnC,EAAA;AAEAsB,EAAAA,MAAMA,GAAA;IACJ,MAAM;MAAEC,SAAS;AAAE,MAAA,aAAa,EAAEC;KAAY,GAAG,IAAI,CAACtB,KAAK;IAC3D,MAAM;MAAEJ,IAAI;AAAED,MAAAA;KAAQ,GAAG,IAAI,CAACM,KAAK;IACnC,MAAMsB,OAAO,GAAGC,IAAI,CAAC,mBAAmB5B,IAAI,CAAA,CAAE,EAAEyB,SAAS,EAAE;AACzD,MAAA,CAAC,gBAAgB,GAAG1B,MAAM,KAAK8B,MAAM,CAACC,MAAM;AAC5C,MAAA,CAAC,iBAAiB,GAAG/B,MAAM,KAAK8B,MAAM,CAACE,MAAM;AAC7C,MAAA,CAAC,CAAA,eAAA,CAAiB,GAAGhC,MAAM,KAAK8B,MAAM,CAACG;AACxC,KAAA,CAAC;AAEF,IAAA,oBACEC,IAAA,CAAA,MAAA,EAAA;AAAMR,MAAAA,SAAS,EAAEE,OAAQ;AAAC,MAAA,aAAA,EAAaD,UAAW;AAAAQ,MAAAA,QAAA,gBAChDD,IAAA,CAAA,MAAA,EAAA;AAAMR,QAAAA,SAAS,EAAC,wBAAwB;AAAAS,QAAAA,QAAA,gBACtCC,GAAA,CAAA,MAAA,EAAA;AAAMV,UAAAA,SAAS,EAAC;SAAyB,CACzC,eAAAU,GAAA,CAAA,MAAA,EAAA;AAAMV,UAAAA,SAAS,EAAC;AAAuB,SAAA,CACzC;OAAM,CACN,eAAAU,GAAA,CAAA,KAAA,EAAA;AAAKC,QAAAA,KAAK,EAAC,4BAA4B;AAAAF,QAAAA,QAAA,eACrCC,GAAA,CAAA,QAAA,EAAA;AAAQV,UAAAA,SAAS,EAAC,gBAAgB;AAACY,UAAAA,EAAE,EAAC,KAAK;AAACC,UAAAA,EAAE,EAAC,KAAK;AAACC,UAAAA,CAAC,EAAEjD,MAAM,CAACU,IAAI,CAAE;AAACwC,UAAAA,WAAW,EAAC;SAAK;AACzF,OAAK,CACP;AAAA,KAAM,CAAC;AAEX,EAAA;;;;;"}

package/build/progress/Progress.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Progress.js","sources":["../../src/progress/Progress.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nexport type ProgressProps = {\n className?: string;\n id: string;\n progress: { value: number; max: number };\n};\n\nconst Progress = ({ className, id, progress }: ProgressProps) => {\n return (\n <progress id={id} className={clsx('np-progress d-block', className)} {...progress}>\n {Math.floor((progress.value / progress.max) * 100)}%\n </progress>\n );\n};\n\nexport default Progress;\n"],"names":["Progress","className","id","progress","_jsxs","clsx","children","Math","floor","value","max"],"mappings":";;;;;;;~~AAQMA~~,~~MAAAA~~,QAAQ,GAAGA,CAAC;EAAEC,SAAS;EAAEC,EAAE;AAAEC,EAAAA;~~AAAyB~~,~~CAAA~~,KAAI;AAC9D,EAAA,oBACEC,eAAA,CAAA,UAAA,EAAA;AAAUF,IAAAA,EAAE,EAAEA,EAAG;AAACD,IAAAA,SAAS,EAAEI,SAAI,CAAC,qBAAqB,EAAEJ,SAAS,CAAE;AAAA,IAAA,GAAKE,QAAQ;AAAAG,IAAAA,QAAA,GAC9EC,IAAI,CAACC,KAAK,CAAEL,QAAQ,CAACM,KAAK,GAAGN,QAAQ,CAACO,GAAG,GAAI,GAAG,CAAC,EAAC,GACrD;AAAA,GAAU,CAAC;AAEf;;;;"}
1	+ {"version":3,"file":"Progress.js","sources":["../../src/progress/Progress.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nexport type ProgressProps = {\n className?: string;\n id: string;\n progress: { value: number; max: number };\n};\n\nconst Progress = ({ className, id, progress }: ProgressProps) => {\n return (\n <progress id={id} className={clsx('np-progress d-block', className)} {...progress}>\n {Math.floor((progress.value / progress.max) * 100)}%\n </progress>\n );\n};\n\nexport default Progress;\n"],"names":["Progress","className","id","progress","_jsxs","clsx","children","Math","floor","value","max"],"mappings":";;;;;;;AAQA,MAAMA,QAAQ,GAAGA,CAAC;EAAEC,SAAS;EAAEC,EAAE;AAAEC,EAAAA;AAAQ,CAAiB,KAAI;AAC9D,EAAA,oBACEC,eAAA,CAAA,UAAA,EAAA;AAAUF,IAAAA,EAAE,EAAEA,EAAG;AAACD,IAAAA,SAAS,EAAEI,SAAI,CAAC,qBAAqB,EAAEJ,SAAS,CAAE;AAAA,IAAA,GAAKE,QAAQ;AAAAG,IAAAA,QAAA,GAC9EC,IAAI,CAACC,KAAK,CAAEL,QAAQ,CAACM,KAAK,GAAGN,QAAQ,CAACO,GAAG,GAAI,GAAG,CAAC,EAAC,GACrD;AAAA,GAAU,CAAC;AAEf;;;;"}

package/build/progress/Progress.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Progress.mjs","sources":["../../src/progress/Progress.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nexport type ProgressProps = {\n className?: string;\n id: string;\n progress: { value: number; max: number };\n};\n\nconst Progress = ({ className, id, progress }: ProgressProps) => {\n return (\n <progress id={id} className={clsx('np-progress d-block', className)} {...progress}>\n {Math.floor((progress.value / progress.max) * 100)}%\n </progress>\n );\n};\n\nexport default Progress;\n"],"names":["Progress","className","id","progress","_jsxs","clsx","children","Math","floor","value","max"],"mappings":";;;~~AAQMA~~,~~MAAAA~~,QAAQ,GAAGA,CAAC;EAAEC,SAAS;EAAEC,EAAE;AAAEC,EAAAA;~~AAAyB~~,~~CAAA~~,KAAI;AAC9D,EAAA,oBACEC,IAAA,CAAA,UAAA,EAAA;AAAUF,IAAAA,EAAE,EAAEA,EAAG;AAACD,IAAAA,SAAS,EAAEI,IAAI,CAAC,qBAAqB,EAAEJ,SAAS,CAAE;AAAA,IAAA,GAAKE,QAAQ;AAAAG,IAAAA,QAAA,GAC9EC,IAAI,CAACC,KAAK,CAAEL,QAAQ,CAACM,KAAK,GAAGN,QAAQ,CAACO,GAAG,GAAI,GAAG,CAAC,EAAC,GACrD;AAAA,GAAU,CAAC;AAEf;;;;"}
1	+ {"version":3,"file":"Progress.mjs","sources":["../../src/progress/Progress.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nexport type ProgressProps = {\n className?: string;\n id: string;\n progress: { value: number; max: number };\n};\n\nconst Progress = ({ className, id, progress }: ProgressProps) => {\n return (\n <progress id={id} className={clsx('np-progress d-block', className)} {...progress}>\n {Math.floor((progress.value / progress.max) * 100)}%\n </progress>\n );\n};\n\nexport default Progress;\n"],"names":["Progress","className","id","progress","_jsxs","clsx","children","Math","floor","value","max"],"mappings":";;;AAQA,MAAMA,QAAQ,GAAGA,CAAC;EAAEC,SAAS;EAAEC,EAAE;AAAEC,EAAAA;AAAQ,CAAiB,KAAI;AAC9D,EAAA,oBACEC,IAAA,CAAA,UAAA,EAAA;AAAUF,IAAAA,EAAE,EAAEA,EAAG;AAACD,IAAAA,SAAS,EAAEI,IAAI,CAAC,qBAAqB,EAAEJ,SAAS,CAAE;AAAA,IAAA,GAAKE,QAAQ;AAAAG,IAAAA,QAAA,GAC9EC,IAAI,CAACC,KAAK,CAAEL,QAAQ,CAACM,KAAK,GAAGN,QAAQ,CAACO,GAAG,GAAI,GAAG,CAAC,EAAC,GACrD;AAAA,GAAU,CAAC;AAEf;;;;"}

package/build/progressBar/ProgressBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProgressBar.js","sources":["../../src/progressBar/ProgressBar.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Progress from '../progress';\nimport Title from '../title/Title';\n\nexport type ProgressBarProps = {\n className?: string;\n description?: React.ReactNode;\n id: string;\n title: React.ReactNode;\n progress: { value: number; max: number };\n textEnd: React.ReactNode;\n};\n\nconst ProgressBar = ({\n className,\n description,\n id,\n title,\n progress,\n textEnd,\n}: ProgressBarProps) => {\n const { isModern } = useTheme();\n return (\n <div className={clsx('np-progress-bar', className)}>\n <label className=\"np-progress-bar__title m-b-1\" htmlFor={id}>\n <Title\n type={Typography.TITLE_BODY}\n className={isModern ? `m-b-1 text-primary` : `text-primary`}\n >\n {title}\n </Title>\n {description && <Body>{description}</Body>}\n </label>\n <Progress id={id} progress={progress} />\n <Body\n as=\"p\"\n type={Typography.BODY_DEFAULT_BOLD}\n className=\"d-flex justify-content-end text-primary m-b-0\"\n >\n {textEnd}\n </Body>\n </div>\n );\n};\n\nexport default ProgressBar;\n"],"names":["ProgressBar","className","description","id","title","progress","textEnd","isModern","useTheme","_jsxs","clsx","children","htmlFor","_jsx","Title","type","Typography","TITLE_BODY","Body","Progress","as","BODY_DEFAULT_BOLD"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAiBMA~~,~~MAAAA~~,WAAW,GAAGA,CAAC;EACnBC,SAAS;EACTC,WAAW;EACXC,EAAE;EACFC,KAAK;EACLC,QAAQ;AACRC,EAAAA;AAAO,CACU,KAAI;EACrB,MAAM;AAAEC,IAAAA;GAAU,GAAGC,0BAAQ,EAAE;AAC/B,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAKR,IAAAA,SAAS,EAAES,SAAI,CAAC,iBAAiB,EAAET,SAAS,CAAE;AAAAU,IAAAA,QAAA,gBACjDF,eAAA,CAAA,OAAA,EAAA;AAAOR,MAAAA,SAAS,EAAC,8BAA8B;AAACW,MAAAA,OAAO,EAAET,EAAG;MAAAQ,QAAA,EAAA,cAC1DE,cAAA,CAACC,aAAK,EAAA;QACJC,IAAI,EAAEC,qBAAU,CAACC,UAAW;AAC5BhB,QAAAA,SAAS,EAAEM,QAAQ,GAAG,CAAA,kBAAA,CAAoB,GAAG,~~CAAe~~,YAAA,~~CAAA~~;AAAAI,QAAAA,QAAA,EAE3DP;AAAK,OACD,CACP,EAACF,WAAW,iBAAIW,cAAA,CAACK,YAAI,EAAA;AAAAP,QAAAA,QAAA,EAAET;AAAW,OAAO,CAAC;AAAA,KACrC,CACP,eAAAW,cAAA,CAACM,gBAAQ,EAAA;AAAChB,MAAAA,EAAE,EAAEA,EAAG;AAACE,MAAAA,QAAQ,EAAEA;AAAS,~~KACrC~~,~~CAAA~~,eAAAQ,cAAA,CAACK,YAAI,EAAA;AACHE,MAAAA,EAAE,EAAC,GAAG;MACNL,IAAI,EAAEC,qBAAU,CAACK,iBAAkB;AACnCpB,MAAAA,SAAS,EAAC,+CAA+C;AAAAU,MAAAA,QAAA,EAExDL;AAAO,KACJ,CACR;AAAA,GAAK,CAAC;AAEV;;;;"}
1	+ {"version":3,"file":"ProgressBar.js","sources":["../../src/progressBar/ProgressBar.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Progress from '../progress';\nimport Title from '../title/Title';\n\nexport type ProgressBarProps = {\n className?: string;\n description?: React.ReactNode;\n id: string;\n title: React.ReactNode;\n progress: { value: number; max: number };\n textEnd: React.ReactNode;\n};\n\nconst ProgressBar = ({\n className,\n description,\n id,\n title,\n progress,\n textEnd,\n}: ProgressBarProps) => {\n const { isModern } = useTheme();\n return (\n <div className={clsx('np-progress-bar', className)}>\n <label className=\"np-progress-bar__title m-b-1\" htmlFor={id}>\n <Title\n type={Typography.TITLE_BODY}\n className={isModern ? `m-b-1 text-primary` : `text-primary`}\n >\n {title}\n </Title>\n {description && <Body>{description}</Body>}\n </label>\n <Progress id={id} progress={progress} />\n <Body\n as=\"p\"\n type={Typography.BODY_DEFAULT_BOLD}\n className=\"d-flex justify-content-end text-primary m-b-0\"\n >\n {textEnd}\n </Body>\n </div>\n );\n};\n\nexport default ProgressBar;\n"],"names":["ProgressBar","className","description","id","title","progress","textEnd","isModern","useTheme","_jsxs","clsx","children","htmlFor","_jsx","Title","type","Typography","TITLE_BODY","Body","Progress","as","BODY_DEFAULT_BOLD"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAMA,WAAW,GAAGA,CAAC;EACnBC,SAAS;EACTC,WAAW;EACXC,EAAE;EACFC,KAAK;EACLC,QAAQ;AACRC,EAAAA;AAAO,CACU,KAAI;EACrB,MAAM;AAAEC,IAAAA;GAAU,GAAGC,0BAAQ,EAAE;AAC/B,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAKR,IAAAA,SAAS,EAAES,SAAI,CAAC,iBAAiB,EAAET,SAAS,CAAE;AAAAU,IAAAA,QAAA,gBACjDF,eAAA,CAAA,OAAA,EAAA;AAAOR,MAAAA,SAAS,EAAC,8BAA8B;AAACW,MAAAA,OAAO,EAAET,EAAG;MAAAQ,QAAA,EAAA,cAC1DE,cAAA,CAACC,aAAK,EAAA;QACJC,IAAI,EAAEC,qBAAU,CAACC,UAAW;AAC5BhB,QAAAA,SAAS,EAAEM,QAAQ,GAAG,CAAA,kBAAA,CAAoB,GAAG,CAAA,YAAA,CAAe;AAAAI,QAAAA,QAAA,EAE3DP;AAAK,OACD,CACP,EAACF,WAAW,iBAAIW,cAAA,CAACK,YAAI,EAAA;AAAAP,QAAAA,QAAA,EAAET;AAAW,OAAO,CAAC;AAAA,KACrC,CACP,eAAAW,cAAA,CAACM,gBAAQ,EAAA;AAAChB,MAAAA,EAAE,EAAEA,EAAG;AAACE,MAAAA,QAAQ,EAAEA;AAAS,KAAA,CACrC,eAAAQ,cAAA,CAACK,YAAI,EAAA;AACHE,MAAAA,EAAE,EAAC,GAAG;MACNL,IAAI,EAAEC,qBAAU,CAACK,iBAAkB;AACnCpB,MAAAA,SAAS,EAAC,+CAA+C;AAAAU,MAAAA,QAAA,EAExDL;AAAO,KACJ,CACR;AAAA,GAAK,CAAC;AAEV;;;;"}

package/build/progressBar/ProgressBar.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ProgressBar.mjs","sources":["../../src/progressBar/ProgressBar.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Progress from '../progress';\nimport Title from '../title/Title';\n\nexport type ProgressBarProps = {\n className?: string;\n description?: React.ReactNode;\n id: string;\n title: React.ReactNode;\n progress: { value: number; max: number };\n textEnd: React.ReactNode;\n};\n\nconst ProgressBar = ({\n className,\n description,\n id,\n title,\n progress,\n textEnd,\n}: ProgressBarProps) => {\n const { isModern } = useTheme();\n return (\n <div className={clsx('np-progress-bar', className)}>\n <label className=\"np-progress-bar__title m-b-1\" htmlFor={id}>\n <Title\n type={Typography.TITLE_BODY}\n className={isModern ? `m-b-1 text-primary` : `text-primary`}\n >\n {title}\n </Title>\n {description && <Body>{description}</Body>}\n </label>\n <Progress id={id} progress={progress} />\n <Body\n as=\"p\"\n type={Typography.BODY_DEFAULT_BOLD}\n className=\"d-flex justify-content-end text-primary m-b-0\"\n >\n {textEnd}\n </Body>\n </div>\n );\n};\n\nexport default ProgressBar;\n"],"names":["ProgressBar","className","description","id","title","progress","textEnd","isModern","useTheme","_jsxs","clsx","children","htmlFor","_jsx","Title","type","Typography","TITLE_BODY","Body","Progress","as","BODY_DEFAULT_BOLD"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAiBMA~~,~~MAAAA~~,WAAW,GAAGA,CAAC;EACnBC,SAAS;EACTC,WAAW;EACXC,EAAE;EACFC,KAAK;EACLC,QAAQ;AACRC,EAAAA;AAAO,CACU,KAAI;EACrB,MAAM;AAAEC,IAAAA;GAAU,GAAGC,QAAQ,EAAE;AAC/B,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AAAKR,IAAAA,SAAS,EAAES,IAAI,CAAC,iBAAiB,EAAET,SAAS,CAAE;AAAAU,IAAAA,QAAA,gBACjDF,IAAA,CAAA,OAAA,EAAA;AAAOR,MAAAA,SAAS,EAAC,8BAA8B;AAACW,MAAAA,OAAO,EAAET,EAAG;MAAAQ,QAAA,EAAA,cAC1DE,GAAA,CAACC,KAAK,EAAA;QACJC,IAAI,EAAEC,UAAU,CAACC,UAAW;AAC5BhB,QAAAA,SAAS,EAAEM,QAAQ,GAAG,CAAA,kBAAA,CAAoB,GAAG,~~CAAe~~,YAAA,~~CAAA~~;AAAAI,QAAAA,QAAA,EAE3DP;AAAK,OACD,CACP,EAACF,WAAW,iBAAIW,GAAA,CAACK,IAAI,EAAA;AAAAP,QAAAA,QAAA,EAAET;AAAW,OAAO,CAAC;AAAA,KACrC,CACP,eAAAW,GAAA,CAACM,QAAQ,EAAA;AAAChB,MAAAA,EAAE,EAAEA,EAAG;AAACE,MAAAA,QAAQ,EAAEA;AAAS,~~KACrC~~,~~CAAA~~,eAAAQ,GAAA,CAACK,IAAI,EAAA;AACHE,MAAAA,EAAE,EAAC,GAAG;MACNL,IAAI,EAAEC,UAAU,CAACK,iBAAkB;AACnCpB,MAAAA,SAAS,EAAC,+CAA+C;AAAAU,MAAAA,QAAA,EAExDL;AAAO,KACJ,CACR;AAAA,GAAK,CAAC;AAEV;;;;"}
1	+ {"version":3,"file":"ProgressBar.mjs","sources":["../../src/progressBar/ProgressBar.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Progress from '../progress';\nimport Title from '../title/Title';\n\nexport type ProgressBarProps = {\n className?: string;\n description?: React.ReactNode;\n id: string;\n title: React.ReactNode;\n progress: { value: number; max: number };\n textEnd: React.ReactNode;\n};\n\nconst ProgressBar = ({\n className,\n description,\n id,\n title,\n progress,\n textEnd,\n}: ProgressBarProps) => {\n const { isModern } = useTheme();\n return (\n <div className={clsx('np-progress-bar', className)}>\n <label className=\"np-progress-bar__title m-b-1\" htmlFor={id}>\n <Title\n type={Typography.TITLE_BODY}\n className={isModern ? `m-b-1 text-primary` : `text-primary`}\n >\n {title}\n </Title>\n {description && <Body>{description}</Body>}\n </label>\n <Progress id={id} progress={progress} />\n <Body\n as=\"p\"\n type={Typography.BODY_DEFAULT_BOLD}\n className=\"d-flex justify-content-end text-primary m-b-0\"\n >\n {textEnd}\n </Body>\n </div>\n );\n};\n\nexport default ProgressBar;\n"],"names":["ProgressBar","className","description","id","title","progress","textEnd","isModern","useTheme","_jsxs","clsx","children","htmlFor","_jsx","Title","type","Typography","TITLE_BODY","Body","Progress","as","BODY_DEFAULT_BOLD"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAMA,WAAW,GAAGA,CAAC;EACnBC,SAAS;EACTC,WAAW;EACXC,EAAE;EACFC,KAAK;EACLC,QAAQ;AACRC,EAAAA;AAAO,CACU,KAAI;EACrB,MAAM;AAAEC,IAAAA;GAAU,GAAGC,QAAQ,EAAE;AAC/B,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AAAKR,IAAAA,SAAS,EAAES,IAAI,CAAC,iBAAiB,EAAET,SAAS,CAAE;AAAAU,IAAAA,QAAA,gBACjDF,IAAA,CAAA,OAAA,EAAA;AAAOR,MAAAA,SAAS,EAAC,8BAA8B;AAACW,MAAAA,OAAO,EAAET,EAAG;MAAAQ,QAAA,EAAA,cAC1DE,GAAA,CAACC,KAAK,EAAA;QACJC,IAAI,EAAEC,UAAU,CAACC,UAAW;AAC5BhB,QAAAA,SAAS,EAAEM,QAAQ,GAAG,CAAA,kBAAA,CAAoB,GAAG,CAAA,YAAA,CAAe;AAAAI,QAAAA,QAAA,EAE3DP;AAAK,OACD,CACP,EAACF,WAAW,iBAAIW,GAAA,CAACK,IAAI,EAAA;AAAAP,QAAAA,QAAA,EAAET;AAAW,OAAO,CAAC;AAAA,KACrC,CACP,eAAAW,GAAA,CAACM,QAAQ,EAAA;AAAChB,MAAAA,EAAE,EAAEA,EAAG;AAACE,MAAAA,QAAQ,EAAEA;AAAS,KAAA,CACrC,eAAAQ,GAAA,CAACK,IAAI,EAAA;AACHE,MAAAA,EAAE,EAAC,GAAG;MACNL,IAAI,EAAEC,UAAU,CAACK,iBAAkB;AACnCpB,MAAAA,SAAS,EAAC,+CAA+C;AAAAU,MAAAA,QAAA,EAExDL;AAAO,KACJ,CACR;AAAA,GAAK,CAAC;AAEV;;;;"}

package/build/promoCard/PromoCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PromoCard.js","sources":["../../src/promoCard/PromoCard.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport React, { forwardRef, FunctionComponent, useEffect, useId, useState } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Card, { type CardProps } from '../common/card';\nimport Display from '../display';\nimport Image from '../image/Image';\nimport Title from '../title';\n\nimport { usePromoCardContext } from './PromoCardContext';\nimport PromoCardIndicator, { type PromoCardIndicatorProps } from './PromoCardIndicator';\n\nexport type ReferenceType = React.Ref<HTMLInputElement> \| React.Ref<HTMLDivElement>;\nexport type RelatedTypes =\n \| ''\n \| 'alternate'\n \| 'author'\n \| 'bookmark'\n \| 'external'\n \| 'help'\n \| 'license'\n \| 'next'\n \| 'nofollow'\n \| 'noreferrer'\n \| 'noopener'\n \| 'prev'\n \| 'search'\n \| 'tag';\n\nexport interface PromoCardCommonProps {\n /** Optional prop to specify classNames onto the PromoCard /\n className?: string;\n\n /* Optional prop to specify the ID of the PromoCard /\n id?: string;\n\n /* Required prop to specify the descriptive text of the PromoCard /\n description: string;\n\n /\n Optional prop to specify the heading level of the PromoCard\n \n @default 'h3'\n /\n headingLevel?: 'h3' \| 'h4' \| 'h5' \| 'h6';\n\n /* Optional prop to specify text for the indicator label of the PromoCard /\n indicatorLabel?: string;\n\n /* Optional prop to specify the icon for the indicator icon of the PromoCard /\n indicatorIcon?: PromoCardIndicatorProps['icon'];\n\n /* Optional prop to specify an image alt text /\n imageAlt?: string;\n\n /* Optional prop to specify an image class /\n imageClass?: string;\n\n /* Optional prop to specify an image source url /\n imageSource?: string;\n\n /* Specify whether the PromoCard is disabled, or not /\n isDisabled?: boolean;\n\n /* Specify an onClick event handler /\n onClick?: () => void;\n\n /* Specify an onKeyDown event handler /\n onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n\n /* Optional prop to specify the ID used for testing /\n testId?: string;\n\n /* Required prop to specify the title text of the PromoCard /\n title: string;\n\n /* Set to false to use body font style for the title /\n useDisplayFont?: boolean;\n\n ref?: ReferenceType;\n}\n\nexport interface PromoCardLinkProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /\n Optional prop to prompts a user to save the linked URL instead of\n * navigating to it\n /\n download?: string;\n\n /* Optionally specify an href for your PromoCard to contain an <a> element /\n href?: string;\n\n /* Optionally specify the language of the linked URL /\n hrefLang?: string;\n\n /* Optional property that can be pass a ref for the anchor. /\n anchorRef?: React.Ref<HTMLAnchorElement>;\n\n /\n Optional prop to specify the ID of the anchor element which can be useful when using a ref.\n /\n anchorId?: string;\n\n /\n Relationship between the PromoCard href URL and the current page. See\n * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel).\n /\n rel?: RelatedTypes;\n\n /* Optional prop to to display where the linked URL will show /\n target?: React.HTMLAttributeAnchorTarget;\n\n /* Only applies to role=\"radio\" or \"checkbox\" /\n defaultChecked?: never;\n isChecked?: never;\n tabIndex?: never;\n type?: never;\n ref?: ReferenceType;\n value?: never;\n}\n\nexport interface PromoCardCheckedProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /* Specify the initial checked attribute of the PromoCard /\n defaultChecked?: boolean;\n\n /* Specify whether the PromoCard is checked, or not /\n isChecked?: boolean;\n\n /* Optional prop to specify the tabIndex of the PromoCard /\n tabIndex?: number;\n\n /* Optional property to provide component Ref /\n ref?: ReferenceType;\n\n /* Optional prop to specify the input type of the PromoCard /\n type?: 'checkbox' \| 'radio';\n\n /* Specify the value attribute of the PromoCard if Checkbox or Radio /\n value?: string;\n\n /* Only applies to <a />s /\n download?: never;\n href?: never;\n anchorRef?: never;\n anchorId?: never;\n hrefLang?: never;\n rel?: never;\n target?: never;\n}\n\nexport type PromoCardProps = PromoCardLinkProps \| PromoCardCheckedProps;\n\nexport type PolymorphicPromoCard = (\n props: PromoCardLinkProps \| PromoCardCheckedProps,\n) => React.JSX.Element;\n\n/\n PromoCard component.\n \n PromoCard is a marketing style component that is used to group marketing\n * product related information (such as choosing Card types). It can be used to\n * display information in a structured way, and can be customized with various\n * props to suit different use cases.\n \n @component\n * @param {string} className - Additional class name for the PromoCard.\n * @param {string} description - Description text for the PromoCard.\n * @param {boolean} defaultChecked - Initial checked state for checkboxes and radios.\n * @param {string} download - Download file name for links.\n * @param {string} href - URL for links.\n * @param {string} hrefLang - Language code for linked URL.\n * @param {string} id - ID of the PromoCard.\n * @param {string} imageAlt - Alt text for the image.\n * @param {string} imageSource - Source URL of the image.\n * @param {string} indicatorLabel - Label for the indicator icon.\n * @param {boolean} isChecked - Checked state for checkboxes and radios.\n * @param {boolean} isDisabled - Whether the PromoCard is disabled.\n * @param {Function} onClick - Click event handler for the PromoCard.\n * @param {string} rel - Relationship between the URL and the current page.\n * @param {number} tabIndex - Tab index for keyboard navigation.\n * @param {string} target - Target window for links.\n * @param {string} testId - ID used for testing.\n * @param {string} title - Title text of the PromoCard.\n * @param {('checkbox'\|'radio')} type - Type of the PromoCard (checkbox, radio).\n * @param {string} value - Value for checkboxes and radios.\n * @returns {React.JSX.Element} The rendered PromoCard component.\n * @example\n * <PromoCard\n * title=\"Example PromoCard\"\n * description=\"This is an example PromoCard with a link variation.\"\n * href=\"https://example.com\"\n * target=\"_blank\"\n * imageSource=\"https://example.com/image.png\"\n * imageAlt=\"Example Image\"\n * indicatorLabel=\"Learn More\"\n * />\n */\nconst PromoCard: FunctionComponent<PromoCardProps> = forwardRef(\n (\n {\n className,\n description,\n defaultChecked,\n download,\n href,\n hrefLang,\n id,\n headingLevel = 'h3',\n imageAlt,\n imageClass,\n imageSource,\n indicatorLabel,\n indicatorIcon,\n isChecked,\n isDisabled,\n onClick,\n onKeyDown,\n rel,\n tabIndex,\n target,\n testId,\n title,\n type,\n value,\n isSmall,\n useDisplayFont = true,\n anchorRef,\n anchorId,\n ...props\n },\n ref: ReferenceType,\n ) => {\n // Set the `checked` state to the value of `defaultChecked` if it is truthy,\n // or the value of `isChecked` if it is truthy, or `false` if neither\n // is truthy.\n const { state, onChange, isDisabled: contextIsDisabled } = usePromoCardContext();\n const [checked, setChecked] = useState(\n type === 'checkbox' ? (defaultChecked ?? isChecked ?? false) : false,\n );\n\n const handleClick = () => {\n if (type === 'radio') {\n onChange(value \|\| ''); // Update the context state for radio\n } else if (type === 'checkbox') {\n setChecked(!checked); // Update local state for checkbox\n }\n };\n\n const fallbackId = useId();\n const componentId = id \|\| fallbackId;\n\n // Set the icon to `'arrow'` if `href` is truthy and `type` is falsy, or\n // `'download'` if `download` is truthy. If neither condition is true, set\n // `icon` to `undefined`.\n\n // Create a function to get icon type\n const getIconType = () => {\n if (indicatorIcon) {\n return indicatorIcon;\n }\n\n if (download) {\n return 'download';\n }\n\n if (href && !type) {\n return 'arrow';\n }\n\n return undefined;\n };\n\n const CardTitle = useDisplayFont ? Display : Title;\n\n // Define all class names string based on the values of the `href`, `type`,\n // `checked`, and `className` props.\n const commonClasses = clsx(\n {\n 'np-Card--promoCard': true,\n 'np-Card--checked': !href && type,\n 'np-Card--link': href && !type,\n 'is-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n },\n className,\n );\n\n // Object with common props that will be passed to the `Card` components\n const commonProps = {\n className: commonClasses,\n id: componentId,\n isDisabled: isDisabled \|\| contextIsDisabled,\n onClick,\n onKeyDown,\n ref,\n 'data-testid': testId,\n isSmall,\n };\n\n // Object with Anchor props that will be passed to the `a` element. These\n // won't be refurned if set to `isDisabled`\n const anchorProps =\n href && !isDisabled\n ? {\n download,\n href: href \|\| undefined,\n hrefLang,\n rel,\n target,\n ref: anchorRef,\n id: anchorId,\n }\n : {};\n\n // Object of all Checked props that will be passed to the root `Card` component\n const checkedProps =\n (type === 'checkbox' \|\| type === 'radio') && !href\n ? {\n ...commonProps,\n 'aria-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n 'aria-describedby': `${componentId}-title`,\n 'aria-disabled': isDisabled,\n 'data-value': value ?? undefined,\n role: type === 'checkbox' \|\| type === 'radio' ? type : undefined,\n onClick: handleClick,\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n handleClick();\n }\n },\n ref,\n tabIndex: 0,\n }\n : {};\n\n const getTitle = () => {\n const titleContent =\n href && !type ? (\n <a className=\"np-Card-titleLink\" {...anchorProps}>\n {title}\n </a>\n ) : (\n title\n );\n\n const titleProps = {\n id: `${componentId}-title`,\n as: headingLevel,\n className: 'np-Card-title',\n };\n\n return useDisplayFont ? (\n <Display type={Typography.DISPLAY_SMALL} {...titleProps}>\n {titleContent}\n </Display>\n ) : (\n <Title type={Typography.TITLE_SUBSECTION} {...titleProps}>\n {titleContent}\n </Title>\n );\n };\n\n useEffect(() => {\n setChecked(defaultChecked ?? isChecked ?? false);\n }, [defaultChecked, isChecked]);\n\n return (\n <Card {...commonProps} {...checkedProps} {...props}>\n {(value === state \|\| checked) && (\n <span className=\"np-Card-check\">\n <Check size={24} aria-hidden=\"true\" />\n </span>\n )}\n\n {getTitle()}\n\n <Body className=\"np-Card-description\">{description}</Body>\n\n {imageSource && (\n <div className={clsx('np-Card-image', { imageClass })}>\n <Image src={imageSource} alt={imageAlt \|\| ''} loading=\"lazy\" />\n </div>\n )}\n\n <PromoCardIndicator label={indicatorLabel} icon={getIconType()} isSmall={isSmall} />\n </Card>\n );\n },\n) as PolymorphicPromoCard;\n\nexport default React.memo(PromoCard);\n"],"names":["PromoCard","forwardRef","className","description","defaultChecked","download","href","hrefLang","id","headingLevel","imageAlt","imageClass","imageSource","indicatorLabel","indicatorIcon","isChecked","isDisabled","onClick","onKeyDown","rel","tabIndex","target","testId","title","type","value","isSmall","useDisplayFont","anchorRef","anchorId","props","ref","state","onChange","contextIsDisabled","usePromoCardContext","checked","setChecked","useState","handleClick","fallbackId","useId","componentId","getIconType","undefined","commonClasses","clsx","commonProps","anchorProps","checkedProps","role","event","key","getTitle","titleContent","_jsx","children","titleProps","as","Display","Typography","DISPLAY_SMALL","Title","TITLE_SUBSECTION","useEffect","_jsxs","Card","Check","size","Body","Image","src","alt","loading","PromoCardIndicator","label","icon","React","memo"],"mappings":"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"}
1	+ {"version":3,"file":"PromoCard.js","sources":["../../src/promoCard/PromoCard.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport React, { forwardRef, FunctionComponent, useEffect, useId, useState } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Card, { type CardProps } from '../common/card';\nimport Display from '../display';\nimport Image from '../image/Image';\nimport Title from '../title';\n\nimport { usePromoCardContext } from './PromoCardContext';\nimport PromoCardIndicator, { type PromoCardIndicatorProps } from './PromoCardIndicator';\n\nexport type ReferenceType = React.Ref<HTMLInputElement> \| React.Ref<HTMLDivElement>;\nexport type RelatedTypes =\n \| ''\n \| 'alternate'\n \| 'author'\n \| 'bookmark'\n \| 'external'\n \| 'help'\n \| 'license'\n \| 'next'\n \| 'nofollow'\n \| 'noreferrer'\n \| 'noopener'\n \| 'prev'\n \| 'search'\n \| 'tag';\n\nexport interface PromoCardCommonProps {\n /** Optional prop to specify classNames onto the PromoCard /\n className?: string;\n\n /* Optional prop to specify the ID of the PromoCard /\n id?: string;\n\n /* Required prop to specify the descriptive text of the PromoCard /\n description: string;\n\n /\n Optional prop to specify the heading level of the PromoCard\n \n @default 'h3'\n /\n headingLevel?: 'h3' \| 'h4' \| 'h5' \| 'h6';\n\n /* Optional prop to specify text for the indicator label of the PromoCard /\n indicatorLabel?: string;\n\n /* Optional prop to specify the icon for the indicator icon of the PromoCard /\n indicatorIcon?: PromoCardIndicatorProps['icon'];\n\n /* Optional prop to specify an image alt text /\n imageAlt?: string;\n\n /* Optional prop to specify an image class /\n imageClass?: string;\n\n /* Optional prop to specify an image source url /\n imageSource?: string;\n\n /* Specify whether the PromoCard is disabled, or not /\n isDisabled?: boolean;\n\n /* Specify an onClick event handler /\n onClick?: () => void;\n\n /* Specify an onKeyDown event handler /\n onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n\n /* Optional prop to specify the ID used for testing /\n testId?: string;\n\n /* Required prop to specify the title text of the PromoCard /\n title: string;\n\n /* Set to false to use body font style for the title /\n useDisplayFont?: boolean;\n\n ref?: ReferenceType;\n}\n\nexport interface PromoCardLinkProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /\n Optional prop to prompts a user to save the linked URL instead of\n * navigating to it\n /\n download?: string;\n\n /* Optionally specify an href for your PromoCard to contain an <a> element /\n href?: string;\n\n /* Optionally specify the language of the linked URL /\n hrefLang?: string;\n\n /* Optional property that can be pass a ref for the anchor. /\n anchorRef?: React.Ref<HTMLAnchorElement>;\n\n /\n Optional prop to specify the ID of the anchor element which can be useful when using a ref.\n /\n anchorId?: string;\n\n /\n Relationship between the PromoCard href URL and the current page. See\n * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel).\n /\n rel?: RelatedTypes;\n\n /* Optional prop to to display where the linked URL will show /\n target?: React.HTMLAttributeAnchorTarget;\n\n /* Only applies to role=\"radio\" or \"checkbox\" /\n defaultChecked?: never;\n isChecked?: never;\n tabIndex?: never;\n type?: never;\n ref?: ReferenceType;\n value?: never;\n}\n\nexport interface PromoCardCheckedProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /* Specify the initial checked attribute of the PromoCard /\n defaultChecked?: boolean;\n\n /* Specify whether the PromoCard is checked, or not /\n isChecked?: boolean;\n\n /* Optional prop to specify the tabIndex of the PromoCard /\n tabIndex?: number;\n\n /* Optional property to provide component Ref /\n ref?: ReferenceType;\n\n /* Optional prop to specify the input type of the PromoCard /\n type?: 'checkbox' \| 'radio';\n\n /* Specify the value attribute of the PromoCard if Checkbox or Radio /\n value?: string;\n\n /* Only applies to <a />s /\n download?: never;\n href?: never;\n anchorRef?: never;\n anchorId?: never;\n hrefLang?: never;\n rel?: never;\n target?: never;\n}\n\nexport type PromoCardProps = PromoCardLinkProps \| PromoCardCheckedProps;\n\nexport type PolymorphicPromoCard = (\n props: PromoCardLinkProps \| PromoCardCheckedProps,\n) => React.JSX.Element;\n\n/\n PromoCard component.\n \n PromoCard is a marketing style component that is used to group marketing\n * product related information (such as choosing Card types). It can be used to\n * display information in a structured way, and can be customized with various\n * props to suit different use cases.\n \n @component\n * @param {string} className - Additional class name for the PromoCard.\n * @param {string} description - Description text for the PromoCard.\n * @param {boolean} defaultChecked - Initial checked state for checkboxes and radios.\n * @param {string} download - Download file name for links.\n * @param {string} href - URL for links.\n * @param {string} hrefLang - Language code for linked URL.\n * @param {string} id - ID of the PromoCard.\n * @param {string} imageAlt - Alt text for the image.\n * @param {string} imageSource - Source URL of the image.\n * @param {string} indicatorLabel - Label for the indicator icon.\n * @param {boolean} isChecked - Checked state for checkboxes and radios.\n * @param {boolean} isDisabled - Whether the PromoCard is disabled.\n * @param {Function} onClick - Click event handler for the PromoCard.\n * @param {string} rel - Relationship between the URL and the current page.\n * @param {number} tabIndex - Tab index for keyboard navigation.\n * @param {string} target - Target window for links.\n * @param {string} testId - ID used for testing.\n * @param {string} title - Title text of the PromoCard.\n * @param {('checkbox'\|'radio')} type - Type of the PromoCard (checkbox, radio).\n * @param {string} value - Value for checkboxes and radios.\n * @returns {React.JSX.Element} The rendered PromoCard component.\n * @example\n * <PromoCard\n * title=\"Example PromoCard\"\n * description=\"This is an example PromoCard with a link variation.\"\n * href=\"https://example.com\"\n * target=\"_blank\"\n * imageSource=\"https://example.com/image.png\"\n * imageAlt=\"Example Image\"\n * indicatorLabel=\"Learn More\"\n * />\n */\nconst PromoCard: FunctionComponent<PromoCardProps> = forwardRef(\n (\n {\n className,\n description,\n defaultChecked,\n download,\n href,\n hrefLang,\n id,\n headingLevel = 'h3',\n imageAlt,\n imageClass,\n imageSource,\n indicatorLabel,\n indicatorIcon,\n isChecked,\n isDisabled,\n onClick,\n onKeyDown,\n rel,\n tabIndex,\n target,\n testId,\n title,\n type,\n value,\n isSmall,\n useDisplayFont = true,\n anchorRef,\n anchorId,\n ...props\n },\n ref: ReferenceType,\n ) => {\n // Set the `checked` state to the value of `defaultChecked` if it is truthy,\n // or the value of `isChecked` if it is truthy, or `false` if neither\n // is truthy.\n const { state, onChange, isDisabled: contextIsDisabled } = usePromoCardContext();\n const [checked, setChecked] = useState(\n type === 'checkbox' ? (defaultChecked ?? isChecked ?? false) : false,\n );\n\n const handleClick = () => {\n if (type === 'radio') {\n onChange(value \|\| ''); // Update the context state for radio\n } else if (type === 'checkbox') {\n setChecked(!checked); // Update local state for checkbox\n }\n };\n\n const fallbackId = useId();\n const componentId = id \|\| fallbackId;\n\n // Set the icon to `'arrow'` if `href` is truthy and `type` is falsy, or\n // `'download'` if `download` is truthy. If neither condition is true, set\n // `icon` to `undefined`.\n\n // Create a function to get icon type\n const getIconType = () => {\n if (indicatorIcon) {\n return indicatorIcon;\n }\n\n if (download) {\n return 'download';\n }\n\n if (href && !type) {\n return 'arrow';\n }\n\n return undefined;\n };\n\n const CardTitle = useDisplayFont ? Display : Title;\n\n // Define all class names string based on the values of the `href`, `type`,\n // `checked`, and `className` props.\n const commonClasses = clsx(\n {\n 'np-Card--promoCard': true,\n 'np-Card--checked': !href && type,\n 'np-Card--link': href && !type,\n 'is-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n },\n className,\n );\n\n // Object with common props that will be passed to the `Card` components\n const commonProps = {\n className: commonClasses,\n id: componentId,\n isDisabled: isDisabled \|\| contextIsDisabled,\n onClick,\n onKeyDown,\n ref,\n 'data-testid': testId,\n isSmall,\n };\n\n // Object with Anchor props that will be passed to the `a` element. These\n // won't be refurned if set to `isDisabled`\n const anchorProps =\n href && !isDisabled\n ? {\n download,\n href: href \|\| undefined,\n hrefLang,\n rel,\n target,\n ref: anchorRef,\n id: anchorId,\n }\n : {};\n\n // Object of all Checked props that will be passed to the root `Card` component\n const checkedProps =\n (type === 'checkbox' \|\| type === 'radio') && !href\n ? {\n ...commonProps,\n 'aria-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n 'aria-describedby': `${componentId}-title`,\n 'aria-disabled': isDisabled,\n 'data-value': value ?? undefined,\n role: type === 'checkbox' \|\| type === 'radio' ? type : undefined,\n onClick: handleClick,\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n handleClick();\n }\n },\n ref,\n tabIndex: 0,\n }\n : {};\n\n const getTitle = () => {\n const titleContent =\n href && !type ? (\n <a className=\"np-Card-titleLink\" {...anchorProps}>\n {title}\n </a>\n ) : (\n title\n );\n\n const titleProps = {\n id: `${componentId}-title`,\n as: headingLevel,\n className: 'np-Card-title',\n };\n\n return useDisplayFont ? (\n <Display type={Typography.DISPLAY_SMALL} {...titleProps}>\n {titleContent}\n </Display>\n ) : (\n <Title type={Typography.TITLE_SUBSECTION} {...titleProps}>\n {titleContent}\n </Title>\n );\n };\n\n useEffect(() => {\n setChecked(defaultChecked ?? isChecked ?? false);\n }, [defaultChecked, isChecked]);\n\n return (\n <Card {...commonProps} {...checkedProps} {...props}>\n {(value === state \|\| checked) && (\n <span className=\"np-Card-check\">\n <Check size={24} aria-hidden=\"true\" />\n </span>\n )}\n\n {getTitle()}\n\n <Body className=\"np-Card-description\">{description}</Body>\n\n {imageSource && (\n <div className={clsx('np-Card-image', { imageClass })}>\n <Image src={imageSource} alt={imageAlt \|\| ''} loading=\"lazy\" />\n </div>\n )}\n\n <PromoCardIndicator label={indicatorLabel} icon={getIconType()} isSmall={isSmall} />\n </Card>\n );\n },\n) as PolymorphicPromoCard;\n\nexport default React.memo(PromoCard);\n"],"names":["PromoCard","forwardRef","className","description","defaultChecked","download","href","hrefLang","id","headingLevel","imageAlt","imageClass","imageSource","indicatorLabel","indicatorIcon","isChecked","isDisabled","onClick","onKeyDown","rel","tabIndex","target","testId","title","type","value","isSmall","useDisplayFont","anchorRef","anchorId","props","ref","state","onChange","contextIsDisabled","usePromoCardContext","checked","setChecked","useState","handleClick","fallbackId","useId","componentId","getIconType","undefined","commonClasses","clsx","commonProps","anchorProps","checkedProps","role","event","key","getTitle","titleContent","_jsx","children","titleProps","as","Display","Typography","DISPLAY_SMALL","Title","TITLE_SUBSECTION","useEffect","_jsxs","Card","Check","size","Body","Image","src","alt","loading","PromoCardIndicator","label","icon","React","memo"],"mappings":"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"}

package/build/promoCard/PromoCard.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PromoCard.mjs","sources":["../../src/promoCard/PromoCard.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport React, { forwardRef, FunctionComponent, useEffect, useId, useState } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Card, { type CardProps } from '../common/card';\nimport Display from '../display';\nimport Image from '../image/Image';\nimport Title from '../title';\n\nimport { usePromoCardContext } from './PromoCardContext';\nimport PromoCardIndicator, { type PromoCardIndicatorProps } from './PromoCardIndicator';\n\nexport type ReferenceType = React.Ref<HTMLInputElement> \| React.Ref<HTMLDivElement>;\nexport type RelatedTypes =\n \| ''\n \| 'alternate'\n \| 'author'\n \| 'bookmark'\n \| 'external'\n \| 'help'\n \| 'license'\n \| 'next'\n \| 'nofollow'\n \| 'noreferrer'\n \| 'noopener'\n \| 'prev'\n \| 'search'\n \| 'tag';\n\nexport interface PromoCardCommonProps {\n /** Optional prop to specify classNames onto the PromoCard /\n className?: string;\n\n /* Optional prop to specify the ID of the PromoCard /\n id?: string;\n\n /* Required prop to specify the descriptive text of the PromoCard /\n description: string;\n\n /\n Optional prop to specify the heading level of the PromoCard\n \n @default 'h3'\n /\n headingLevel?: 'h3' \| 'h4' \| 'h5' \| 'h6';\n\n /* Optional prop to specify text for the indicator label of the PromoCard /\n indicatorLabel?: string;\n\n /* Optional prop to specify the icon for the indicator icon of the PromoCard /\n indicatorIcon?: PromoCardIndicatorProps['icon'];\n\n /* Optional prop to specify an image alt text /\n imageAlt?: string;\n\n /* Optional prop to specify an image class /\n imageClass?: string;\n\n /* Optional prop to specify an image source url /\n imageSource?: string;\n\n /* Specify whether the PromoCard is disabled, or not /\n isDisabled?: boolean;\n\n /* Specify an onClick event handler /\n onClick?: () => void;\n\n /* Specify an onKeyDown event handler /\n onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n\n /* Optional prop to specify the ID used for testing /\n testId?: string;\n\n /* Required prop to specify the title text of the PromoCard /\n title: string;\n\n /* Set to false to use body font style for the title /\n useDisplayFont?: boolean;\n\n ref?: ReferenceType;\n}\n\nexport interface PromoCardLinkProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /\n Optional prop to prompts a user to save the linked URL instead of\n * navigating to it\n /\n download?: string;\n\n /* Optionally specify an href for your PromoCard to contain an <a> element /\n href?: string;\n\n /* Optionally specify the language of the linked URL /\n hrefLang?: string;\n\n /* Optional property that can be pass a ref for the anchor. /\n anchorRef?: React.Ref<HTMLAnchorElement>;\n\n /\n Optional prop to specify the ID of the anchor element which can be useful when using a ref.\n /\n anchorId?: string;\n\n /\n Relationship between the PromoCard href URL and the current page. See\n * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel).\n /\n rel?: RelatedTypes;\n\n /* Optional prop to to display where the linked URL will show /\n target?: React.HTMLAttributeAnchorTarget;\n\n /* Only applies to role=\"radio\" or \"checkbox\" /\n defaultChecked?: never;\n isChecked?: never;\n tabIndex?: never;\n type?: never;\n ref?: ReferenceType;\n value?: never;\n}\n\nexport interface PromoCardCheckedProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /* Specify the initial checked attribute of the PromoCard /\n defaultChecked?: boolean;\n\n /* Specify whether the PromoCard is checked, or not /\n isChecked?: boolean;\n\n /* Optional prop to specify the tabIndex of the PromoCard /\n tabIndex?: number;\n\n /* Optional property to provide component Ref /\n ref?: ReferenceType;\n\n /* Optional prop to specify the input type of the PromoCard /\n type?: 'checkbox' \| 'radio';\n\n /* Specify the value attribute of the PromoCard if Checkbox or Radio /\n value?: string;\n\n /* Only applies to <a />s /\n download?: never;\n href?: never;\n anchorRef?: never;\n anchorId?: never;\n hrefLang?: never;\n rel?: never;\n target?: never;\n}\n\nexport type PromoCardProps = PromoCardLinkProps \| PromoCardCheckedProps;\n\nexport type PolymorphicPromoCard = (\n props: PromoCardLinkProps \| PromoCardCheckedProps,\n) => React.JSX.Element;\n\n/\n PromoCard component.\n \n PromoCard is a marketing style component that is used to group marketing\n * product related information (such as choosing Card types). It can be used to\n * display information in a structured way, and can be customized with various\n * props to suit different use cases.\n \n @component\n * @param {string} className - Additional class name for the PromoCard.\n * @param {string} description - Description text for the PromoCard.\n * @param {boolean} defaultChecked - Initial checked state for checkboxes and radios.\n * @param {string} download - Download file name for links.\n * @param {string} href - URL for links.\n * @param {string} hrefLang - Language code for linked URL.\n * @param {string} id - ID of the PromoCard.\n * @param {string} imageAlt - Alt text for the image.\n * @param {string} imageSource - Source URL of the image.\n * @param {string} indicatorLabel - Label for the indicator icon.\n * @param {boolean} isChecked - Checked state for checkboxes and radios.\n * @param {boolean} isDisabled - Whether the PromoCard is disabled.\n * @param {Function} onClick - Click event handler for the PromoCard.\n * @param {string} rel - Relationship between the URL and the current page.\n * @param {number} tabIndex - Tab index for keyboard navigation.\n * @param {string} target - Target window for links.\n * @param {string} testId - ID used for testing.\n * @param {string} title - Title text of the PromoCard.\n * @param {('checkbox'\|'radio')} type - Type of the PromoCard (checkbox, radio).\n * @param {string} value - Value for checkboxes and radios.\n * @returns {React.JSX.Element} The rendered PromoCard component.\n * @example\n * <PromoCard\n * title=\"Example PromoCard\"\n * description=\"This is an example PromoCard with a link variation.\"\n * href=\"https://example.com\"\n * target=\"_blank\"\n * imageSource=\"https://example.com/image.png\"\n * imageAlt=\"Example Image\"\n * indicatorLabel=\"Learn More\"\n * />\n */\nconst PromoCard: FunctionComponent<PromoCardProps> = forwardRef(\n (\n {\n className,\n description,\n defaultChecked,\n download,\n href,\n hrefLang,\n id,\n headingLevel = 'h3',\n imageAlt,\n imageClass,\n imageSource,\n indicatorLabel,\n indicatorIcon,\n isChecked,\n isDisabled,\n onClick,\n onKeyDown,\n rel,\n tabIndex,\n target,\n testId,\n title,\n type,\n value,\n isSmall,\n useDisplayFont = true,\n anchorRef,\n anchorId,\n ...props\n },\n ref: ReferenceType,\n ) => {\n // Set the `checked` state to the value of `defaultChecked` if it is truthy,\n // or the value of `isChecked` if it is truthy, or `false` if neither\n // is truthy.\n const { state, onChange, isDisabled: contextIsDisabled } = usePromoCardContext();\n const [checked, setChecked] = useState(\n type === 'checkbox' ? (defaultChecked ?? isChecked ?? false) : false,\n );\n\n const handleClick = () => {\n if (type === 'radio') {\n onChange(value \|\| ''); // Update the context state for radio\n } else if (type === 'checkbox') {\n setChecked(!checked); // Update local state for checkbox\n }\n };\n\n const fallbackId = useId();\n const componentId = id \|\| fallbackId;\n\n // Set the icon to `'arrow'` if `href` is truthy and `type` is falsy, or\n // `'download'` if `download` is truthy. If neither condition is true, set\n // `icon` to `undefined`.\n\n // Create a function to get icon type\n const getIconType = () => {\n if (indicatorIcon) {\n return indicatorIcon;\n }\n\n if (download) {\n return 'download';\n }\n\n if (href && !type) {\n return 'arrow';\n }\n\n return undefined;\n };\n\n const CardTitle = useDisplayFont ? Display : Title;\n\n // Define all class names string based on the values of the `href`, `type`,\n // `checked`, and `className` props.\n const commonClasses = clsx(\n {\n 'np-Card--promoCard': true,\n 'np-Card--checked': !href && type,\n 'np-Card--link': href && !type,\n 'is-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n },\n className,\n );\n\n // Object with common props that will be passed to the `Card` components\n const commonProps = {\n className: commonClasses,\n id: componentId,\n isDisabled: isDisabled \|\| contextIsDisabled,\n onClick,\n onKeyDown,\n ref,\n 'data-testid': testId,\n isSmall,\n };\n\n // Object with Anchor props that will be passed to the `a` element. These\n // won't be refurned if set to `isDisabled`\n const anchorProps =\n href && !isDisabled\n ? {\n download,\n href: href \|\| undefined,\n hrefLang,\n rel,\n target,\n ref: anchorRef,\n id: anchorId,\n }\n : {};\n\n // Object of all Checked props that will be passed to the root `Card` component\n const checkedProps =\n (type === 'checkbox' \|\| type === 'radio') && !href\n ? {\n ...commonProps,\n 'aria-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n 'aria-describedby': `${componentId}-title`,\n 'aria-disabled': isDisabled,\n 'data-value': value ?? undefined,\n role: type === 'checkbox' \|\| type === 'radio' ? type : undefined,\n onClick: handleClick,\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n handleClick();\n }\n },\n ref,\n tabIndex: 0,\n }\n : {};\n\n const getTitle = () => {\n const titleContent =\n href && !type ? (\n <a className=\"np-Card-titleLink\" {...anchorProps}>\n {title}\n </a>\n ) : (\n title\n );\n\n const titleProps = {\n id: `${componentId}-title`,\n as: headingLevel,\n className: 'np-Card-title',\n };\n\n return useDisplayFont ? (\n <Display type={Typography.DISPLAY_SMALL} {...titleProps}>\n {titleContent}\n </Display>\n ) : (\n <Title type={Typography.TITLE_SUBSECTION} {...titleProps}>\n {titleContent}\n </Title>\n );\n };\n\n useEffect(() => {\n setChecked(defaultChecked ?? isChecked ?? false);\n }, [defaultChecked, isChecked]);\n\n return (\n <Card {...commonProps} {...checkedProps} {...props}>\n {(value === state \|\| checked) && (\n <span className=\"np-Card-check\">\n <Check size={24} aria-hidden=\"true\" />\n </span>\n )}\n\n {getTitle()}\n\n <Body className=\"np-Card-description\">{description}</Body>\n\n {imageSource && (\n <div className={clsx('np-Card-image', { imageClass })}>\n <Image src={imageSource} alt={imageAlt \|\| ''} loading=\"lazy\" />\n </div>\n )}\n\n <PromoCardIndicator label={indicatorLabel} icon={getIconType()} isSmall={isSmall} />\n </Card>\n );\n },\n) as PolymorphicPromoCard;\n\nexport default React.memo(PromoCard);\n"],"names":["PromoCard","forwardRef","className","description","defaultChecked","download","href","hrefLang","id","headingLevel","imageAlt","imageClass","imageSource","indicatorLabel","indicatorIcon","isChecked","isDisabled","onClick","onKeyDown","rel","tabIndex","target","testId","title","type","value","isSmall","useDisplayFont","anchorRef","anchorId","props","ref","state","onChange","contextIsDisabled","usePromoCardContext","checked","setChecked","useState","handleClick","fallbackId","useId","componentId","getIconType","undefined","commonClasses","clsx","commonProps","anchorProps","checkedProps","role","event","key","getTitle","titleContent","_jsx","children","titleProps","as","Display","Typography","DISPLAY_SMALL","Title","TITLE_SUBSECTION","useEffect","_jsxs","Card","Check","size","Body","Image","src","alt","loading","PromoCardIndicator","label","icon","React","memo"],"mappings":"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"}
1	+ {"version":3,"file":"PromoCard.mjs","sources":["../../src/promoCard/PromoCard.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport React, { forwardRef, FunctionComponent, useEffect, useId, useState } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Card, { type CardProps } from '../common/card';\nimport Display from '../display';\nimport Image from '../image/Image';\nimport Title from '../title';\n\nimport { usePromoCardContext } from './PromoCardContext';\nimport PromoCardIndicator, { type PromoCardIndicatorProps } from './PromoCardIndicator';\n\nexport type ReferenceType = React.Ref<HTMLInputElement> \| React.Ref<HTMLDivElement>;\nexport type RelatedTypes =\n \| ''\n \| 'alternate'\n \| 'author'\n \| 'bookmark'\n \| 'external'\n \| 'help'\n \| 'license'\n \| 'next'\n \| 'nofollow'\n \| 'noreferrer'\n \| 'noopener'\n \| 'prev'\n \| 'search'\n \| 'tag';\n\nexport interface PromoCardCommonProps {\n /** Optional prop to specify classNames onto the PromoCard /\n className?: string;\n\n /* Optional prop to specify the ID of the PromoCard /\n id?: string;\n\n /* Required prop to specify the descriptive text of the PromoCard /\n description: string;\n\n /\n Optional prop to specify the heading level of the PromoCard\n \n @default 'h3'\n /\n headingLevel?: 'h3' \| 'h4' \| 'h5' \| 'h6';\n\n /* Optional prop to specify text for the indicator label of the PromoCard /\n indicatorLabel?: string;\n\n /* Optional prop to specify the icon for the indicator icon of the PromoCard /\n indicatorIcon?: PromoCardIndicatorProps['icon'];\n\n /* Optional prop to specify an image alt text /\n imageAlt?: string;\n\n /* Optional prop to specify an image class /\n imageClass?: string;\n\n /* Optional prop to specify an image source url /\n imageSource?: string;\n\n /* Specify whether the PromoCard is disabled, or not /\n isDisabled?: boolean;\n\n /* Specify an onClick event handler /\n onClick?: () => void;\n\n /* Specify an onKeyDown event handler /\n onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n\n /* Optional prop to specify the ID used for testing /\n testId?: string;\n\n /* Required prop to specify the title text of the PromoCard /\n title: string;\n\n /* Set to false to use body font style for the title /\n useDisplayFont?: boolean;\n\n ref?: ReferenceType;\n}\n\nexport interface PromoCardLinkProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /\n Optional prop to prompts a user to save the linked URL instead of\n * navigating to it\n /\n download?: string;\n\n /* Optionally specify an href for your PromoCard to contain an <a> element /\n href?: string;\n\n /* Optionally specify the language of the linked URL /\n hrefLang?: string;\n\n /* Optional property that can be pass a ref for the anchor. /\n anchorRef?: React.Ref<HTMLAnchorElement>;\n\n /\n Optional prop to specify the ID of the anchor element which can be useful when using a ref.\n /\n anchorId?: string;\n\n /\n Relationship between the PromoCard href URL and the current page. See\n * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel).\n /\n rel?: RelatedTypes;\n\n /* Optional prop to to display where the linked URL will show /\n target?: React.HTMLAttributeAnchorTarget;\n\n /* Only applies to role=\"radio\" or \"checkbox\" /\n defaultChecked?: never;\n isChecked?: never;\n tabIndex?: never;\n type?: never;\n ref?: ReferenceType;\n value?: never;\n}\n\nexport interface PromoCardCheckedProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /* Specify the initial checked attribute of the PromoCard /\n defaultChecked?: boolean;\n\n /* Specify whether the PromoCard is checked, or not /\n isChecked?: boolean;\n\n /* Optional prop to specify the tabIndex of the PromoCard /\n tabIndex?: number;\n\n /* Optional property to provide component Ref /\n ref?: ReferenceType;\n\n /* Optional prop to specify the input type of the PromoCard /\n type?: 'checkbox' \| 'radio';\n\n /* Specify the value attribute of the PromoCard if Checkbox or Radio /\n value?: string;\n\n /* Only applies to <a />s /\n download?: never;\n href?: never;\n anchorRef?: never;\n anchorId?: never;\n hrefLang?: never;\n rel?: never;\n target?: never;\n}\n\nexport type PromoCardProps = PromoCardLinkProps \| PromoCardCheckedProps;\n\nexport type PolymorphicPromoCard = (\n props: PromoCardLinkProps \| PromoCardCheckedProps,\n) => React.JSX.Element;\n\n/\n PromoCard component.\n \n PromoCard is a marketing style component that is used to group marketing\n * product related information (such as choosing Card types). It can be used to\n * display information in a structured way, and can be customized with various\n * props to suit different use cases.\n \n @component\n * @param {string} className - Additional class name for the PromoCard.\n * @param {string} description - Description text for the PromoCard.\n * @param {boolean} defaultChecked - Initial checked state for checkboxes and radios.\n * @param {string} download - Download file name for links.\n * @param {string} href - URL for links.\n * @param {string} hrefLang - Language code for linked URL.\n * @param {string} id - ID of the PromoCard.\n * @param {string} imageAlt - Alt text for the image.\n * @param {string} imageSource - Source URL of the image.\n * @param {string} indicatorLabel - Label for the indicator icon.\n * @param {boolean} isChecked - Checked state for checkboxes and radios.\n * @param {boolean} isDisabled - Whether the PromoCard is disabled.\n * @param {Function} onClick - Click event handler for the PromoCard.\n * @param {string} rel - Relationship between the URL and the current page.\n * @param {number} tabIndex - Tab index for keyboard navigation.\n * @param {string} target - Target window for links.\n * @param {string} testId - ID used for testing.\n * @param {string} title - Title text of the PromoCard.\n * @param {('checkbox'\|'radio')} type - Type of the PromoCard (checkbox, radio).\n * @param {string} value - Value for checkboxes and radios.\n * @returns {React.JSX.Element} The rendered PromoCard component.\n * @example\n * <PromoCard\n * title=\"Example PromoCard\"\n * description=\"This is an example PromoCard with a link variation.\"\n * href=\"https://example.com\"\n * target=\"_blank\"\n * imageSource=\"https://example.com/image.png\"\n * imageAlt=\"Example Image\"\n * indicatorLabel=\"Learn More\"\n * />\n */\nconst PromoCard: FunctionComponent<PromoCardProps> = forwardRef(\n (\n {\n className,\n description,\n defaultChecked,\n download,\n href,\n hrefLang,\n id,\n headingLevel = 'h3',\n imageAlt,\n imageClass,\n imageSource,\n indicatorLabel,\n indicatorIcon,\n isChecked,\n isDisabled,\n onClick,\n onKeyDown,\n rel,\n tabIndex,\n target,\n testId,\n title,\n type,\n value,\n isSmall,\n useDisplayFont = true,\n anchorRef,\n anchorId,\n ...props\n },\n ref: ReferenceType,\n ) => {\n // Set the `checked` state to the value of `defaultChecked` if it is truthy,\n // or the value of `isChecked` if it is truthy, or `false` if neither\n // is truthy.\n const { state, onChange, isDisabled: contextIsDisabled } = usePromoCardContext();\n const [checked, setChecked] = useState(\n type === 'checkbox' ? (defaultChecked ?? isChecked ?? false) : false,\n );\n\n const handleClick = () => {\n if (type === 'radio') {\n onChange(value \|\| ''); // Update the context state for radio\n } else if (type === 'checkbox') {\n setChecked(!checked); // Update local state for checkbox\n }\n };\n\n const fallbackId = useId();\n const componentId = id \|\| fallbackId;\n\n // Set the icon to `'arrow'` if `href` is truthy and `type` is falsy, or\n // `'download'` if `download` is truthy. If neither condition is true, set\n // `icon` to `undefined`.\n\n // Create a function to get icon type\n const getIconType = () => {\n if (indicatorIcon) {\n return indicatorIcon;\n }\n\n if (download) {\n return 'download';\n }\n\n if (href && !type) {\n return 'arrow';\n }\n\n return undefined;\n };\n\n const CardTitle = useDisplayFont ? Display : Title;\n\n // Define all class names string based on the values of the `href`, `type`,\n // `checked`, and `className` props.\n const commonClasses = clsx(\n {\n 'np-Card--promoCard': true,\n 'np-Card--checked': !href && type,\n 'np-Card--link': href && !type,\n 'is-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n },\n className,\n );\n\n // Object with common props that will be passed to the `Card` components\n const commonProps = {\n className: commonClasses,\n id: componentId,\n isDisabled: isDisabled \|\| contextIsDisabled,\n onClick,\n onKeyDown,\n ref,\n 'data-testid': testId,\n isSmall,\n };\n\n // Object with Anchor props that will be passed to the `a` element. These\n // won't be refurned if set to `isDisabled`\n const anchorProps =\n href && !isDisabled\n ? {\n download,\n href: href \|\| undefined,\n hrefLang,\n rel,\n target,\n ref: anchorRef,\n id: anchorId,\n }\n : {};\n\n // Object of all Checked props that will be passed to the root `Card` component\n const checkedProps =\n (type === 'checkbox' \|\| type === 'radio') && !href\n ? {\n ...commonProps,\n 'aria-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n 'aria-describedby': `${componentId}-title`,\n 'aria-disabled': isDisabled,\n 'data-value': value ?? undefined,\n role: type === 'checkbox' \|\| type === 'radio' ? type : undefined,\n onClick: handleClick,\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n handleClick();\n }\n },\n ref,\n tabIndex: 0,\n }\n : {};\n\n const getTitle = () => {\n const titleContent =\n href && !type ? (\n <a className=\"np-Card-titleLink\" {...anchorProps}>\n {title}\n </a>\n ) : (\n title\n );\n\n const titleProps = {\n id: `${componentId}-title`,\n as: headingLevel,\n className: 'np-Card-title',\n };\n\n return useDisplayFont ? (\n <Display type={Typography.DISPLAY_SMALL} {...titleProps}>\n {titleContent}\n </Display>\n ) : (\n <Title type={Typography.TITLE_SUBSECTION} {...titleProps}>\n {titleContent}\n </Title>\n );\n };\n\n useEffect(() => {\n setChecked(defaultChecked ?? isChecked ?? false);\n }, [defaultChecked, isChecked]);\n\n return (\n <Card {...commonProps} {...checkedProps} {...props}>\n {(value === state \|\| checked) && (\n <span className=\"np-Card-check\">\n <Check size={24} aria-hidden=\"true\" />\n </span>\n )}\n\n {getTitle()}\n\n <Body className=\"np-Card-description\">{description}</Body>\n\n {imageSource && (\n <div className={clsx('np-Card-image', { imageClass })}>\n <Image src={imageSource} alt={imageAlt \|\| ''} loading=\"lazy\" />\n </div>\n )}\n\n <PromoCardIndicator label={indicatorLabel} icon={getIconType()} isSmall={isSmall} />\n </Card>\n );\n },\n) as PolymorphicPromoCard;\n\nexport default React.memo(PromoCard);\n"],"names":["PromoCard","forwardRef","className","description","defaultChecked","download","href","hrefLang","id","headingLevel","imageAlt","imageClass","imageSource","indicatorLabel","indicatorIcon","isChecked","isDisabled","onClick","onKeyDown","rel","tabIndex","target","testId","title","type","value","isSmall","useDisplayFont","anchorRef","anchorId","props","ref","state","onChange","contextIsDisabled","usePromoCardContext","checked","setChecked","useState","handleClick","fallbackId","useId","componentId","getIconType","undefined","commonClasses","clsx","commonProps","anchorProps","checkedProps","role","event","key","getTitle","titleContent","_jsx","children","titleProps","as","Display","Typography","DISPLAY_SMALL","Title","TITLE_SUBSECTION","useEffect","_jsxs","Card","Check","size","Body","Image","src","alt","loading","PromoCardIndicator","label","icon","React","memo"],"mappings":"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"}

package/build/promoCard/PromoCardContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PromoCardContext.js","sources":["../../src/promoCard/PromoCardContext.tsx"],"sourcesContent":["import React, { useContext, createContext } from 'react';\n\n/*\n The type of the PromoCard context object.\n \n The context object contains the current state of the PromoCard group, whether\n * the group is disabled or not, and a function to call when the group value\n * changes. This value is used to provide context to child PromoCard components,\n * allowing them to interact with the group and update its state.\n /\ninterface PromoCardContextType {\n /\n The current value of the PromoCard group.\n \n @default ''\n /\n state: string;\n /\n Whether the PromoCard group is disabled or not.\n \n @default false\n /\n isDisabled: boolean;\n /\n A function to call when the PromoCard group value changes.\n \n @param {string} value - The new value of the PromoCard group.\n * @default () => {}\n /\n onChange: (value: string) => void;\n}\n\nconst defaultPromoCardContext: PromoCardContextType = {\n state: '',\n isDisabled: false,\n onChange: () => {},\n};\n\n/\n The PromoCard context object.\n /\nexport const PromoCardContext = createContext<PromoCardContextType>(defaultPromoCardContext);\n\n/\n A custom hook for accessing the PromoCard context object.\n \n The `usePromoCardContext` hook is used to access the PromoCard context object\n * from within a child PromoCard component. It throws an error if the context\n * object is not available, which can help with debugging and development.\n \n @returns {PromoCardContextType} - The PromoCard context object.\n */\nexport const usePromoCardContext = (): PromoCardContextType => {\n return useContext(PromoCardContext);\n};\n\nexport default PromoCardContext;\n"],"names":["defaultPromoCardContext","state","isDisabled","onChange","PromoCardContext","createContext","usePromoCardContext","useContext"],"mappings":";;;;;;AAgCA,MAAMA,uBAAuB,GAAyB;AACpDC,EAAAA,KAAK,EAAE,EAAE;AACTC,EAAAA,UAAU,EAAE,KAAK;EACjBC,QAAQ,EAAEA,MAAK;~~CAChB~~;AAED;;AAEG;MACUC,gBAAgB,gBAAGC,mBAAa,CAAuBL,uBAAuB;AAE3F;;;;;;;;AAQG;~~AACUM~~,~~MAAAA~~,mBAAmB,GAAGA,MAA2B;EAC5D,OAAOC,gBAAU,CAACH,gBAAgB,CAAC;AACrC;;;;;;"}
1	+ {"version":3,"file":"PromoCardContext.js","sources":["../../src/promoCard/PromoCardContext.tsx"],"sourcesContent":["import React, { useContext, createContext } from 'react';\n\n/*\n The type of the PromoCard context object.\n \n The context object contains the current state of the PromoCard group, whether\n * the group is disabled or not, and a function to call when the group value\n * changes. This value is used to provide context to child PromoCard components,\n * allowing them to interact with the group and update its state.\n /\ninterface PromoCardContextType {\n /\n The current value of the PromoCard group.\n \n @default ''\n /\n state: string;\n /\n Whether the PromoCard group is disabled or not.\n \n @default false\n /\n isDisabled: boolean;\n /\n A function to call when the PromoCard group value changes.\n \n @param {string} value - The new value of the PromoCard group.\n * @default () => {}\n /\n onChange: (value: string) => void;\n}\n\nconst defaultPromoCardContext: PromoCardContextType = {\n state: '',\n isDisabled: false,\n onChange: () => {},\n};\n\n/\n The PromoCard context object.\n /\nexport const PromoCardContext = createContext<PromoCardContextType>(defaultPromoCardContext);\n\n/\n A custom hook for accessing the PromoCard context object.\n \n The `usePromoCardContext` hook is used to access the PromoCard context object\n * from within a child PromoCard component. It throws an error if the context\n * object is not available, which can help with debugging and development.\n \n @returns {PromoCardContextType} - The PromoCard context object.\n */\nexport const usePromoCardContext = (): PromoCardContextType => {\n return useContext(PromoCardContext);\n};\n\nexport default PromoCardContext;\n"],"names":["defaultPromoCardContext","state","isDisabled","onChange","PromoCardContext","createContext","usePromoCardContext","useContext"],"mappings":";;;;;;AAgCA,MAAMA,uBAAuB,GAAyB;AACpDC,EAAAA,KAAK,EAAE,EAAE;AACTC,EAAAA,UAAU,EAAE,KAAK;EACjBC,QAAQ,EAAEA,MAAK,CAAE;CAClB;AAED;;AAEG;MACUC,gBAAgB,gBAAGC,mBAAa,CAAuBL,uBAAuB;AAE3F;;;;;;;;AAQG;AACI,MAAMM,mBAAmB,GAAGA,MAA2B;EAC5D,OAAOC,gBAAU,CAACH,gBAAgB,CAAC;AACrC;;;;;;"}

package/build/promoCard/PromoCardContext.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PromoCardContext.mjs","sources":["../../src/promoCard/PromoCardContext.tsx"],"sourcesContent":["import React, { useContext, createContext } from 'react';\n\n/*\n The type of the PromoCard context object.\n \n The context object contains the current state of the PromoCard group, whether\n * the group is disabled or not, and a function to call when the group value\n * changes. This value is used to provide context to child PromoCard components,\n * allowing them to interact with the group and update its state.\n /\ninterface PromoCardContextType {\n /\n The current value of the PromoCard group.\n \n @default ''\n /\n state: string;\n /\n Whether the PromoCard group is disabled or not.\n \n @default false\n /\n isDisabled: boolean;\n /\n A function to call when the PromoCard group value changes.\n \n @param {string} value - The new value of the PromoCard group.\n * @default () => {}\n /\n onChange: (value: string) => void;\n}\n\nconst defaultPromoCardContext: PromoCardContextType = {\n state: '',\n isDisabled: false,\n onChange: () => {},\n};\n\n/\n The PromoCard context object.\n /\nexport const PromoCardContext = createContext<PromoCardContextType>(defaultPromoCardContext);\n\n/\n A custom hook for accessing the PromoCard context object.\n \n The `usePromoCardContext` hook is used to access the PromoCard context object\n * from within a child PromoCard component. It throws an error if the context\n * object is not available, which can help with debugging and development.\n \n @returns {PromoCardContextType} - The PromoCard context object.\n */\nexport const usePromoCardContext = (): PromoCardContextType => {\n return useContext(PromoCardContext);\n};\n\nexport default PromoCardContext;\n"],"names":["defaultPromoCardContext","state","isDisabled","onChange","PromoCardContext","createContext","usePromoCardContext","useContext"],"mappings":";;AAgCA,MAAMA,uBAAuB,GAAyB;AACpDC,EAAAA,KAAK,EAAE,EAAE;AACTC,EAAAA,UAAU,EAAE,KAAK;EACjBC,QAAQ,EAAEA,MAAK;~~CAChB~~;AAED;;AAEG;MACUC,gBAAgB,gBAAGC,aAAa,CAAuBL,uBAAuB;AAE3F;;;;;;;;AAQG;~~AACUM~~,~~MAAAA~~,mBAAmB,GAAGA,MAA2B;EAC5D,OAAOC,UAAU,CAACH,gBAAgB,CAAC;AACrC;;;;"}
1	+ {"version":3,"file":"PromoCardContext.mjs","sources":["../../src/promoCard/PromoCardContext.tsx"],"sourcesContent":["import React, { useContext, createContext } from 'react';\n\n/*\n The type of the PromoCard context object.\n \n The context object contains the current state of the PromoCard group, whether\n * the group is disabled or not, and a function to call when the group value\n * changes. This value is used to provide context to child PromoCard components,\n * allowing them to interact with the group and update its state.\n /\ninterface PromoCardContextType {\n /\n The current value of the PromoCard group.\n \n @default ''\n /\n state: string;\n /\n Whether the PromoCard group is disabled or not.\n \n @default false\n /\n isDisabled: boolean;\n /\n A function to call when the PromoCard group value changes.\n \n @param {string} value - The new value of the PromoCard group.\n * @default () => {}\n /\n onChange: (value: string) => void;\n}\n\nconst defaultPromoCardContext: PromoCardContextType = {\n state: '',\n isDisabled: false,\n onChange: () => {},\n};\n\n/\n The PromoCard context object.\n /\nexport const PromoCardContext = createContext<PromoCardContextType>(defaultPromoCardContext);\n\n/\n A custom hook for accessing the PromoCard context object.\n \n The `usePromoCardContext` hook is used to access the PromoCard context object\n * from within a child PromoCard component. It throws an error if the context\n * object is not available, which can help with debugging and development.\n \n @returns {PromoCardContextType} - The PromoCard context object.\n */\nexport const usePromoCardContext = (): PromoCardContextType => {\n return useContext(PromoCardContext);\n};\n\nexport default PromoCardContext;\n"],"names":["defaultPromoCardContext","state","isDisabled","onChange","PromoCardContext","createContext","usePromoCardContext","useContext"],"mappings":";;AAgCA,MAAMA,uBAAuB,GAAyB;AACpDC,EAAAA,KAAK,EAAE,EAAE;AACTC,EAAAA,UAAU,EAAE,KAAK;EACjBC,QAAQ,EAAEA,MAAK,CAAE;CAClB;AAED;;AAEG;MACUC,gBAAgB,gBAAGC,aAAa,CAAuBL,uBAAuB;AAE3F;;;;;;;;AAQG;AACI,MAAMM,mBAAmB,GAAGA,MAA2B;EAC5D,OAAOC,UAAU,CAACH,gBAAgB,CAAC;AACrC;;;;"}

package/build/promoCard/PromoCardGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PromoCardGroup.js","sources":["../../src/promoCard/PromoCardGroup.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { FunctionComponent, ReactNode, useState, useEffect, useMemo } from 'react';\n\nimport { PromoCardProps } from './PromoCard';\nimport PromoCardContext from './PromoCardContext';\n\nexport type AriaRoleRadioGroup = 'radiogroup';\n\nexport interface PromoCardGroupProps {\n /*\n Optional class name(s) to add to the group container.\n /\n className?: string;\n /\n The PromoCard components to display inside the group.\n /\n children: ReactNode;\n /\n The default checked for the group.\n /\n defaultChecked?: string;\n /\n Optional ID to add to the group container.\n /\n id?: string;\n /\n Whether the group is disabled or not.\n /\n isDisabled?: boolean;\n /\n Optional label to display above the group.\n /\n label?: string;\n /\n Optional function to call when the group value changes.\n /\n onChange?: (value: string) => void;\n /\n Optional ID to add to the group container for testing purposes.\n /\n testId?: string;\n}\n\n/\n PromoCardGroup component.\n \n A PromoCardGroup is a container for PromoCard components that allows the user to select one or more\n * cards from a group. It can be used to display a set of related options, and can be customized with\n * various props to suit different use cases.\n \n @param {ReactNode} children - The PromoCard components to display inside the group.\n * @param {string} className - Optional class name(s) to add to the group container.\n * @param {string} defaultChecked - The default value for the group.\n * @param {string} id - Optional ID to add to the group container.\n * @param {boolean} isDisabled=false - Whether the group is disabled or not.\n * @param {string} label - Optional label to display above the group.\n * @param {Function} onChange - Optional function to call when the group value changes.\n * @param {string} testId - Optional ID to add to the group container for testing purposes.\n * @returns {React.JSX.Element} - The PromoCardGroup component.\n /\nconst PromoCardGroup: FunctionComponent<PromoCardGroupProps> = ({\n children,\n className,\n defaultChecked = '',\n id,\n isDisabled = false,\n onChange = () => {},\n testId,\n}) => {\n const [state, setState] = useState<string>(defaultChecked);\n const [containerRole, setContainerRole] = useState<string \| null>(null);\n\n /\n The context value for the PromoCardGroup.\n \n The context value is an object that contains the current state of the\n * group, whether the group is disabled or not, and a function to call when\n * the group value changes. This value is used to provide context to child\n * PromoCard components, allowing them to interact with the group and update\n * its state.\n */\n const contextValue = useMemo(() => {\n const handleOnChange = (value: string) => {\n setState(value);\n onChange(value);\n };\n\n return { state, isDisabled, onChange: handleOnChange };\n }, [state, isDisabled, onChange]);\n\n const commonClasses = clsx(\n {\n 'np-CardGroup': true,\n 'is-disabled': isDisabled,\n },\n className,\n );\n\n const commonProps = {\n className: commonClasses,\n id,\n 'data-testid': testId,\n role: containerRole as AriaRoleRadioGroup \| undefined, // Add the role attribute here\n };\n\n useEffect(() => {\n setState(defaultChecked);\n\n // Collect an array of types from the children PromoCard components\n const types =\n React.Children.map(children, (child) => {\n if (React.isValidElement<PromoCardProps>(child) && child.props.type) {\n return child.props.type;\n }\n return null;\n })?.filter((type): type is 'radio' \| 'checkbox' => type !== null && type !== undefined) ?? [];\n\n // Check if all types are the same\n const allTypesAreTheSame = types.every((type) => type === types[0]);\n\n // If all types are the same and the type is 'radio', set the container role\n setContainerRole(allTypesAreTheSame && types[0] === 'radio' ? 'radiogroup' : null);\n }, [defaultChecked, children]);\n\n return (\n <PromoCardContext.Provider value={contextValue}>\n <div {...commonProps}>{children}</div>\n </PromoCardContext.Provider>\n );\n};\n\nexport default React.memo(PromoCardGroup);\n"],"names":["PromoCardGroup","children","className","defaultChecked","id","isDisabled","onChange","testId","state","setState","useState","containerRole","setContainerRole","contextValue","useMemo","handleOnChange","value","commonClasses","clsx","commonProps","role","useEffect","types","React","Children","map","child","isValidElement","props","type","filter","undefined","allTypesAreTheSame","every","_jsx","PromoCardContext","Provider","memo"],"mappings":";;;;;;;;;;;;;AA4DA,MAAMA,cAAc,GAA2CA,CAAC;EAC9DC,QAAQ;EACRC,SAAS;AACTC,EAAAA,cAAc,GAAG,EAAE;EACnBC,EAAE;AACFC,EAAAA,UAAU,GAAG,KAAK;AAClBC,EAAAA,QAAQ,GAAGA,~~MAAO~~,~~EAAC~~;AACnBC,EAAAA;~~AACD~~,~~CAAA~~,KAAI;EACH,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,cAAQ,CAASP,cAAc,CAAC;EAC1D,MAAM,CAACQ,aAAa,EAAEC,gBAAgB,CAAC,GAAGF,cAAQ,CAAgB,IAAI,CAAC;AAEvE;;;;;;;;AAQG;AACH,EAAA,MAAMG,YAAY,GAAGC,aAAO,CAAC,MAAK;IAChC,MAAMC,cAAc,GAAIC,KAAa,IAAI;MACvCP,QAAQ,CAACO,KAAK,CAAC;MACfV,QAAQ,CAACU,KAAK,CAAC;~~KAChB~~;IAED,OAAO;MAAER,KAAK;MAAEH,UAAU;AAAEC,MAAAA,QAAQ,EAAES;KAAgB;~~GACvD~~,EAAE,CAACP,KAAK,EAAEH,UAAU,EAAEC,QAAQ,CAAC,CAAC;EAEjC,MAAMW,aAAa,GAAGC,SAAI,CACxB;AACE,IAAA,cAAc,EAAE,IAAI;AACpB,IAAA,aAAa,EAAEb;GAChB,EACDH,SAAS,CACV;AAED,EAAA,MAAMiB,WAAW,GAAG;AAClBjB,IAAAA,SAAS,EAAEe,aAAa;IACxBb,EAAE;AACF,IAAA,aAAa,EAAEG,MAAM;IACrBa,IAAI,EAAET,aAA+C;GACtD;AAEDU,EAAAA,eAAS,CAAC,MAAK;IACbZ,QAAQ,CAACN,cAAc,CAAC;AAExB;IACA,MAAMmB,KAAK,GACTC,sBAAK,CAACC,QAAQ,CAACC,GAAG,CAACxB,QAAQ,EAAGyB,KAAK,IAAI;AACrC,MAAA,iBAAIH,sBAAK,CAACI,cAAc,CAAiBD,KAAK,CAAC,IAAIA,KAAK,CAACE,KAAK,CAACC,IAAI,EAAE;AACnE,QAAA,OAAOH,KAAK,CAACE,KAAK,CAACC,IAAI;AACzB;AACA,MAAA,OAAO,IAAI;AACb,~~KAAC~~,CAAC,EAAEC,MAAM,CAAED,IAAI,IAAmCA,IAAI,KAAK,IAAI,IAAIA,IAAI,KAAKE,SAAS,CAAC,IAAI,EAAE;AAE/F;AACA,IAAA,MAAMC,kBAAkB,GAAGV,KAAK,CAACW,KAAK,CAAEJ,IAAI,IAAKA,IAAI,KAAKP,KAAK,CAAC,CAAC,CAAC,CAAC;AAEnE;AACAV,IAAAA,gBAAgB,CAACoB,kBAAkB,IAAIV,KAAK,CAAC,CAAC,CAAC,KAAK,OAAO,GAAG,YAAY,GAAG,IAAI,CAAC;AACpF,~~GAAC~~,EAAE,CAACnB,cAAc,EAAEF,QAAQ,CAAC,CAAC;AAE9B,EAAA,oBACEiC,cAAA,CAACC,iCAAgB,CAACC,QAAQ,EAAA;AAACpB,IAAAA,KAAK,EAAEH,YAAa;AAAAZ,IAAAA,QAAA,eAC7CiC,cAAA,CAAA,KAAA,EAAA;AAAA,MAAA,GAASf,WAAW;AAAAlB,MAAAA,QAAA,EAAGA;KAAc;AACvC,GAA2B,CAAC;AAEhC,CAAC;AAED,uBAAA,aAAesB,sBAAK,CAACc,IAAI,CAACrC,cAAc,CAAC;;;;"}
1	+ {"version":3,"file":"PromoCardGroup.js","sources":["../../src/promoCard/PromoCardGroup.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { FunctionComponent, ReactNode, useState, useEffect, useMemo } from 'react';\n\nimport { PromoCardProps } from './PromoCard';\nimport PromoCardContext from './PromoCardContext';\n\nexport type AriaRoleRadioGroup = 'radiogroup';\n\nexport interface PromoCardGroupProps {\n /*\n Optional class name(s) to add to the group container.\n /\n className?: string;\n /\n The PromoCard components to display inside the group.\n /\n children: ReactNode;\n /\n The default checked for the group.\n /\n defaultChecked?: string;\n /\n Optional ID to add to the group container.\n /\n id?: string;\n /\n Whether the group is disabled or not.\n /\n isDisabled?: boolean;\n /\n Optional label to display above the group.\n /\n label?: string;\n /\n Optional function to call when the group value changes.\n /\n onChange?: (value: string) => void;\n /\n Optional ID to add to the group container for testing purposes.\n /\n testId?: string;\n}\n\n/\n PromoCardGroup component.\n \n A PromoCardGroup is a container for PromoCard components that allows the user to select one or more\n * cards from a group. It can be used to display a set of related options, and can be customized with\n * various props to suit different use cases.\n \n @param {ReactNode} children - The PromoCard components to display inside the group.\n * @param {string} className - Optional class name(s) to add to the group container.\n * @param {string} defaultChecked - The default value for the group.\n * @param {string} id - Optional ID to add to the group container.\n * @param {boolean} isDisabled=false - Whether the group is disabled or not.\n * @param {string} label - Optional label to display above the group.\n * @param {Function} onChange - Optional function to call when the group value changes.\n * @param {string} testId - Optional ID to add to the group container for testing purposes.\n * @returns {React.JSX.Element} - The PromoCardGroup component.\n /\nconst PromoCardGroup: FunctionComponent<PromoCardGroupProps> = ({\n children,\n className,\n defaultChecked = '',\n id,\n isDisabled = false,\n onChange = () => {},\n testId,\n}) => {\n const [state, setState] = useState<string>(defaultChecked);\n const [containerRole, setContainerRole] = useState<string \| null>(null);\n\n /\n The context value for the PromoCardGroup.\n \n The context value is an object that contains the current state of the\n * group, whether the group is disabled or not, and a function to call when\n * the group value changes. This value is used to provide context to child\n * PromoCard components, allowing them to interact with the group and update\n * its state.\n */\n const contextValue = useMemo(() => {\n const handleOnChange = (value: string) => {\n setState(value);\n onChange(value);\n };\n\n return { state, isDisabled, onChange: handleOnChange };\n }, [state, isDisabled, onChange]);\n\n const commonClasses = clsx(\n {\n 'np-CardGroup': true,\n 'is-disabled': isDisabled,\n },\n className,\n );\n\n const commonProps = {\n className: commonClasses,\n id,\n 'data-testid': testId,\n role: containerRole as AriaRoleRadioGroup \| undefined, // Add the role attribute here\n };\n\n useEffect(() => {\n setState(defaultChecked);\n\n // Collect an array of types from the children PromoCard components\n const types =\n React.Children.map(children, (child) => {\n if (React.isValidElement<PromoCardProps>(child) && child.props.type) {\n return child.props.type;\n }\n return null;\n })?.filter((type): type is 'radio' \| 'checkbox' => type !== null && type !== undefined) ?? [];\n\n // Check if all types are the same\n const allTypesAreTheSame = types.every((type) => type === types[0]);\n\n // If all types are the same and the type is 'radio', set the container role\n setContainerRole(allTypesAreTheSame && types[0] === 'radio' ? 'radiogroup' : null);\n }, [defaultChecked, children]);\n\n return (\n <PromoCardContext.Provider value={contextValue}>\n <div {...commonProps}>{children}</div>\n </PromoCardContext.Provider>\n );\n};\n\nexport default React.memo(PromoCardGroup);\n"],"names":["PromoCardGroup","children","className","defaultChecked","id","isDisabled","onChange","testId","state","setState","useState","containerRole","setContainerRole","contextValue","useMemo","handleOnChange","value","commonClasses","clsx","commonProps","role","useEffect","types","React","Children","map","child","isValidElement","props","type","filter","undefined","allTypesAreTheSame","every","_jsx","PromoCardContext","Provider","memo"],"mappings":";;;;;;;;;;;;;AA4DA,MAAMA,cAAc,GAA2CA,CAAC;EAC9DC,QAAQ;EACRC,SAAS;AACTC,EAAAA,cAAc,GAAG,EAAE;EACnBC,EAAE;AACFC,EAAAA,UAAU,GAAG,KAAK;AAClBC,EAAAA,QAAQ,GAAGA,MAAK,CAAE,CAAC;AACnBC,EAAAA;AAAM,CACP,KAAI;EACH,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,cAAQ,CAASP,cAAc,CAAC;EAC1D,MAAM,CAACQ,aAAa,EAAEC,gBAAgB,CAAC,GAAGF,cAAQ,CAAgB,IAAI,CAAC;AAEvE;;;;;;;;AAQG;AACH,EAAA,MAAMG,YAAY,GAAGC,aAAO,CAAC,MAAK;IAChC,MAAMC,cAAc,GAAIC,KAAa,IAAI;MACvCP,QAAQ,CAACO,KAAK,CAAC;MACfV,QAAQ,CAACU,KAAK,CAAC;IACjB,CAAC;IAED,OAAO;MAAER,KAAK;MAAEH,UAAU;AAAEC,MAAAA,QAAQ,EAAES;KAAgB;EACxD,CAAC,EAAE,CAACP,KAAK,EAAEH,UAAU,EAAEC,QAAQ,CAAC,CAAC;EAEjC,MAAMW,aAAa,GAAGC,SAAI,CACxB;AACE,IAAA,cAAc,EAAE,IAAI;AACpB,IAAA,aAAa,EAAEb;GAChB,EACDH,SAAS,CACV;AAED,EAAA,MAAMiB,WAAW,GAAG;AAClBjB,IAAAA,SAAS,EAAEe,aAAa;IACxBb,EAAE;AACF,IAAA,aAAa,EAAEG,MAAM;IACrBa,IAAI,EAAET,aAA+C;GACtD;AAEDU,EAAAA,eAAS,CAAC,MAAK;IACbZ,QAAQ,CAACN,cAAc,CAAC;AAExB;IACA,MAAMmB,KAAK,GACTC,sBAAK,CAACC,QAAQ,CAACC,GAAG,CAACxB,QAAQ,EAAGyB,KAAK,IAAI;AACrC,MAAA,iBAAIH,sBAAK,CAACI,cAAc,CAAiBD,KAAK,CAAC,IAAIA,KAAK,CAACE,KAAK,CAACC,IAAI,EAAE;AACnE,QAAA,OAAOH,KAAK,CAACE,KAAK,CAACC,IAAI;AACzB,MAAA;AACA,MAAA,OAAO,IAAI;AACb,IAAA,CAAC,CAAC,EAAEC,MAAM,CAAED,IAAI,IAAmCA,IAAI,KAAK,IAAI,IAAIA,IAAI,KAAKE,SAAS,CAAC,IAAI,EAAE;AAE/F;AACA,IAAA,MAAMC,kBAAkB,GAAGV,KAAK,CAACW,KAAK,CAAEJ,IAAI,IAAKA,IAAI,KAAKP,KAAK,CAAC,CAAC,CAAC,CAAC;AAEnE;AACAV,IAAAA,gBAAgB,CAACoB,kBAAkB,IAAIV,KAAK,CAAC,CAAC,CAAC,KAAK,OAAO,GAAG,YAAY,GAAG,IAAI,CAAC;AACpF,EAAA,CAAC,EAAE,CAACnB,cAAc,EAAEF,QAAQ,CAAC,CAAC;AAE9B,EAAA,oBACEiC,cAAA,CAACC,iCAAgB,CAACC,QAAQ,EAAA;AAACpB,IAAAA,KAAK,EAAEH,YAAa;AAAAZ,IAAAA,QAAA,eAC7CiC,cAAA,CAAA,KAAA,EAAA;AAAA,MAAA,GAASf,WAAW;AAAAlB,MAAAA,QAAA,EAAGA;KAAc;AACvC,GAA2B,CAAC;AAEhC,CAAC;AAED,uBAAA,aAAesB,sBAAK,CAACc,IAAI,CAACrC,cAAc,CAAC;;;;"}

package/build/promoCard/PromoCardGroup.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PromoCardGroup.mjs","sources":["../../src/promoCard/PromoCardGroup.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { FunctionComponent, ReactNode, useState, useEffect, useMemo } from 'react';\n\nimport { PromoCardProps } from './PromoCard';\nimport PromoCardContext from './PromoCardContext';\n\nexport type AriaRoleRadioGroup = 'radiogroup';\n\nexport interface PromoCardGroupProps {\n /*\n Optional class name(s) to add to the group container.\n /\n className?: string;\n /\n The PromoCard components to display inside the group.\n /\n children: ReactNode;\n /\n The default checked for the group.\n /\n defaultChecked?: string;\n /\n Optional ID to add to the group container.\n /\n id?: string;\n /\n Whether the group is disabled or not.\n /\n isDisabled?: boolean;\n /\n Optional label to display above the group.\n /\n label?: string;\n /\n Optional function to call when the group value changes.\n /\n onChange?: (value: string) => void;\n /\n Optional ID to add to the group container for testing purposes.\n /\n testId?: string;\n}\n\n/\n PromoCardGroup component.\n \n A PromoCardGroup is a container for PromoCard components that allows the user to select one or more\n * cards from a group. It can be used to display a set of related options, and can be customized with\n * various props to suit different use cases.\n \n @param {ReactNode} children - The PromoCard components to display inside the group.\n * @param {string} className - Optional class name(s) to add to the group container.\n * @param {string} defaultChecked - The default value for the group.\n * @param {string} id - Optional ID to add to the group container.\n * @param {boolean} isDisabled=false - Whether the group is disabled or not.\n * @param {string} label - Optional label to display above the group.\n * @param {Function} onChange - Optional function to call when the group value changes.\n * @param {string} testId - Optional ID to add to the group container for testing purposes.\n * @returns {React.JSX.Element} - The PromoCardGroup component.\n /\nconst PromoCardGroup: FunctionComponent<PromoCardGroupProps> = ({\n children,\n className,\n defaultChecked = '',\n id,\n isDisabled = false,\n onChange = () => {},\n testId,\n}) => {\n const [state, setState] = useState<string>(defaultChecked);\n const [containerRole, setContainerRole] = useState<string \| null>(null);\n\n /\n The context value for the PromoCardGroup.\n \n The context value is an object that contains the current state of the\n * group, whether the group is disabled or not, and a function to call when\n * the group value changes. This value is used to provide context to child\n * PromoCard components, allowing them to interact with the group and update\n * its state.\n */\n const contextValue = useMemo(() => {\n const handleOnChange = (value: string) => {\n setState(value);\n onChange(value);\n };\n\n return { state, isDisabled, onChange: handleOnChange };\n }, [state, isDisabled, onChange]);\n\n const commonClasses = clsx(\n {\n 'np-CardGroup': true,\n 'is-disabled': isDisabled,\n },\n className,\n );\n\n const commonProps = {\n className: commonClasses,\n id,\n 'data-testid': testId,\n role: containerRole as AriaRoleRadioGroup \| undefined, // Add the role attribute here\n };\n\n useEffect(() => {\n setState(defaultChecked);\n\n // Collect an array of types from the children PromoCard components\n const types =\n React.Children.map(children, (child) => {\n if (React.isValidElement<PromoCardProps>(child) && child.props.type) {\n return child.props.type;\n }\n return null;\n })?.filter((type): type is 'radio' \| 'checkbox' => type !== null && type !== undefined) ?? [];\n\n // Check if all types are the same\n const allTypesAreTheSame = types.every((type) => type === types[0]);\n\n // If all types are the same and the type is 'radio', set the container role\n setContainerRole(allTypesAreTheSame && types[0] === 'radio' ? 'radiogroup' : null);\n }, [defaultChecked, children]);\n\n return (\n <PromoCardContext.Provider value={contextValue}>\n <div {...commonProps}>{children}</div>\n </PromoCardContext.Provider>\n );\n};\n\nexport default React.memo(PromoCardGroup);\n"],"names":["PromoCardGroup","children","className","defaultChecked","id","isDisabled","onChange","testId","state","setState","useState","containerRole","setContainerRole","contextValue","useMemo","handleOnChange","value","commonClasses","clsx","commonProps","role","useEffect","types","React","Children","map","child","isValidElement","props","type","filter","undefined","allTypesAreTheSame","every","_jsx","PromoCardContext","Provider","memo"],"mappings":";;;;;AA4DA,MAAMA,cAAc,GAA2CA,CAAC;EAC9DC,QAAQ;EACRC,SAAS;AACTC,EAAAA,cAAc,GAAG,EAAE;EACnBC,EAAE;AACFC,EAAAA,UAAU,GAAG,KAAK;AAClBC,EAAAA,QAAQ,GAAGA,~~MAAO~~,~~EAAC~~;AACnBC,EAAAA;~~AACD~~,~~CAAA~~,KAAI;EACH,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,QAAQ,CAASP,cAAc,CAAC;EAC1D,MAAM,CAACQ,aAAa,EAAEC,gBAAgB,CAAC,GAAGF,QAAQ,CAAgB,IAAI,CAAC;AAEvE;;;;;;;;AAQG;AACH,EAAA,MAAMG,YAAY,GAAGC,OAAO,CAAC,MAAK;IAChC,MAAMC,cAAc,GAAIC,KAAa,IAAI;MACvCP,QAAQ,CAACO,KAAK,CAAC;MACfV,QAAQ,CAACU,KAAK,CAAC;~~KAChB~~;IAED,OAAO;MAAER,KAAK;MAAEH,UAAU;AAAEC,MAAAA,QAAQ,EAAES;KAAgB;~~GACvD~~,EAAE,CAACP,KAAK,EAAEH,UAAU,EAAEC,QAAQ,CAAC,CAAC;EAEjC,MAAMW,aAAa,GAAGC,IAAI,CACxB;AACE,IAAA,cAAc,EAAE,IAAI;AACpB,IAAA,aAAa,EAAEb;GAChB,EACDH,SAAS,CACV;AAED,EAAA,MAAMiB,WAAW,GAAG;AAClBjB,IAAAA,SAAS,EAAEe,aAAa;IACxBb,EAAE;AACF,IAAA,aAAa,EAAEG,MAAM;IACrBa,IAAI,EAAET,aAA+C;GACtD;AAEDU,EAAAA,SAAS,CAAC,MAAK;IACbZ,QAAQ,CAACN,cAAc,CAAC;AAExB;IACA,MAAMmB,KAAK,GACTC,cAAK,CAACC,QAAQ,CAACC,GAAG,CAACxB,QAAQ,EAAGyB,KAAK,IAAI;AACrC,MAAA,iBAAIH,cAAK,CAACI,cAAc,CAAiBD,KAAK,CAAC,IAAIA,KAAK,CAACE,KAAK,CAACC,IAAI,EAAE;AACnE,QAAA,OAAOH,KAAK,CAACE,KAAK,CAACC,IAAI;AACzB;AACA,MAAA,OAAO,IAAI;AACb,~~KAAC~~,CAAC,EAAEC,MAAM,CAAED,IAAI,IAAmCA,IAAI,KAAK,IAAI,IAAIA,IAAI,KAAKE,SAAS,CAAC,IAAI,EAAE;AAE/F;AACA,IAAA,MAAMC,kBAAkB,GAAGV,KAAK,CAACW,KAAK,CAAEJ,IAAI,IAAKA,IAAI,KAAKP,KAAK,CAAC,CAAC,CAAC,CAAC;AAEnE;AACAV,IAAAA,gBAAgB,CAACoB,kBAAkB,IAAIV,KAAK,CAAC,CAAC,CAAC,KAAK,OAAO,GAAG,YAAY,GAAG,IAAI,CAAC;AACpF,~~GAAC~~,EAAE,CAACnB,cAAc,EAAEF,QAAQ,CAAC,CAAC;AAE9B,EAAA,oBACEiC,GAAA,CAACC,gBAAgB,CAACC,QAAQ,EAAA;AAACpB,IAAAA,KAAK,EAAEH,YAAa;AAAAZ,IAAAA,QAAA,eAC7CiC,GAAA,CAAA,KAAA,EAAA;AAAA,MAAA,GAASf,WAAW;AAAAlB,MAAAA,QAAA,EAAGA;KAAc;AACvC,GAA2B,CAAC;AAEhC,CAAC;AAED,uBAAA,aAAesB,cAAK,CAACc,IAAI,CAACrC,cAAc,CAAC;;;;"}
1	+ {"version":3,"file":"PromoCardGroup.mjs","sources":["../../src/promoCard/PromoCardGroup.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { FunctionComponent, ReactNode, useState, useEffect, useMemo } from 'react';\n\nimport { PromoCardProps } from './PromoCard';\nimport PromoCardContext from './PromoCardContext';\n\nexport type AriaRoleRadioGroup = 'radiogroup';\n\nexport interface PromoCardGroupProps {\n /*\n Optional class name(s) to add to the group container.\n /\n className?: string;\n /\n The PromoCard components to display inside the group.\n /\n children: ReactNode;\n /\n The default checked for the group.\n /\n defaultChecked?: string;\n /\n Optional ID to add to the group container.\n /\n id?: string;\n /\n Whether the group is disabled or not.\n /\n isDisabled?: boolean;\n /\n Optional label to display above the group.\n /\n label?: string;\n /\n Optional function to call when the group value changes.\n /\n onChange?: (value: string) => void;\n /\n Optional ID to add to the group container for testing purposes.\n /\n testId?: string;\n}\n\n/\n PromoCardGroup component.\n \n A PromoCardGroup is a container for PromoCard components that allows the user to select one or more\n * cards from a group. It can be used to display a set of related options, and can be customized with\n * various props to suit different use cases.\n \n @param {ReactNode} children - The PromoCard components to display inside the group.\n * @param {string} className - Optional class name(s) to add to the group container.\n * @param {string} defaultChecked - The default value for the group.\n * @param {string} id - Optional ID to add to the group container.\n * @param {boolean} isDisabled=false - Whether the group is disabled or not.\n * @param {string} label - Optional label to display above the group.\n * @param {Function} onChange - Optional function to call when the group value changes.\n * @param {string} testId - Optional ID to add to the group container for testing purposes.\n * @returns {React.JSX.Element} - The PromoCardGroup component.\n /\nconst PromoCardGroup: FunctionComponent<PromoCardGroupProps> = ({\n children,\n className,\n defaultChecked = '',\n id,\n isDisabled = false,\n onChange = () => {},\n testId,\n}) => {\n const [state, setState] = useState<string>(defaultChecked);\n const [containerRole, setContainerRole] = useState<string \| null>(null);\n\n /\n The context value for the PromoCardGroup.\n \n The context value is an object that contains the current state of the\n * group, whether the group is disabled or not, and a function to call when\n * the group value changes. This value is used to provide context to child\n * PromoCard components, allowing them to interact with the group and update\n * its state.\n */\n const contextValue = useMemo(() => {\n const handleOnChange = (value: string) => {\n setState(value);\n onChange(value);\n };\n\n return { state, isDisabled, onChange: handleOnChange };\n }, [state, isDisabled, onChange]);\n\n const commonClasses = clsx(\n {\n 'np-CardGroup': true,\n 'is-disabled': isDisabled,\n },\n className,\n );\n\n const commonProps = {\n className: commonClasses,\n id,\n 'data-testid': testId,\n role: containerRole as AriaRoleRadioGroup \| undefined, // Add the role attribute here\n };\n\n useEffect(() => {\n setState(defaultChecked);\n\n // Collect an array of types from the children PromoCard components\n const types =\n React.Children.map(children, (child) => {\n if (React.isValidElement<PromoCardProps>(child) && child.props.type) {\n return child.props.type;\n }\n return null;\n })?.filter((type): type is 'radio' \| 'checkbox' => type !== null && type !== undefined) ?? [];\n\n // Check if all types are the same\n const allTypesAreTheSame = types.every((type) => type === types[0]);\n\n // If all types are the same and the type is 'radio', set the container role\n setContainerRole(allTypesAreTheSame && types[0] === 'radio' ? 'radiogroup' : null);\n }, [defaultChecked, children]);\n\n return (\n <PromoCardContext.Provider value={contextValue}>\n <div {...commonProps}>{children}</div>\n </PromoCardContext.Provider>\n );\n};\n\nexport default React.memo(PromoCardGroup);\n"],"names":["PromoCardGroup","children","className","defaultChecked","id","isDisabled","onChange","testId","state","setState","useState","containerRole","setContainerRole","contextValue","useMemo","handleOnChange","value","commonClasses","clsx","commonProps","role","useEffect","types","React","Children","map","child","isValidElement","props","type","filter","undefined","allTypesAreTheSame","every","_jsx","PromoCardContext","Provider","memo"],"mappings":";;;;;AA4DA,MAAMA,cAAc,GAA2CA,CAAC;EAC9DC,QAAQ;EACRC,SAAS;AACTC,EAAAA,cAAc,GAAG,EAAE;EACnBC,EAAE;AACFC,EAAAA,UAAU,GAAG,KAAK;AAClBC,EAAAA,QAAQ,GAAGA,MAAK,CAAE,CAAC;AACnBC,EAAAA;AAAM,CACP,KAAI;EACH,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,QAAQ,CAASP,cAAc,CAAC;EAC1D,MAAM,CAACQ,aAAa,EAAEC,gBAAgB,CAAC,GAAGF,QAAQ,CAAgB,IAAI,CAAC;AAEvE;;;;;;;;AAQG;AACH,EAAA,MAAMG,YAAY,GAAGC,OAAO,CAAC,MAAK;IAChC,MAAMC,cAAc,GAAIC,KAAa,IAAI;MACvCP,QAAQ,CAACO,KAAK,CAAC;MACfV,QAAQ,CAACU,KAAK,CAAC;IACjB,CAAC;IAED,OAAO;MAAER,KAAK;MAAEH,UAAU;AAAEC,MAAAA,QAAQ,EAAES;KAAgB;EACxD,CAAC,EAAE,CAACP,KAAK,EAAEH,UAAU,EAAEC,QAAQ,CAAC,CAAC;EAEjC,MAAMW,aAAa,GAAGC,IAAI,CACxB;AACE,IAAA,cAAc,EAAE,IAAI;AACpB,IAAA,aAAa,EAAEb;GAChB,EACDH,SAAS,CACV;AAED,EAAA,MAAMiB,WAAW,GAAG;AAClBjB,IAAAA,SAAS,EAAEe,aAAa;IACxBb,EAAE;AACF,IAAA,aAAa,EAAEG,MAAM;IACrBa,IAAI,EAAET,aAA+C;GACtD;AAEDU,EAAAA,SAAS,CAAC,MAAK;IACbZ,QAAQ,CAACN,cAAc,CAAC;AAExB;IACA,MAAMmB,KAAK,GACTC,cAAK,CAACC,QAAQ,CAACC,GAAG,CAACxB,QAAQ,EAAGyB,KAAK,IAAI;AACrC,MAAA,iBAAIH,cAAK,CAACI,cAAc,CAAiBD,KAAK,CAAC,IAAIA,KAAK,CAACE,KAAK,CAACC,IAAI,EAAE;AACnE,QAAA,OAAOH,KAAK,CAACE,KAAK,CAACC,IAAI;AACzB,MAAA;AACA,MAAA,OAAO,IAAI;AACb,IAAA,CAAC,CAAC,EAAEC,MAAM,CAAED,IAAI,IAAmCA,IAAI,KAAK,IAAI,IAAIA,IAAI,KAAKE,SAAS,CAAC,IAAI,EAAE;AAE/F;AACA,IAAA,MAAMC,kBAAkB,GAAGV,KAAK,CAACW,KAAK,CAAEJ,IAAI,IAAKA,IAAI,KAAKP,KAAK,CAAC,CAAC,CAAC,CAAC;AAEnE;AACAV,IAAAA,gBAAgB,CAACoB,kBAAkB,IAAIV,KAAK,CAAC,CAAC,CAAC,KAAK,OAAO,GAAG,YAAY,GAAG,IAAI,CAAC;AACpF,EAAA,CAAC,EAAE,CAACnB,cAAc,EAAEF,QAAQ,CAAC,CAAC;AAE9B,EAAA,oBACEiC,GAAA,CAACC,gBAAgB,CAACC,QAAQ,EAAA;AAACpB,IAAAA,KAAK,EAAEH,YAAa;AAAAZ,IAAAA,QAAA,eAC7CiC,GAAA,CAAA,KAAA,EAAA;AAAA,MAAA,GAASf,WAAW;AAAAlB,MAAAA,QAAA,EAAGA;KAAc;AACvC,GAA2B,CAAC;AAEhC,CAAC;AAED,uBAAA,aAAesB,cAAK,CAACc,IAAI,CAACrC,cAAc,CAAC;;;;"}

package/build/promoCard/PromoCardIndicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PromoCardIndicator.js","sources":["../../src/promoCard/PromoCardIndicator.tsx"],"sourcesContent":["import { ArrowRight, Check, Download } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactElement, ReactNode } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport AvatarView from '../avatarView';\n\nexport type PromoCardIndicatorProps = {\n /** Optional class name(s) to add to the indicator container. /\n className?: string;\n\n /* Optional label to display next to the indicator. /\n label?: string;\n\n /* Optional icon to display in the indicator. /\n icon?: 'check' \| 'arrow' \| 'download' \| ReactElement;\n\n /* Optional prop to specify whether the indicator is sized small or not. /\n isSmall?: boolean;\n\n /* Optional ID to add to the indicator container for testing purposes. /\n testid?: string;\n\n /* Optional children to display inside the indicator. /\n children?: ReactNode;\n};\n\n/\n PromoCardIndicator component.\n \n A PromoCardIndicator is a small component that can be used to display\n * additional information or actions related to a PromoCard. It can be\n * customized with various props to suit different use cases.\n \n @param {string} className - Optional class name(s) to add to the indicator container.\n * @param {string} label - Optional label to display next to the indicator.\n * @param {string \| ReactElement} icon - Optional icon to display in the indicator.\n * @param {string} testid - Optional ID to add to the indicator container for testing purposes.\n * @param {ReactNode} children - Optional children to display inside the indicator.\n * @returns {React.JSX.Element} - The PromoCardIndicator component.\n * @example\n * <PromoCardIndicator label=\"Download\" icon=\"download\" />\n */\nconst PromoCardIndicator: React.FC<PromoCardIndicatorProps> = ({\n className,\n children,\n label,\n icon,\n isSmall = false,\n testid,\n ...rest\n}) => {\n const isIconString = icon && typeof icon === 'string';\n\n const IconComponent =\n isIconString &&\n {\n check: Check,\n arrow: ArrowRight,\n download: Download,\n }[icon];\n\n return (\n <div className={clsx('np-Card-indicator', className)} data-testid={testid} {...rest}>\n {label && (\n <Body as=\"span\" type={Typography.BODY_LARGE_BOLD} className=\"np-Card-indicatorText\">\n {label}\n </Body>\n )}\n {icon && (\n <AvatarView\n interactive\n size={isSmall ? 40 : 56}\n style={{ backgroundColor: 'var(--Card-indicator-icon-background-color)' }}\n className=\"np-Card-indicatorIcon\"\n >\n {IconComponent ? <IconComponent size={24} aria-hidden=\"true\" /> : icon}\n </AvatarView>\n )}\n {children}\n </div>\n );\n};\n\nexport default PromoCardIndicator;\n"],"names":["PromoCardIndicator","className","children","label","icon","isSmall","testid","rest","isIconString","IconComponent","check","Check","arrow","ArrowRight","download","Download","_jsxs","clsx","_jsx","Body","as","type","Typography","BODY_LARGE_BOLD","AvatarView","interactive","size","style","backgroundColor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AA4CMA~~,~~MAAAA~~,kBAAkB,GAAsCA,CAAC;EAC7DC,SAAS;EACTC,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;EACN,GAAGC;~~AACJ~~,~~CAAA~~,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGJ,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ;EAErD,MAAMK,aAAa,GACjBD,YAAY,IACZ;AACEE,IAAAA,KAAK,EAAEC,WAAK;AACZC,IAAAA,KAAK,EAAEC,gBAAU;AACjBC,IAAAA,QAAQ,EAAEC;GACX,CAACX,IAAI,CAAC;AAET,EAAA,oBACEY,eAAA,CAAA,KAAA,EAAA;AAAKf,IAAAA,SAAS,EAAEgB,SAAI,CAAC,mBAAmB,EAAEhB,SAAS,CAAE;AAAC,IAAA,aAAA,EAAaK,MAAO;AAAA,IAAA,GAAKC,IAAI;AAAAL,IAAAA,QAAA,~~EAChFC~~,~~CAAAA~~,KAAK,iBACJe,cAAA,CAACC,YAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACC,IAAI,EAAEC,qBAAU,CAACC,eAAgB;AAACtB,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAChFC;AAAK,KACF,CACP,EACAC,IAAI,iBACHc,cAAA,CAACM,kBAAU,EAAA;MACTC,WAAW,EAAA,IAAA;AACXC,MAAAA,IAAI,EAAErB,OAAO,GAAG,EAAE,GAAG,EAAG;AACxBsB,MAAAA,KAAK,EAAE;AAAEC,QAAAA,eAAe,EAAE;OAAgD;AAC1E3B,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAEhCO,aAAa,gBAAGS,cAAA,CAACT,aAAa,EAAA;AAACiB,QAAAA,IAAI,EAAE,EAAG;QAAC,~~aAAY~~,~~EAAA~~;AAAM,QAAG,GAAGtB;KACxD,CACb,EACAF,QAAQ;AAAA,GACN,CAAC;AAEV;;;;"}
1	+ {"version":3,"file":"PromoCardIndicator.js","sources":["../../src/promoCard/PromoCardIndicator.tsx"],"sourcesContent":["import { ArrowRight, Check, Download } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactElement, ReactNode } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport AvatarView from '../avatarView';\n\nexport type PromoCardIndicatorProps = {\n /** Optional class name(s) to add to the indicator container. /\n className?: string;\n\n /* Optional label to display next to the indicator. /\n label?: string;\n\n /* Optional icon to display in the indicator. /\n icon?: 'check' \| 'arrow' \| 'download' \| ReactElement;\n\n /* Optional prop to specify whether the indicator is sized small or not. /\n isSmall?: boolean;\n\n /* Optional ID to add to the indicator container for testing purposes. /\n testid?: string;\n\n /* Optional children to display inside the indicator. /\n children?: ReactNode;\n};\n\n/\n PromoCardIndicator component.\n \n A PromoCardIndicator is a small component that can be used to display\n * additional information or actions related to a PromoCard. It can be\n * customized with various props to suit different use cases.\n \n @param {string} className - Optional class name(s) to add to the indicator container.\n * @param {string} label - Optional label to display next to the indicator.\n * @param {string \| ReactElement} icon - Optional icon to display in the indicator.\n * @param {string} testid - Optional ID to add to the indicator container for testing purposes.\n * @param {ReactNode} children - Optional children to display inside the indicator.\n * @returns {React.JSX.Element} - The PromoCardIndicator component.\n * @example\n * <PromoCardIndicator label=\"Download\" icon=\"download\" />\n */\nconst PromoCardIndicator: React.FC<PromoCardIndicatorProps> = ({\n className,\n children,\n label,\n icon,\n isSmall = false,\n testid,\n ...rest\n}) => {\n const isIconString = icon && typeof icon === 'string';\n\n const IconComponent =\n isIconString &&\n {\n check: Check,\n arrow: ArrowRight,\n download: Download,\n }[icon];\n\n return (\n <div className={clsx('np-Card-indicator', className)} data-testid={testid} {...rest}>\n {label && (\n <Body as=\"span\" type={Typography.BODY_LARGE_BOLD} className=\"np-Card-indicatorText\">\n {label}\n </Body>\n )}\n {icon && (\n <AvatarView\n interactive\n size={isSmall ? 40 : 56}\n style={{ backgroundColor: 'var(--Card-indicator-icon-background-color)' }}\n className=\"np-Card-indicatorIcon\"\n >\n {IconComponent ? <IconComponent size={24} aria-hidden=\"true\" /> : icon}\n </AvatarView>\n )}\n {children}\n </div>\n );\n};\n\nexport default PromoCardIndicator;\n"],"names":["PromoCardIndicator","className","children","label","icon","isSmall","testid","rest","isIconString","IconComponent","check","Check","arrow","ArrowRight","download","Download","_jsxs","clsx","_jsx","Body","as","type","Typography","BODY_LARGE_BOLD","AvatarView","interactive","size","style","backgroundColor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA,MAAMA,kBAAkB,GAAsCA,CAAC;EAC7DC,SAAS;EACTC,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;EACN,GAAGC;AAAI,CACR,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGJ,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ;EAErD,MAAMK,aAAa,GACjBD,YAAY,IACZ;AACEE,IAAAA,KAAK,EAAEC,WAAK;AACZC,IAAAA,KAAK,EAAEC,gBAAU;AACjBC,IAAAA,QAAQ,EAAEC;GACX,CAACX,IAAI,CAAC;AAET,EAAA,oBACEY,eAAA,CAAA,KAAA,EAAA;AAAKf,IAAAA,SAAS,EAAEgB,SAAI,CAAC,mBAAmB,EAAEhB,SAAS,CAAE;AAAC,IAAA,aAAA,EAAaK,MAAO;AAAA,IAAA,GAAKC,IAAI;AAAAL,IAAAA,QAAA,EAAA,CAChFC,KAAK,iBACJe,cAAA,CAACC,YAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACC,IAAI,EAAEC,qBAAU,CAACC,eAAgB;AAACtB,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAChFC;AAAK,KACF,CACP,EACAC,IAAI,iBACHc,cAAA,CAACM,kBAAU,EAAA;MACTC,WAAW,EAAA,IAAA;AACXC,MAAAA,IAAI,EAAErB,OAAO,GAAG,EAAE,GAAG,EAAG;AACxBsB,MAAAA,KAAK,EAAE;AAAEC,QAAAA,eAAe,EAAE;OAAgD;AAC1E3B,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAEhCO,aAAa,gBAAGS,cAAA,CAACT,aAAa,EAAA;AAACiB,QAAAA,IAAI,EAAE,EAAG;QAAC,aAAA,EAAY;AAAM,QAAG,GAAGtB;KACxD,CACb,EACAF,QAAQ;AAAA,GACN,CAAC;AAEV;;;;"}

package/build/promoCard/PromoCardIndicator.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PromoCardIndicator.mjs","sources":["../../src/promoCard/PromoCardIndicator.tsx"],"sourcesContent":["import { ArrowRight, Check, Download } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactElement, ReactNode } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport AvatarView from '../avatarView';\n\nexport type PromoCardIndicatorProps = {\n /** Optional class name(s) to add to the indicator container. /\n className?: string;\n\n /* Optional label to display next to the indicator. /\n label?: string;\n\n /* Optional icon to display in the indicator. /\n icon?: 'check' \| 'arrow' \| 'download' \| ReactElement;\n\n /* Optional prop to specify whether the indicator is sized small or not. /\n isSmall?: boolean;\n\n /* Optional ID to add to the indicator container for testing purposes. /\n testid?: string;\n\n /* Optional children to display inside the indicator. /\n children?: ReactNode;\n};\n\n/\n PromoCardIndicator component.\n \n A PromoCardIndicator is a small component that can be used to display\n * additional information or actions related to a PromoCard. It can be\n * customized with various props to suit different use cases.\n \n @param {string} className - Optional class name(s) to add to the indicator container.\n * @param {string} label - Optional label to display next to the indicator.\n * @param {string \| ReactElement} icon - Optional icon to display in the indicator.\n * @param {string} testid - Optional ID to add to the indicator container for testing purposes.\n * @param {ReactNode} children - Optional children to display inside the indicator.\n * @returns {React.JSX.Element} - The PromoCardIndicator component.\n * @example\n * <PromoCardIndicator label=\"Download\" icon=\"download\" />\n */\nconst PromoCardIndicator: React.FC<PromoCardIndicatorProps> = ({\n className,\n children,\n label,\n icon,\n isSmall = false,\n testid,\n ...rest\n}) => {\n const isIconString = icon && typeof icon === 'string';\n\n const IconComponent =\n isIconString &&\n {\n check: Check,\n arrow: ArrowRight,\n download: Download,\n }[icon];\n\n return (\n <div className={clsx('np-Card-indicator', className)} data-testid={testid} {...rest}>\n {label && (\n <Body as=\"span\" type={Typography.BODY_LARGE_BOLD} className=\"np-Card-indicatorText\">\n {label}\n </Body>\n )}\n {icon && (\n <AvatarView\n interactive\n size={isSmall ? 40 : 56}\n style={{ backgroundColor: 'var(--Card-indicator-icon-background-color)' }}\n className=\"np-Card-indicatorIcon\"\n >\n {IconComponent ? <IconComponent size={24} aria-hidden=\"true\" /> : icon}\n </AvatarView>\n )}\n {children}\n </div>\n );\n};\n\nexport default PromoCardIndicator;\n"],"names":["PromoCardIndicator","className","children","label","icon","isSmall","testid","rest","isIconString","IconComponent","check","Check","arrow","ArrowRight","download","Download","_jsxs","clsx","_jsx","Body","as","type","Typography","BODY_LARGE_BOLD","AvatarView","interactive","size","style","backgroundColor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AA4CMA~~,~~MAAAA~~,kBAAkB,GAAsCA,CAAC;EAC7DC,SAAS;EACTC,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;EACN,GAAGC;~~AACJ~~,~~CAAA~~,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGJ,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ;EAErD,MAAMK,aAAa,GACjBD,YAAY,IACZ;AACEE,IAAAA,KAAK,EAAEC,KAAK;AACZC,IAAAA,KAAK,EAAEC,UAAU;AACjBC,IAAAA,QAAQ,EAAEC;GACX,CAACX,IAAI,CAAC;AAET,EAAA,oBACEY,IAAA,CAAA,KAAA,EAAA;AAAKf,IAAAA,SAAS,EAAEgB,IAAI,CAAC,mBAAmB,EAAEhB,SAAS,CAAE;AAAC,IAAA,aAAA,EAAaK,MAAO;AAAA,IAAA,GAAKC,IAAI;AAAAL,IAAAA,QAAA,~~EAChFC~~,~~CAAAA~~,KAAK,iBACJe,GAAA,CAACC,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACC,IAAI,EAAEC,UAAU,CAACC,eAAgB;AAACtB,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAChFC;AAAK,KACF,CACP,EACAC,IAAI,iBACHc,GAAA,CAACM,UAAU,EAAA;MACTC,WAAW,EAAA,IAAA;AACXC,MAAAA,IAAI,EAAErB,OAAO,GAAG,EAAE,GAAG,EAAG;AACxBsB,MAAAA,KAAK,EAAE;AAAEC,QAAAA,eAAe,EAAE;OAAgD;AAC1E3B,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAEhCO,aAAa,gBAAGS,GAAA,CAACT,aAAa,EAAA;AAACiB,QAAAA,IAAI,EAAE,EAAG;QAAC,~~aAAY~~,~~EAAA~~;AAAM,QAAG,GAAGtB;KACxD,CACb,EACAF,QAAQ;AAAA,GACN,CAAC;AAEV;;;;"}
1	+ {"version":3,"file":"PromoCardIndicator.mjs","sources":["../../src/promoCard/PromoCardIndicator.tsx"],"sourcesContent":["import { ArrowRight, Check, Download } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactElement, ReactNode } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport AvatarView from '../avatarView';\n\nexport type PromoCardIndicatorProps = {\n /** Optional class name(s) to add to the indicator container. /\n className?: string;\n\n /* Optional label to display next to the indicator. /\n label?: string;\n\n /* Optional icon to display in the indicator. /\n icon?: 'check' \| 'arrow' \| 'download' \| ReactElement;\n\n /* Optional prop to specify whether the indicator is sized small or not. /\n isSmall?: boolean;\n\n /* Optional ID to add to the indicator container for testing purposes. /\n testid?: string;\n\n /* Optional children to display inside the indicator. /\n children?: ReactNode;\n};\n\n/\n PromoCardIndicator component.\n \n A PromoCardIndicator is a small component that can be used to display\n * additional information or actions related to a PromoCard. It can be\n * customized with various props to suit different use cases.\n \n @param {string} className - Optional class name(s) to add to the indicator container.\n * @param {string} label - Optional label to display next to the indicator.\n * @param {string \| ReactElement} icon - Optional icon to display in the indicator.\n * @param {string} testid - Optional ID to add to the indicator container for testing purposes.\n * @param {ReactNode} children - Optional children to display inside the indicator.\n * @returns {React.JSX.Element} - The PromoCardIndicator component.\n * @example\n * <PromoCardIndicator label=\"Download\" icon=\"download\" />\n */\nconst PromoCardIndicator: React.FC<PromoCardIndicatorProps> = ({\n className,\n children,\n label,\n icon,\n isSmall = false,\n testid,\n ...rest\n}) => {\n const isIconString = icon && typeof icon === 'string';\n\n const IconComponent =\n isIconString &&\n {\n check: Check,\n arrow: ArrowRight,\n download: Download,\n }[icon];\n\n return (\n <div className={clsx('np-Card-indicator', className)} data-testid={testid} {...rest}>\n {label && (\n <Body as=\"span\" type={Typography.BODY_LARGE_BOLD} className=\"np-Card-indicatorText\">\n {label}\n </Body>\n )}\n {icon && (\n <AvatarView\n interactive\n size={isSmall ? 40 : 56}\n style={{ backgroundColor: 'var(--Card-indicator-icon-background-color)' }}\n className=\"np-Card-indicatorIcon\"\n >\n {IconComponent ? <IconComponent size={24} aria-hidden=\"true\" /> : icon}\n </AvatarView>\n )}\n {children}\n </div>\n );\n};\n\nexport default PromoCardIndicator;\n"],"names":["PromoCardIndicator","className","children","label","icon","isSmall","testid","rest","isIconString","IconComponent","check","Check","arrow","ArrowRight","download","Download","_jsxs","clsx","_jsx","Body","as","type","Typography","BODY_LARGE_BOLD","AvatarView","interactive","size","style","backgroundColor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA,MAAMA,kBAAkB,GAAsCA,CAAC;EAC7DC,SAAS;EACTC,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;EACN,GAAGC;AAAI,CACR,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGJ,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ;EAErD,MAAMK,aAAa,GACjBD,YAAY,IACZ;AACEE,IAAAA,KAAK,EAAEC,KAAK;AACZC,IAAAA,KAAK,EAAEC,UAAU;AACjBC,IAAAA,QAAQ,EAAEC;GACX,CAACX,IAAI,CAAC;AAET,EAAA,oBACEY,IAAA,CAAA,KAAA,EAAA;AAAKf,IAAAA,SAAS,EAAEgB,IAAI,CAAC,mBAAmB,EAAEhB,SAAS,CAAE;AAAC,IAAA,aAAA,EAAaK,MAAO;AAAA,IAAA,GAAKC,IAAI;AAAAL,IAAAA,QAAA,EAAA,CAChFC,KAAK,iBACJe,GAAA,CAACC,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACC,IAAI,EAAEC,UAAU,CAACC,eAAgB;AAACtB,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAChFC;AAAK,KACF,CACP,EACAC,IAAI,iBACHc,GAAA,CAACM,UAAU,EAAA;MACTC,WAAW,EAAA,IAAA;AACXC,MAAAA,IAAI,EAAErB,OAAO,GAAG,EAAE,GAAG,EAAG;AACxBsB,MAAAA,KAAK,EAAE;AAAEC,QAAAA,eAAe,EAAE;OAAgD;AAC1E3B,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAEhCO,aAAa,gBAAGS,GAAA,CAACT,aAAa,EAAA;AAACiB,QAAAA,IAAI,EAAE,EAAG;QAAC,aAAA,EAAY;AAAM,QAAG,GAAGtB;KACxD,CACb,EACAF,QAAQ;AAAA,GACN,CAAC;AAEV;;;;"}

package/build/provider/Provider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Provider.js","sources":["../../src/provider/Provider.tsx"],"sourcesContent":["import { IntlProvider, ResolvedIntlConfig } from 'react-intl';\n\nimport { adjustLocale, DEFAULT_LOCALE, getDirectionFromLocale } from '../common';\nimport en from '../i18n/en.json';\n\nimport { DirectionProvider } from './direction';\nimport { LanguageProvider } from './language';\n\nexport interface ProviderProps {\n i18n: Pick<ResolvedIntlConfig, 'locale' \| 'messages'> &\n Partial<Pick<ResolvedIntlConfig, 'defaultRichTextElements'>>;\n children?: React.ReactNode;\n}\n\nexport default function Provider({ i18n, children }: ProviderProps) {\n const { locale, messages, defaultRichTextElements } = i18n;\n const adjustedLocale = adjustLocale(locale);\n let intlConfig;\n\n if (adjustedLocale === null) {\n // eslint-disable-next-line no-console\n console.warn(\n `Unsupported locale value was provided: '${locale}', defaulting to '${DEFAULT_LOCALE}'`,\n );\n\n intlConfig = { locale: DEFAULT_LOCALE, messages: { ...en, ...messages } };\n } else {\n intlConfig = { locale: adjustedLocale, messages };\n }\n\n return (\n <DirectionProvider direction={getDirectionFromLocale(locale)}>\n <LanguageProvider locale={locale}>\n <IntlProvider\n defaultLocale={DEFAULT_LOCALE}\n locale={intlConfig.locale}\n messages={intlConfig.messages}\n defaultRichTextElements={defaultRichTextElements}\n >\n {children}\n </IntlProvider>\n </LanguageProvider>\n </DirectionProvider>\n );\n}\n"],"names":["Provider","i18n","children","locale","messages","defaultRichTextElements","adjustedLocale","adjustLocale","intlConfig","console","warn","DEFAULT_LOCALE","en","_jsx","DirectionProvider","direction","getDirectionFromLocale","LanguageProvider","IntlProvider","defaultLocale"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAcwB~~,~~SAAAA~~,QAAQA,CAAC;EAAEC,IAAI;AAAEC,EAAAA;~~AAAyB~~,~~CAAA~~,EAAA;EAChE,MAAM;IAAEC,MAAM;IAAEC,QAAQ;AAAEC,IAAAA;AAAuB,GAAE,GAAGJ,IAAI;AAC1D,EAAA,MAAMK,cAAc,GAAGC,kBAAY,CAACJ,MAAM,CAAC;AAC3C,EAAA,IAAIK,UAAU;EAEd,IAAIF,cAAc,KAAK,IAAI,EAAE;AAC3B;IACAG,OAAO,CAACC,IAAI,CACV,CAAA,wCAAA,EAA2CP,MAAM,~~CAAqBQ~~,~~kBAAAA~~,~~EAAAA~~,oBAAc,GAAG,CACxF;AAEDH,IAAAA,UAAU,GAAG;AAAEL,MAAAA,MAAM,EAAEQ,oBAAc;AAAEP,MAAAA,QAAQ,EAAE;AAAE,QAAA,GAAGQ,UAAE;QAAE,GAAGR;AAAQ;KAAI;AAC3E,~~GAAC~~,MAAM;AACLI,IAAAA,UAAU,GAAG;AAAEL,MAAAA,MAAM,EAAEG,cAAc;AAAEF,MAAAA;KAAU;AACnD;EAEA,oBACES,cAAA,CAACC,mCAAiB,EAAA;AAACC,IAAAA,SAAS,EAAEC,4BAAsB,CAACb,MAAM,CAAE;IAAAD,QAAA,eAC3DW,cAAA,CAACI,iCAAgB,EAAA;AAACd,MAAAA,MAAM,EAAEA,MAAO;MAAAD,QAAA,eAC/BW,cAAA,CAACK,sBAAY,EAAA;AACXC,QAAAA,aAAa,EAAER,oBAAe;QAC9BR,MAAM,EAAEK,UAAU,CAACL,MAAO;QAC1BC,QAAQ,EAAEI,UAAU,CAACJ,QAAS;AAC9BC,QAAAA,uBAAuB,EAAEA,uBAAwB;AAAAH,QAAAA,QAAA,EAEhDA;OACW;KACE;AACpB,GAAmB,CAAC;AAExB;;;;"}
1	+ {"version":3,"file":"Provider.js","sources":["../../src/provider/Provider.tsx"],"sourcesContent":["import { IntlProvider, ResolvedIntlConfig } from 'react-intl';\n\nimport { adjustLocale, DEFAULT_LOCALE, getDirectionFromLocale } from '../common';\nimport en from '../i18n/en.json';\n\nimport { DirectionProvider } from './direction';\nimport { LanguageProvider } from './language';\n\nexport interface ProviderProps {\n i18n: Pick<ResolvedIntlConfig, 'locale' \| 'messages'> &\n Partial<Pick<ResolvedIntlConfig, 'defaultRichTextElements'>>;\n children?: React.ReactNode;\n}\n\nexport default function Provider({ i18n, children }: ProviderProps) {\n const { locale, messages, defaultRichTextElements } = i18n;\n const adjustedLocale = adjustLocale(locale);\n let intlConfig;\n\n if (adjustedLocale === null) {\n // eslint-disable-next-line no-console\n console.warn(\n `Unsupported locale value was provided: '${locale}', defaulting to '${DEFAULT_LOCALE}'`,\n );\n\n intlConfig = { locale: DEFAULT_LOCALE, messages: { ...en, ...messages } };\n } else {\n intlConfig = { locale: adjustedLocale, messages };\n }\n\n return (\n <DirectionProvider direction={getDirectionFromLocale(locale)}>\n <LanguageProvider locale={locale}>\n <IntlProvider\n defaultLocale={DEFAULT_LOCALE}\n locale={intlConfig.locale}\n messages={intlConfig.messages}\n defaultRichTextElements={defaultRichTextElements}\n >\n {children}\n </IntlProvider>\n </LanguageProvider>\n </DirectionProvider>\n );\n}\n"],"names":["Provider","i18n","children","locale","messages","defaultRichTextElements","adjustedLocale","adjustLocale","intlConfig","console","warn","DEFAULT_LOCALE","en","_jsx","DirectionProvider","direction","getDirectionFromLocale","LanguageProvider","IntlProvider","defaultLocale"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcc,SAAUA,QAAQA,CAAC;EAAEC,IAAI;AAAEC,EAAAA;AAAQ,CAAiB,EAAA;EAChE,MAAM;IAAEC,MAAM;IAAEC,QAAQ;AAAEC,IAAAA;AAAuB,GAAE,GAAGJ,IAAI;AAC1D,EAAA,MAAMK,cAAc,GAAGC,kBAAY,CAACJ,MAAM,CAAC;AAC3C,EAAA,IAAIK,UAAU;EAEd,IAAIF,cAAc,KAAK,IAAI,EAAE;AAC3B;IACAG,OAAO,CAACC,IAAI,CACV,CAAA,wCAAA,EAA2CP,MAAM,CAAA,kBAAA,EAAqBQ,oBAAc,GAAG,CACxF;AAEDH,IAAAA,UAAU,GAAG;AAAEL,MAAAA,MAAM,EAAEQ,oBAAc;AAAEP,MAAAA,QAAQ,EAAE;AAAE,QAAA,GAAGQ,UAAE;QAAE,GAAGR;AAAQ;KAAI;AAC3E,EAAA,CAAC,MAAM;AACLI,IAAAA,UAAU,GAAG;AAAEL,MAAAA,MAAM,EAAEG,cAAc;AAAEF,MAAAA;KAAU;AACnD,EAAA;EAEA,oBACES,cAAA,CAACC,mCAAiB,EAAA;AAACC,IAAAA,SAAS,EAAEC,4BAAsB,CAACb,MAAM,CAAE;IAAAD,QAAA,eAC3DW,cAAA,CAACI,iCAAgB,EAAA;AAACd,MAAAA,MAAM,EAAEA,MAAO;MAAAD,QAAA,eAC/BW,cAAA,CAACK,sBAAY,EAAA;AACXC,QAAAA,aAAa,EAAER,oBAAe;QAC9BR,MAAM,EAAEK,UAAU,CAACL,MAAO;QAC1BC,QAAQ,EAAEI,UAAU,CAACJ,QAAS;AAC9BC,QAAAA,uBAAuB,EAAEA,uBAAwB;AAAAH,QAAAA,QAAA,EAEhDA;OACW;KACE;AACpB,GAAmB,CAAC;AAExB;;;;"}