@transferwise/components 0.0.0-experimental-462f9b8 → 0.0.0-experimental-9ea3dcb
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/button/Button/src/Button.js +0 -1
- package/build/button/Button/src/Button.js.map +1 -1
- package/build/button/Button/src/Button.mjs +0 -1
- package/build/button/Button/src/Button.mjs.map +1 -1
- package/build/types/button/Button/src/Button.d.ts.map +1 -1
- package/package.json +3 -3
- package/src/button/Button/src/Button.tsx +1 -3
- package/src/button/Button/stories/Button.tests.story.tsx +3 -0
|
@@ -60,7 +60,6 @@ const Button = /*#__PURE__*/React.forwardRef(({
|
|
|
60
60
|
className: "wds-Button-avatars",
|
|
61
61
|
children: avatars.length === 1 ? /*#__PURE__*/jsxRuntime.jsx(AvatarView, {
|
|
62
62
|
size: 24,
|
|
63
|
-
...avatars[0],
|
|
64
63
|
children: avatars[0]?.asset
|
|
65
64
|
}) : /*#__PURE__*/jsxRuntime.jsx(AvatarLayout, {
|
|
66
65
|
orientation: "horizontal",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../../src/button/Button/src/Button.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\nimport { clsx } from 'clsx';\nimport Circle from '../../../common/circle';\nimport type { ButtonProps, ButtonIconSize } from './Button.types';\nimport PrimitiveButton from '../../../primitives/PrimitiveButton';\nimport PrimitiveAnchor from '../../../primitives/PrimitiveAnchor';\nimport ProcessIndicator from '../../../processIndicator/ProcessIndicator';\nimport AvatarView from '../../../avatarView/AvatarView';\nimport AvatarLayout from '../../../avatarLayout/AvatarLayout';\n\nconst Button = forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(\n (\n {\n as = 'button',\n children,\n className,\n size = 'md',\n priority = 'primary',\n appearance = 'default',\n iconLeft: LeftIcon,\n iconRight: RightIcon,\n iconOnly: IconOnly,\n avatars,\n type = 'button',\n loading = false,\n block = false,\n ...props\n },\n ref,\n ) => {\n const isButtonIconSize = (value: any): value is ButtonIconSize => {\n return [16, 24, 32, 40, 48, 56, 72].includes(value);\n };\n\n const sizeClass = useMemo(() => {\n if (IconOnly && isButtonIconSize(size)) {\n return size.toString();\n }\n return size === 'sm' ? 'small' : size === 'md' ? 'medium' : size === 'lg' ? 'large' : '';\n }, [IconOnly, size]);\n\n const classNames = clsx(\n {\n [`wds-Button`]: as === 'a',\n [`wds-Button--block`]: block,\n [`wds-Button--${sizeClass}`]: size,\n [`wds-Button--${priority}`]: priority,\n [`wds-Button--${appearance}`]: appearance,\n [`wds-Button--iconOnly`]: IconOnly,\n },\n className,\n );\n\n const contentClassNames = clsx('wds-Button-content', {\n [`wds-Button-content--loading`]: loading,\n });\n\n const content = (\n <span className={contentClassNames}>\n {loading && (\n <ProcessIndicator\n size=\"xs\"\n className=\"wds-Button-loader\"\n data-testid=\"button-loader-indicator\"\n />\n )}\n <span className=\"wds-Button-label\" aria-hidden={loading}>\n {size === 'lg' ? (\n children\n ) : (\n <>\n {size === 'md' && avatars && (\n <span className=\"wds-Button-avatars\">\n {avatars.length === 1 ? (\n <AvatarView size={24}
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../../../src/button/Button/src/Button.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\nimport { clsx } from 'clsx';\nimport Circle from '../../../common/circle';\nimport type { ButtonProps, ButtonIconSize } from './Button.types';\nimport PrimitiveButton from '../../../primitives/PrimitiveButton';\nimport PrimitiveAnchor from '../../../primitives/PrimitiveAnchor';\nimport ProcessIndicator from '../../../processIndicator/ProcessIndicator';\nimport AvatarView from '../../../avatarView/AvatarView';\nimport AvatarLayout from '../../../avatarLayout/AvatarLayout';\n\nconst Button = forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(\n (\n {\n as = 'button',\n children,\n className,\n size = 'md',\n priority = 'primary',\n appearance = 'default',\n iconLeft: LeftIcon,\n iconRight: RightIcon,\n iconOnly: IconOnly,\n avatars,\n type = 'button',\n loading = false,\n block = false,\n ...props\n },\n ref,\n ) => {\n const isButtonIconSize = (value: any): value is ButtonIconSize => {\n return [16, 24, 32, 40, 48, 56, 72].includes(value);\n };\n\n const sizeClass = useMemo(() => {\n if (IconOnly && isButtonIconSize(size)) {\n return size.toString();\n }\n return size === 'sm' ? 'small' : size === 'md' ? 'medium' : size === 'lg' ? 'large' : '';\n }, [IconOnly, size]);\n\n const classNames = clsx(\n {\n [`wds-Button`]: as === 'a',\n [`wds-Button--block`]: block,\n [`wds-Button--${sizeClass}`]: size,\n [`wds-Button--${priority}`]: priority,\n [`wds-Button--${appearance}`]: appearance,\n [`wds-Button--iconOnly`]: IconOnly,\n },\n className,\n );\n\n const contentClassNames = clsx('wds-Button-content', {\n [`wds-Button-content--loading`]: loading,\n });\n\n const content = (\n <span className={contentClassNames}>\n {loading && (\n <ProcessIndicator\n size=\"xs\"\n className=\"wds-Button-loader\"\n data-testid=\"button-loader-indicator\"\n />\n )}\n <span className=\"wds-Button-label\" aria-hidden={loading}>\n {size === 'lg' ? (\n children\n ) : (\n <>\n {size === 'md' && avatars && (\n <span className=\"wds-Button-avatars\">\n {avatars.length === 1 ? (\n <AvatarView size={24}>{avatars[0]?.asset}</AvatarView>\n ) : (\n <AvatarLayout orientation=\"horizontal\" avatars={avatars} size={24} />\n )}\n </span>\n )}\n {!avatars && LeftIcon && (\n <LeftIcon className=\"wds-Button-icon wds-Button-icon--left\" />\n )}\n {children}\n {RightIcon && <RightIcon className=\"wds-Button-icon wds-Button-icon--right\" />}\n </>\n )}\n </span>\n </span>\n );\n\n if (IconOnly) {\n const CircleContent = (\n <Circle\n ref={ref}\n as={as === 'a' ? PrimitiveAnchor : PrimitiveButton}\n size={(size as ButtonIconSize) || 40}\n fixedSize\n {...(props as any)}\n className={classNames}\n disabled={props.disabled}\n aria-label={children as string}\n >\n {IconOnly && <IconOnly className=\"wds-Button-icon\" />}\n </Circle>\n );\n\n return CircleContent;\n }\n\n if (as === 'a') {\n return (\n <PrimitiveAnchor\n ref={ref as React.Ref<HTMLAnchorElement>}\n {...(props as any)}\n className={classNames}\n disabled={props.disabled}\n >\n {content}\n </PrimitiveAnchor>\n );\n }\n\n return (\n <PrimitiveButton\n ref={ref as React.Ref<HTMLButtonElement>}\n {...(props as any)}\n className={classNames}\n disabled={props.disabled}\n loading={loading}\n type={type}\n >\n {content}\n </PrimitiveButton>\n );\n },\n);\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["Button","forwardRef","as","children","className","size","priority","appearance","iconLeft","LeftIcon","iconRight","RightIcon","iconOnly","IconOnly","avatars","type","loading","block","props","ref","isButtonIconSize","value","includes","sizeClass","useMemo","toString","classNames","clsx","contentClassNames","content","_jsxs","_jsx","ProcessIndicator","_Fragment","length","AvatarView","asset","AvatarLayout","orientation","CircleContent","Circle","PrimitiveAnchor","PrimitiveButton","fixedSize","disabled","displayName"],"mappings":";;;;;;;;;;;;AAUA,MAAMA,MAAM,gBAAGC,gBAAU,CACvB,CACE;AACEC,EAAAA,EAAE,GAAG,QAAQ;EACbC,QAAQ;EACRC,SAAS;AACTC,EAAAA,IAAI,GAAG,IAAI;AACXC,EAAAA,QAAQ,GAAG,SAAS;AACpBC,EAAAA,UAAU,GAAG,SAAS;AACtBC,EAAAA,QAAQ,EAAEC,QAAQ;AAClBC,EAAAA,SAAS,EAAEC,SAAS;AACpBC,EAAAA,QAAQ,EAAEC,QAAQ;EAClBC,OAAO;AACPC,EAAAA,IAAI,GAAG,QAAQ;AACfC,EAAAA,OAAO,GAAG,KAAK;AACfC,EAAAA,KAAK,GAAG,KAAK;EACb,GAAGC,KAAAA;AACJ,CAAA,EACDC,GAAG,KACD;EACF,MAAMC,gBAAgB,GAAIC,KAAU,IAA6B;AAC/D,IAAA,OAAO,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAACC,QAAQ,CAACD,KAAK,CAAC,CAAA;GACpD,CAAA;AAED,EAAA,MAAME,SAAS,GAAGC,aAAO,CAAC,MAAK;AAC7B,IAAA,IAAIX,QAAQ,IAAIO,gBAAgB,CAACf,IAAI,CAAC,EAAE;AACtC,MAAA,OAAOA,IAAI,CAACoB,QAAQ,EAAE,CAAA;AACxB,KAAA;AACA,IAAA,OAAOpB,IAAI,KAAK,IAAI,GAAG,OAAO,GAAGA,IAAI,KAAK,IAAI,GAAG,QAAQ,GAAGA,IAAI,KAAK,IAAI,GAAG,OAAO,GAAG,EAAE,CAAA;AAC1F,GAAC,EAAE,CAACQ,QAAQ,EAAER,IAAI,CAAC,CAAC,CAAA;EAEpB,MAAMqB,UAAU,GAAGC,SAAI,CACrB;AACE,IAAA,CAAC,CAAY,UAAA,CAAA,GAAGzB,EAAE,KAAK,GAAG;IAC1B,CAAC,CAAA,iBAAA,CAAmB,GAAGe,KAAK;AAC5B,IAAA,CAAC,CAAeM,YAAAA,EAAAA,SAAS,CAAE,CAAA,GAAGlB,IAAI;AAClC,IAAA,CAAC,CAAeC,YAAAA,EAAAA,QAAQ,CAAE,CAAA,GAAGA,QAAQ;AACrC,IAAA,CAAC,CAAeC,YAAAA,EAAAA,UAAU,CAAE,CAAA,GAAGA,UAAU;AACzC,IAAA,CAAC,sBAAsB,GAAGM,QAAAA;GAC3B,EACDT,SAAS,CACV,CAAA;AAED,EAAA,MAAMwB,iBAAiB,GAAGD,SAAI,CAAC,oBAAoB,EAAE;AACnD,IAAA,CAAC,6BAA6B,GAAGX,OAAAA;AAClC,GAAA,CAAC,CAAA;EAEF,MAAMa,OAAO,gBACXC,eAAA,CAAA,MAAA,EAAA;AAAM1B,IAAAA,SAAS,EAAEwB,iBAAkB;AAAAzB,IAAAA,QAAA,EAChCa,CAAAA,OAAO,iBACNe,cAAA,CAACC,gBAAgB,EAAA;AACf3B,MAAAA,IAAI,EAAC,IAAI;AACTD,MAAAA,SAAS,EAAC,mBAAmB;MAC7B,aAAY,EAAA,yBAAA;KAAyB,CAExC,eACD2B,cAAA,CAAA,MAAA,EAAA;AAAM3B,MAAAA,SAAS,EAAC,kBAAkB;AAAC,MAAA,aAAA,EAAaY,OAAQ;MAAAb,QAAA,EACrDE,IAAI,KAAK,IAAI,GACZF,QAAQ,gBAER2B,eAAA,CAAAG,mBAAA,EAAA;AAAA9B,QAAAA,QAAA,GACGE,IAAI,KAAK,IAAI,IAAIS,OAAO,iBACvBiB,cAAA,CAAA,MAAA,EAAA;AAAM3B,UAAAA,SAAS,EAAC,oBAAoB;UAAAD,QAAA,EACjCW,OAAO,CAACoB,MAAM,KAAK,CAAC,gBACnBH,cAAA,CAACI,UAAU,EAAA;AAAC9B,YAAAA,IAAI,EAAE,EAAG;AAAAF,YAAAA,QAAA,EAAEW,OAAO,CAAC,CAAC,CAAC,EAAEsB,KAAAA;AAAK,WAAa,CAAC,gBAEtDL,cAAA,CAACM,YAAY,EAAA;AAACC,YAAAA,WAAW,EAAC,YAAY;AAACxB,YAAAA,OAAO,EAAEA,OAAQ;AAACT,YAAAA,IAAI,EAAE,EAAA;WAAM,CAAA;SAEnE,CACP,EACA,CAACS,OAAO,IAAIL,QAAQ,iBACnBsB,cAAA,CAACtB,QAAQ,EAAA;AAACL,UAAAA,SAAS,EAAC,uCAAA;SAAuC,CAC5D,EACAD,QAAQ,EACRQ,SAAS,iBAAIoB,cAAA,CAACpB,SAAS,EAAA;AAACP,UAAAA,SAAS,EAAC,wCAAA;AAAwC,SAAA,CAAG,CAAA;OAChF,CAAA;AACD,KACG,CACR,CAAA;AAAA,GAAM,CACP,CAAA;AAED,EAAA,IAAIS,QAAQ,EAAE;AACZ,IAAA,MAAM0B,aAAa,gBACjBR,cAAA,CAACS,MAAM,EAAA;AACLrB,MAAAA,GAAG,EAAEA,GAAI;AACTjB,MAAAA,EAAE,EAAEA,EAAE,KAAK,GAAG,GAAGuC,eAAe,GAAGC,eAAgB;MACnDrC,IAAI,EAAGA,IAAuB,IAAI,EAAG;MACrCsC,SAAS,EAAA,IAAA;AAAA,MAAA,GACJzB,KAAa;AAClBd,MAAAA,SAAS,EAAEsB,UAAW;MACtBkB,QAAQ,EAAE1B,KAAK,CAAC0B,QAAS;AACzB,MAAA,YAAA,EAAYzC,QAAmB;AAAAA,MAAAA,QAAA,EAE9BU,QAAQ,iBAAIkB,cAAA,CAAClB,QAAQ,EAAA;AAACT,QAAAA,SAAS,EAAC,iBAAA;OAAiB,CAAA;AAAG,KAC/C,CACT,CAAA;AAED,IAAA,OAAOmC,aAAa,CAAA;AACtB,GAAA;EAEA,IAAIrC,EAAE,KAAK,GAAG,EAAE;IACd,oBACE6B,cAAA,CAACU,eAAe,EAAA;AACdtB,MAAAA,GAAG,EAAEA,GAAoC;AAAA,MAAA,GACpCD,KAAa;AAClBd,MAAAA,SAAS,EAAEsB,UAAW;MACtBkB,QAAQ,EAAE1B,KAAK,CAAC0B,QAAS;AAAAzC,MAAAA,QAAA,EAExB0B,OAAAA;AAAO,KACO,CAAC,CAAA;AAEtB,GAAA;EAEA,oBACEE,cAAA,CAACW,eAAe,EAAA;AACdvB,IAAAA,GAAG,EAAEA,GAAoC;AAAA,IAAA,GACpCD,KAAa;AAClBd,IAAAA,SAAS,EAAEsB,UAAW;IACtBkB,QAAQ,EAAE1B,KAAK,CAAC0B,QAAS;AACzB5B,IAAAA,OAAO,EAAEA,OAAQ;AACjBD,IAAAA,IAAI,EAAEA,IAAK;AAAAZ,IAAAA,QAAA,EAEV0B,OAAAA;AAAO,GACO,CAAC,CAAA;AAEtB,CAAC,EACF;AAED7B,MAAM,CAAC6C,WAAW,GAAG,QAAQ;;;;"}
|
|
@@ -58,7 +58,6 @@ const Button = /*#__PURE__*/forwardRef(({
|
|
|
58
58
|
className: "wds-Button-avatars",
|
|
59
59
|
children: avatars.length === 1 ? /*#__PURE__*/jsx(AvatarView, {
|
|
60
60
|
size: 24,
|
|
61
|
-
...avatars[0],
|
|
62
61
|
children: avatars[0]?.asset
|
|
63
62
|
}) : /*#__PURE__*/jsx(AvatarLayout, {
|
|
64
63
|
orientation: "horizontal",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.mjs","sources":["../../../../src/button/Button/src/Button.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\nimport { clsx } from 'clsx';\nimport Circle from '../../../common/circle';\nimport type { ButtonProps, ButtonIconSize } from './Button.types';\nimport PrimitiveButton from '../../../primitives/PrimitiveButton';\nimport PrimitiveAnchor from '../../../primitives/PrimitiveAnchor';\nimport ProcessIndicator from '../../../processIndicator/ProcessIndicator';\nimport AvatarView from '../../../avatarView/AvatarView';\nimport AvatarLayout from '../../../avatarLayout/AvatarLayout';\n\nconst Button = forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(\n (\n {\n as = 'button',\n children,\n className,\n size = 'md',\n priority = 'primary',\n appearance = 'default',\n iconLeft: LeftIcon,\n iconRight: RightIcon,\n iconOnly: IconOnly,\n avatars,\n type = 'button',\n loading = false,\n block = false,\n ...props\n },\n ref,\n ) => {\n const isButtonIconSize = (value: any): value is ButtonIconSize => {\n return [16, 24, 32, 40, 48, 56, 72].includes(value);\n };\n\n const sizeClass = useMemo(() => {\n if (IconOnly && isButtonIconSize(size)) {\n return size.toString();\n }\n return size === 'sm' ? 'small' : size === 'md' ? 'medium' : size === 'lg' ? 'large' : '';\n }, [IconOnly, size]);\n\n const classNames = clsx(\n {\n [`wds-Button`]: as === 'a',\n [`wds-Button--block`]: block,\n [`wds-Button--${sizeClass}`]: size,\n [`wds-Button--${priority}`]: priority,\n [`wds-Button--${appearance}`]: appearance,\n [`wds-Button--iconOnly`]: IconOnly,\n },\n className,\n );\n\n const contentClassNames = clsx('wds-Button-content', {\n [`wds-Button-content--loading`]: loading,\n });\n\n const content = (\n <span className={contentClassNames}>\n {loading && (\n <ProcessIndicator\n size=\"xs\"\n className=\"wds-Button-loader\"\n data-testid=\"button-loader-indicator\"\n />\n )}\n <span className=\"wds-Button-label\" aria-hidden={loading}>\n {size === 'lg' ? (\n children\n ) : (\n <>\n {size === 'md' && avatars && (\n <span className=\"wds-Button-avatars\">\n {avatars.length === 1 ? (\n <AvatarView size={24}
|
|
1
|
+
{"version":3,"file":"Button.mjs","sources":["../../../../src/button/Button/src/Button.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from 'react';\nimport { clsx } from 'clsx';\nimport Circle from '../../../common/circle';\nimport type { ButtonProps, ButtonIconSize } from './Button.types';\nimport PrimitiveButton from '../../../primitives/PrimitiveButton';\nimport PrimitiveAnchor from '../../../primitives/PrimitiveAnchor';\nimport ProcessIndicator from '../../../processIndicator/ProcessIndicator';\nimport AvatarView from '../../../avatarView/AvatarView';\nimport AvatarLayout from '../../../avatarLayout/AvatarLayout';\n\nconst Button = forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(\n (\n {\n as = 'button',\n children,\n className,\n size = 'md',\n priority = 'primary',\n appearance = 'default',\n iconLeft: LeftIcon,\n iconRight: RightIcon,\n iconOnly: IconOnly,\n avatars,\n type = 'button',\n loading = false,\n block = false,\n ...props\n },\n ref,\n ) => {\n const isButtonIconSize = (value: any): value is ButtonIconSize => {\n return [16, 24, 32, 40, 48, 56, 72].includes(value);\n };\n\n const sizeClass = useMemo(() => {\n if (IconOnly && isButtonIconSize(size)) {\n return size.toString();\n }\n return size === 'sm' ? 'small' : size === 'md' ? 'medium' : size === 'lg' ? 'large' : '';\n }, [IconOnly, size]);\n\n const classNames = clsx(\n {\n [`wds-Button`]: as === 'a',\n [`wds-Button--block`]: block,\n [`wds-Button--${sizeClass}`]: size,\n [`wds-Button--${priority}`]: priority,\n [`wds-Button--${appearance}`]: appearance,\n [`wds-Button--iconOnly`]: IconOnly,\n },\n className,\n );\n\n const contentClassNames = clsx('wds-Button-content', {\n [`wds-Button-content--loading`]: loading,\n });\n\n const content = (\n <span className={contentClassNames}>\n {loading && (\n <ProcessIndicator\n size=\"xs\"\n className=\"wds-Button-loader\"\n data-testid=\"button-loader-indicator\"\n />\n )}\n <span className=\"wds-Button-label\" aria-hidden={loading}>\n {size === 'lg' ? (\n children\n ) : (\n <>\n {size === 'md' && avatars && (\n <span className=\"wds-Button-avatars\">\n {avatars.length === 1 ? (\n <AvatarView size={24}>{avatars[0]?.asset}</AvatarView>\n ) : (\n <AvatarLayout orientation=\"horizontal\" avatars={avatars} size={24} />\n )}\n </span>\n )}\n {!avatars && LeftIcon && (\n <LeftIcon className=\"wds-Button-icon wds-Button-icon--left\" />\n )}\n {children}\n {RightIcon && <RightIcon className=\"wds-Button-icon wds-Button-icon--right\" />}\n </>\n )}\n </span>\n </span>\n );\n\n if (IconOnly) {\n const CircleContent = (\n <Circle\n ref={ref}\n as={as === 'a' ? PrimitiveAnchor : PrimitiveButton}\n size={(size as ButtonIconSize) || 40}\n fixedSize\n {...(props as any)}\n className={classNames}\n disabled={props.disabled}\n aria-label={children as string}\n >\n {IconOnly && <IconOnly className=\"wds-Button-icon\" />}\n </Circle>\n );\n\n return CircleContent;\n }\n\n if (as === 'a') {\n return (\n <PrimitiveAnchor\n ref={ref as React.Ref<HTMLAnchorElement>}\n {...(props as any)}\n className={classNames}\n disabled={props.disabled}\n >\n {content}\n </PrimitiveAnchor>\n );\n }\n\n return (\n <PrimitiveButton\n ref={ref as React.Ref<HTMLButtonElement>}\n {...(props as any)}\n className={classNames}\n disabled={props.disabled}\n loading={loading}\n type={type}\n >\n {content}\n </PrimitiveButton>\n );\n },\n);\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["Button","forwardRef","as","children","className","size","priority","appearance","iconLeft","LeftIcon","iconRight","RightIcon","iconOnly","IconOnly","avatars","type","loading","block","props","ref","isButtonIconSize","value","includes","sizeClass","useMemo","toString","classNames","clsx","contentClassNames","content","_jsxs","_jsx","ProcessIndicator","_Fragment","length","AvatarView","asset","AvatarLayout","orientation","CircleContent","Circle","PrimitiveAnchor","PrimitiveButton","fixedSize","disabled","displayName"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../../src/button/Button/src/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAUnD,QAAA,MAAM,MAAM,
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../../src/button/Button/src/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAUnD,QAAA,MAAM,MAAM,qNA8HX,CAAC;AAIF,eAAe,MAAM,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@transferwise/components",
|
|
3
|
-
"version": "0.0.0-experimental-
|
|
3
|
+
"version": "0.0.0-experimental-9ea3dcb",
|
|
4
4
|
"description": "Neptune React components",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"repository": {
|
|
@@ -92,12 +92,12 @@
|
|
|
92
92
|
"rollup-preserve-directives": "^1.1.1",
|
|
93
93
|
"storybook": "^8.2.2",
|
|
94
94
|
"@transferwise/less-config": "3.1.0",
|
|
95
|
-
"@transferwise/neptune-css": "0.0.0-experimental-
|
|
95
|
+
"@transferwise/neptune-css": "0.0.0-experimental-9ea3dcb",
|
|
96
96
|
"@wise/components-theming": "1.6.1"
|
|
97
97
|
},
|
|
98
98
|
"peerDependencies": {
|
|
99
99
|
"@transferwise/icons": "^3.13.1",
|
|
100
|
-
"@transferwise/neptune-css": "0.0.0-experimental-
|
|
100
|
+
"@transferwise/neptune-css": "0.0.0-experimental-9ea3dcb",
|
|
101
101
|
"@wise/art": "^2.16",
|
|
102
102
|
"@wise/components-theming": "^1.0.0",
|
|
103
103
|
"react": ">=18",
|
|
@@ -72,9 +72,7 @@ const Button = forwardRef<HTMLButtonElement | HTMLAnchorElement, ButtonProps>(
|
|
|
72
72
|
{size === 'md' && avatars && (
|
|
73
73
|
<span className="wds-Button-avatars">
|
|
74
74
|
{avatars.length === 1 ? (
|
|
75
|
-
<AvatarView size={24}
|
|
76
|
-
{avatars[0]?.asset}
|
|
77
|
-
</AvatarView>
|
|
75
|
+
<AvatarView size={24}>{avatars[0]?.asset}</AvatarView>
|
|
78
76
|
) : (
|
|
79
77
|
<AvatarLayout orientation="horizontal" avatars={avatars} size={24} />
|
|
80
78
|
)}
|
|
@@ -102,6 +102,9 @@ export const MouseLeaveInteraction: Story = {
|
|
|
102
102
|
play: async ({ canvasElement }: { canvasElement: HTMLElement }) => {
|
|
103
103
|
const canvas = within(canvasElement);
|
|
104
104
|
const button = canvas.getByRole('button');
|
|
105
|
+
await userEvent.hover(button);
|
|
106
|
+
// eslint-disable-next-line no-promise-executor-return
|
|
107
|
+
await new Promise<void>((resolve) => setTimeout(resolve, 200));
|
|
105
108
|
await userEvent.unhover(button);
|
|
106
109
|
await expect(button).toHaveTextContent('Left!');
|
|
107
110
|
},
|