@transferwise/components 0.0.0-experimental-a9e2e05 → 0.0.0-experimental-ca51404
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/avatarLayout/AvatarLayout.js +3 -9
- package/build/avatarLayout/AvatarLayout.js.map +1 -1
- package/build/avatarLayout/AvatarLayout.mjs +3 -9
- package/build/avatarLayout/AvatarLayout.mjs.map +1 -1
- package/build/button/{LegacyButton/Button.js → Button.js} +24 -25
- package/build/button/Button.js.map +1 -0
- package/build/button/{LegacyButton/Button.mjs → Button.mjs} +24 -25
- package/build/button/Button.mjs.map +1 -0
- package/build/button/classMap.js +42 -0
- package/build/button/classMap.js.map +1 -0
- package/build/button/classMap.mjs +39 -0
- package/build/button/classMap.mjs.map +1 -0
- package/build/button/{LegacyButton/legacyUtils → legacyUtils}/legacyUtils.js +21 -21
- package/build/button/legacyUtils/legacyUtils.js.map +1 -0
- package/build/button/{LegacyButton/legacyUtils → legacyUtils}/legacyUtils.mjs +21 -21
- package/build/button/legacyUtils/legacyUtils.mjs.map +1 -0
- package/build/circularButton/CircularButton.js +1 -1
- package/build/circularButton/CircularButton.js.map +1 -1
- package/build/circularButton/CircularButton.mjs +1 -1
- package/build/circularButton/CircularButton.mjs.map +1 -1
- package/build/common/action/Action.js +1 -1
- package/build/common/action/Action.js.map +1 -1
- package/build/common/action/Action.mjs +1 -1
- package/build/common/action/Action.mjs.map +1 -1
- package/build/criticalBanner/CriticalCommsBanner.js +1 -1
- package/build/criticalBanner/CriticalCommsBanner.mjs +1 -1
- package/build/header/Header.js +1 -1
- package/build/header/Header.mjs +1 -1
- package/build/index.js +1 -1
- package/build/index.mjs +1 -1
- package/build/link/Link.js +3 -8
- package/build/link/Link.js.map +1 -1
- package/build/link/Link.mjs +3 -8
- package/build/link/Link.mjs.map +1 -1
- package/build/main.css +29 -288
- package/build/nudge/Nudge.js +1 -1
- package/build/nudge/Nudge.js.map +1 -1
- package/build/nudge/Nudge.mjs +1 -1
- package/build/nudge/Nudge.mjs.map +1 -1
- package/build/select/Select.js +1 -1
- package/build/select/Select.mjs +1 -1
- package/build/styles/avatarLayout/AvatarLayout.css +0 -11
- package/build/styles/iconButton/IconButton.css +29 -24
- package/build/styles/main.css +29 -288
- package/build/types/avatarLayout/AvatarLayout.d.ts +2 -1
- package/build/types/avatarLayout/AvatarLayout.d.ts.map +1 -1
- package/build/types/avatarLayout/index.d.ts +0 -1
- package/build/types/avatarLayout/index.d.ts.map +1 -1
- package/build/types/button/{LegacyButton/Button.d.ts → Button.d.ts} +5 -8
- package/build/types/button/Button.d.ts.map +1 -0
- package/build/types/button/classMap.d.ts.map +1 -0
- package/build/types/button/index.d.ts +2 -2
- package/build/types/button/index.d.ts.map +1 -1
- package/build/types/button/legacyUtils/index.d.ts.map +1 -0
- package/build/types/button/{LegacyButton/legacyUtils → legacyUtils}/legacyUtils.d.ts +1 -1
- package/build/types/button/legacyUtils/legacyUtils.d.ts.map +1 -0
- package/build/types/link/Link.d.ts +2 -2
- package/build/types/link/Link.d.ts.map +1 -1
- package/build/types/test-utils/index.d.ts.map +1 -1
- package/build/upload/steps/completeStep/completeStep.js +1 -1
- package/build/upload/steps/completeStep/completeStep.mjs +1 -1
- package/build/upload/steps/processingStep/processingStep.js +1 -1
- package/build/upload/steps/processingStep/processingStep.mjs +1 -1
- package/build/uploadInput/UploadInput.js +1 -1
- package/build/uploadInput/UploadInput.mjs +1 -1
- package/package.json +5 -5
- package/src/avatarLayout/AvatarLayout.css +0 -11
- package/src/avatarLayout/AvatarLayout.less +1 -18
- package/src/avatarLayout/AvatarLayout.story.tsx +2 -0
- package/src/avatarLayout/AvatarLayout.tsx +6 -12
- package/src/avatarLayout/index.ts +0 -1
- package/src/avatarWrapper/AvatarWrapper.story.tsx +0 -2
- package/src/button/{LegacyButton/Button.less → Button.less} +1 -1
- package/src/button/{LegacyButton/Button.spec.tsx → Button.spec.tsx} +3 -3
- package/src/button/Button.story.tsx +163 -0
- package/src/button/{LegacyButton/Button.tsx → Button.tsx} +9 -14
- package/src/button/{LegacyButton/classMap.ts → classMap.ts} +1 -1
- package/src/button/index.ts +3 -2
- package/src/button/{LegacyButton/legacyUtils → legacyUtils}/legacyUtils.spec.tsx +2 -2
- package/src/button/{LegacyButton/legacyUtils → legacyUtils}/legacyUtils.ts +2 -2
- package/src/circularButton/CircularButton.tsx +1 -1
- package/src/common/action/Action.tsx +1 -1
- package/src/iconButton/IconButton.css +29 -24
- package/src/iconButton/IconButton.less +4 -4
- package/src/link/Link.tsx +6 -15
- package/src/main.css +29 -288
- package/src/main.less +1 -2
- package/src/nudge/Nudge.tsx +1 -1
- package/src/primitives/PrimitiveAnchor/stories/PrimitiveAnchor.story.tsx +1 -1
- package/src/primitives/PrimitiveAnchor/test/PrimitiveAnchor.spec.tsx +1 -1
- package/src/primitives/PrimitiveButton/stories/PrimitiveButton.story.tsx +1 -1
- package/src/primitives/PrimitiveButton/test/PrimitiveButton.spec.tsx +3 -2
- package/src/test-utils/index.tsx +1 -0
- package/build/button/Button/src/Button.js +0 -93
- package/build/button/Button/src/Button.js.map +0 -1
- package/build/button/Button/src/Button.mjs +0 -91
- package/build/button/Button/src/Button.mjs.map +0 -1
- package/build/button/LegacyButton/Button.js.map +0 -1
- package/build/button/LegacyButton/Button.mjs.map +0 -1
- package/build/button/LegacyButton/classMap.js +0 -42
- package/build/button/LegacyButton/classMap.js.map +0 -1
- package/build/button/LegacyButton/classMap.mjs +0 -39
- package/build/button/LegacyButton/classMap.mjs.map +0 -1
- package/build/button/LegacyButton/legacyUtils/legacyUtils.js.map +0 -1
- package/build/button/LegacyButton/legacyUtils/legacyUtils.mjs.map +0 -1
- package/build/button/src/Button.js +0 -66
- package/build/button/src/Button.js.map +0 -1
- package/build/button/src/Button.mjs +0 -64
- package/build/button/src/Button.mjs.map +0 -1
- package/build/styles/button/Button/less/Button.css +0 -253
- package/build/styles/button/Button/less/Button.vars.css +0 -57
- package/build/types/button/Button/index.d.ts +0 -3
- package/build/types/button/Button/index.d.ts.map +0 -1
- package/build/types/button/Button/src/Button.d.ts +0 -4
- package/build/types/button/Button/src/Button.d.ts.map +0 -1
- package/build/types/button/Button/src/Button.types.d.ts +0 -50
- package/build/types/button/Button/src/Button.types.d.ts.map +0 -1
- package/build/types/button/Button/src/index.d.ts +0 -2
- package/build/types/button/Button/src/index.d.ts.map +0 -1
- package/build/types/button/LegacyButton/Button.d.ts.map +0 -1
- package/build/types/button/LegacyButton/classMap.d.ts.map +0 -1
- package/build/types/button/LegacyButton/index.d.ts +0 -3
- package/build/types/button/LegacyButton/index.d.ts.map +0 -1
- package/build/types/button/LegacyButton/legacyUtils/index.d.ts.map +0 -1
- package/build/types/button/LegacyButton/legacyUtils/legacyUtils.d.ts.map +0 -1
- package/build/types/button/src/Button.d.ts +0 -47
- package/build/types/button/src/Button.d.ts.map +0 -1
- package/build/types/button/src/index.d.ts +0 -3
- package/build/types/button/src/index.d.ts.map +0 -1
- package/src/button/Button/index.ts +0 -2
- package/src/button/Button/less/Button.css +0 -253
- package/src/button/Button/less/Button.less +0 -221
- package/src/button/Button/less/Button.vars.css +0 -57
- package/src/button/Button/less/Button.vars.less +0 -65
- package/src/button/Button/src/Button.tsx +0 -116
- package/src/button/Button/src/Button.types.ts +0 -70
- package/src/button/Button/src/index.ts +0 -1
- package/src/button/Button/stories/Button.story.tsx +0 -314
- package/src/button/Button/stories/Button.tests.story.tsx +0 -288
- package/src/button/Button/test/Button.spec.tsx +0 -328
- package/src/button/LegacyButton/Button.story.tsx +0 -224
- package/src/button/LegacyButton/index.ts +0 -3
- package/src/button/src/Button.tsx +0 -87
- package/src/button/src/index.ts +0 -2
- package/src/button/test/Button.spec.tsx +0 -32
- /package/build/styles/button/{LegacyButton/Button.css → Button.css} +0 -0
- /package/build/types/button/{LegacyButton/classMap.d.ts → classMap.d.ts} +0 -0
- /package/build/types/button/{LegacyButton/legacyUtils → legacyUtils}/index.d.ts +0 -0
- /package/src/button/{LegacyButton/Button.css → Button.css} +0 -0
- /package/src/button/{LegacyButton/__snapshots__ → __snapshots__}/Button.spec.tsx.snap +0 -0
- /package/src/button/{LegacyButton/legacyUtils → legacyUtils}/index.ts +0 -0
|
@@ -1 +0,0 @@
|
|
|
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 type { ButtonProps } 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 href,\n priority = 'primary',\n appearance = 'default',\n iconLeft: LeftIcon,\n iconRight: RightIcon,\n avatars,\n type = 'button',\n loading = false,\n block = false,\n ...props\n },\n ref,\n ) => {\n const sizeClass = useMemo(() => {\n return size === 'sm' ? 'small' : size === 'md' ? 'medium' : size === 'lg' ? 'large' : '';\n }, [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 },\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]}>\n {avatars[0]?.asset}\n </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 (as === 'a') {\n return (\n <PrimitiveAnchor\n ref={ref as React.Ref<HTMLAnchorElement>}\n {...(props as any)}\n href={href}\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","href","priority","appearance","iconLeft","LeftIcon","iconRight","RightIcon","avatars","type","loading","block","props","ref","sizeClass","useMemo","classNames","clsx","contentClassNames","content","_jsxs","_jsx","ProcessIndicator","_Fragment","length","AvatarView","asset","AvatarLayout","orientation","PrimitiveAnchor","disabled","PrimitiveButton","displayName"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../src/button/LegacyButton/Button.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ElementType, forwardRef, MouseEvent } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport {\n Size,\n ControlType,\n Priority,\n ControlTypeAccent,\n ControlTypeNegative,\n ControlTypePositive,\n PriorityPrimary,\n PrioritySecondary,\n PriorityTertiary,\n SizeExtraSmall,\n SizeSmall,\n SizeMedium,\n SizeLarge,\n} from '../../common';\nimport ProcessIndicator from '../../processIndicator';\n\nimport messages from '../../i18n/commonMessages/Button.messages';\nimport { typeClassMap, priorityClassMap } from './classMap';\nimport { establishNewPriority, establishNewType, logDeprecationNotices } from './legacyUtils';\n\n/** @deprecated */\ntype DeprecatedTypes = 'primary' | 'pay' | 'secondary' | 'danger' | 'link';\n\n/** @deprecated */\ntype DeprecatedSizes = SizeExtraSmall;\n\ntype CommonProps = {\n block?: boolean;\n disabled?: boolean;\n loading?: boolean;\n /** @deprecated */\n type?: ControlTypeAccent | ControlTypeNegative | ControlTypePositive | DeprecatedTypes | null;\n priority?: PriorityPrimary | PrioritySecondary | PriorityTertiary | null;\n size?: SizeSmall | SizeMedium | SizeLarge | DeprecatedSizes;\n};\n\nexport type ButtonProps = CommonProps &\n Omit<React.ComponentPropsWithRef<'button'>, 'type'> & {\n as?: 'button' | undefined;\n /** @deprecated */\n htmlType?: 'submit' | 'reset' | 'button';\n };\n\nexport type AnchorProps = CommonProps &\n Omit<React.ComponentPropsWithRef<'a'>, 'type'> & {\n as?: 'a' | undefined;\n href?: string;\n };\n\nexport type Props = ButtonProps | AnchorProps;\n\nexport type ButtonReferenceType = HTMLButtonElement | HTMLAnchorElement;\n\nconst Button = forwardRef<ButtonReferenceType, Props>(\n (\n {\n as: component,\n block = false,\n children,\n className,\n disabled,\n loading = false,\n priority = Priority.PRIMARY,\n size = Size.MEDIUM,\n type = ControlType.ACCENT,\n onClick,\n ...rest\n }: Props,\n ref,\n ) => {\n const intl = useIntl();\n\n logDeprecationNotices({ size, type });\n\n const newType = establishNewType(type);\n const newPriority = establishNewPriority(priority, type);\n\n const classes = clsx(\n `btn btn-${size}`,\n `np-btn np-btn-${size}`,\n {\n 'btn-loading': loading,\n 'btn-block np-btn-block': block,\n disabled,\n },\n // @ts-expect-error fix when refactor `typeClassMap` to TypeScript\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n typeClassMap[newType],\n // @ts-expect-error fix when refactor `typeClassMap` to TypeScript\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n priorityClassMap[newPriority],\n className,\n );\n\n function processIndicatorSize() {\n return ['sm', 'xs'].includes(size) ? 'xxs' : 'xs';\n }\n\n const Element = (component as ElementType) ?? 'button';\n let props;\n\n if (Element === 'button') {\n const { htmlType = 'button', ...restProps } = rest as ButtonProps;\n props = {\n ...restProps,\n disabled,\n 'aria-disabled': loading,\n type: htmlType,\n };\n } else {\n props = {\n ...rest,\n 'aria-disabled': loading,\n } as AnchorProps;\n }\n\n /**\n * Ensures that the button cannot be activated in loading or disabled mode,\n * when `aria-disabled` might be used over the `disabled` HTML attribute\n */\n const handleClick =\n (handler: Props['onClick']) =>\n (event: MouseEvent<HTMLButtonElement> & MouseEvent<HTMLAnchorElement>) => {\n if (disabled || loading) {\n event.preventDefault();\n } else if (typeof handler === 'function') {\n handler(event);\n }\n };\n\n return (\n <Element\n ref={ref}\n className={classes}\n onClick={handleClick(onClick)}\n {...props}\n aria-live={loading ? 'polite' : 'off'}\n aria-busy={loading}\n aria-label={loading ? intl.formatMessage(messages.loadingAriaLabel) : rest['aria-label']}\n >\n {children}\n {loading && (\n <ProcessIndicator\n size={processIndicatorSize()}\n className=\"btn-loader\"\n data-testid=\"ButtonProgressIndicator\"\n />\n )}\n </Element>\n );\n },\n);\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["Button","forwardRef","as","component","block","children","className","disabled","loading","priority","Priority","PRIMARY","size","Size","MEDIUM","type","ControlType","ACCENT","onClick","rest","ref","intl","useIntl","logDeprecationNotices","newType","establishNewType","newPriority","establishNewPriority","classes","clsx","typeClassMap","priorityClassMap","processIndicatorSize","includes","Element","props","htmlType","restProps","handleClick","handler","event","preventDefault","_jsxs","formatMessage","messages","loadingAriaLabel","_jsx","ProcessIndicator","displayName"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Button.mjs","sources":["../../../src/button/LegacyButton/Button.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ElementType, forwardRef, MouseEvent } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport {\n Size,\n ControlType,\n Priority,\n ControlTypeAccent,\n ControlTypeNegative,\n ControlTypePositive,\n PriorityPrimary,\n PrioritySecondary,\n PriorityTertiary,\n SizeExtraSmall,\n SizeSmall,\n SizeMedium,\n SizeLarge,\n} from '../../common';\nimport ProcessIndicator from '../../processIndicator';\n\nimport messages from '../../i18n/commonMessages/Button.messages';\nimport { typeClassMap, priorityClassMap } from './classMap';\nimport { establishNewPriority, establishNewType, logDeprecationNotices } from './legacyUtils';\n\n/** @deprecated */\ntype DeprecatedTypes = 'primary' | 'pay' | 'secondary' | 'danger' | 'link';\n\n/** @deprecated */\ntype DeprecatedSizes = SizeExtraSmall;\n\ntype CommonProps = {\n block?: boolean;\n disabled?: boolean;\n loading?: boolean;\n /** @deprecated */\n type?: ControlTypeAccent | ControlTypeNegative | ControlTypePositive | DeprecatedTypes | null;\n priority?: PriorityPrimary | PrioritySecondary | PriorityTertiary | null;\n size?: SizeSmall | SizeMedium | SizeLarge | DeprecatedSizes;\n};\n\nexport type ButtonProps = CommonProps &\n Omit<React.ComponentPropsWithRef<'button'>, 'type'> & {\n as?: 'button' | undefined;\n /** @deprecated */\n htmlType?: 'submit' | 'reset' | 'button';\n };\n\nexport type AnchorProps = CommonProps &\n Omit<React.ComponentPropsWithRef<'a'>, 'type'> & {\n as?: 'a' | undefined;\n href?: string;\n };\n\nexport type Props = ButtonProps | AnchorProps;\n\nexport type ButtonReferenceType = HTMLButtonElement | HTMLAnchorElement;\n\nconst Button = forwardRef<ButtonReferenceType, Props>(\n (\n {\n as: component,\n block = false,\n children,\n className,\n disabled,\n loading = false,\n priority = Priority.PRIMARY,\n size = Size.MEDIUM,\n type = ControlType.ACCENT,\n onClick,\n ...rest\n }: Props,\n ref,\n ) => {\n const intl = useIntl();\n\n logDeprecationNotices({ size, type });\n\n const newType = establishNewType(type);\n const newPriority = establishNewPriority(priority, type);\n\n const classes = clsx(\n `btn btn-${size}`,\n `np-btn np-btn-${size}`,\n {\n 'btn-loading': loading,\n 'btn-block np-btn-block': block,\n disabled,\n },\n // @ts-expect-error fix when refactor `typeClassMap` to TypeScript\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n typeClassMap[newType],\n // @ts-expect-error fix when refactor `typeClassMap` to TypeScript\n // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n priorityClassMap[newPriority],\n className,\n );\n\n function processIndicatorSize() {\n return ['sm', 'xs'].includes(size) ? 'xxs' : 'xs';\n }\n\n const Element = (component as ElementType) ?? 'button';\n let props;\n\n if (Element === 'button') {\n const { htmlType = 'button', ...restProps } = rest as ButtonProps;\n props = {\n ...restProps,\n disabled,\n 'aria-disabled': loading,\n type: htmlType,\n };\n } else {\n props = {\n ...rest,\n 'aria-disabled': loading,\n } as AnchorProps;\n }\n\n /**\n * Ensures that the button cannot be activated in loading or disabled mode,\n * when `aria-disabled` might be used over the `disabled` HTML attribute\n */\n const handleClick =\n (handler: Props['onClick']) =>\n (event: MouseEvent<HTMLButtonElement> & MouseEvent<HTMLAnchorElement>) => {\n if (disabled || loading) {\n event.preventDefault();\n } else if (typeof handler === 'function') {\n handler(event);\n }\n };\n\n return (\n <Element\n ref={ref}\n className={classes}\n onClick={handleClick(onClick)}\n {...props}\n aria-live={loading ? 'polite' : 'off'}\n aria-busy={loading}\n aria-label={loading ? intl.formatMessage(messages.loadingAriaLabel) : rest['aria-label']}\n >\n {children}\n {loading && (\n <ProcessIndicator\n size={processIndicatorSize()}\n className=\"btn-loader\"\n data-testid=\"ButtonProgressIndicator\"\n />\n )}\n </Element>\n );\n },\n);\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["Button","forwardRef","as","component","block","children","className","disabled","loading","priority","Priority","PRIMARY","size","Size","MEDIUM","type","ControlType","ACCENT","onClick","rest","ref","intl","useIntl","logDeprecationNotices","newType","establishNewType","newPriority","establishNewPriority","classes","clsx","typeClassMap","priorityClassMap","processIndicatorSize","includes","Element","props","htmlType","restProps","handleClick","handler","event","preventDefault","_jsxs","formatMessage","messages","loadingAriaLabel","_jsx","ProcessIndicator","displayName"],"mappings":"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"}
|
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
require('../../common/theme.js');
|
|
4
|
-
require('../../common/direction.js');
|
|
5
|
-
var control = require('../../common/propsValues/control.js');
|
|
6
|
-
require('../../common/propsValues/breakpoint.js');
|
|
7
|
-
require('../../common/propsValues/size.js');
|
|
8
|
-
require('../../common/propsValues/typography.js');
|
|
9
|
-
require('../../common/propsValues/width.js');
|
|
10
|
-
require('../../common/propsValues/type.js');
|
|
11
|
-
require('../../common/propsValues/dateMode.js');
|
|
12
|
-
require('../../common/propsValues/monthFormat.js');
|
|
13
|
-
require('../../common/propsValues/position.js');
|
|
14
|
-
require('../../common/propsValues/layouts.js');
|
|
15
|
-
require('../../common/propsValues/status.js');
|
|
16
|
-
require('../../common/propsValues/sentiment.js');
|
|
17
|
-
require('../../common/propsValues/profileType.js');
|
|
18
|
-
require('../../common/propsValues/variant.js');
|
|
19
|
-
require('../../common/propsValues/scroll.js');
|
|
20
|
-
require('../../common/propsValues/markdownNodeType.js');
|
|
21
|
-
require('../../common/fileType.js');
|
|
22
|
-
require('@transferwise/icons');
|
|
23
|
-
require('clsx');
|
|
24
|
-
require('react');
|
|
25
|
-
require('react-intl');
|
|
26
|
-
require('../../common/closeButton/CloseButton.messages.js');
|
|
27
|
-
require('react/jsx-runtime');
|
|
28
|
-
|
|
29
|
-
const typeClassMap = {
|
|
30
|
-
[control.ControlType.ACCENT]: 'btn-accent',
|
|
31
|
-
[control.ControlType.POSITIVE]: 'btn-positive',
|
|
32
|
-
[control.ControlType.NEGATIVE]: 'btn-negative'
|
|
33
|
-
};
|
|
34
|
-
const priorityClassMap = {
|
|
35
|
-
[control.Priority.PRIMARY]: 'btn-priority-1',
|
|
36
|
-
[control.Priority.SECONDARY]: 'btn-priority-2',
|
|
37
|
-
[control.Priority.TERTIARY]: 'btn-priority-3'
|
|
38
|
-
};
|
|
39
|
-
|
|
40
|
-
exports.priorityClassMap = priorityClassMap;
|
|
41
|
-
exports.typeClassMap = typeClassMap;
|
|
42
|
-
//# sourceMappingURL=classMap.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"classMap.js","sources":["../../../src/button/LegacyButton/classMap.ts"],"sourcesContent":["import { ControlType, Priority } from '../../common';\n\nexport const typeClassMap = {\n [ControlType.ACCENT]: 'btn-accent',\n [ControlType.POSITIVE]: 'btn-positive',\n [ControlType.NEGATIVE]: 'btn-negative',\n};\n\nexport const priorityClassMap = {\n [Priority.PRIMARY]: 'btn-priority-1',\n [Priority.SECONDARY]: 'btn-priority-2',\n [Priority.TERTIARY]: 'btn-priority-3',\n};\n"],"names":["typeClassMap","ControlType","ACCENT","POSITIVE","NEGATIVE","priorityClassMap","Priority","PRIMARY","SECONDARY","TERTIARY"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEO,MAAMA,YAAY,GAAG;AAC1B,EAAA,CAACC,mBAAW,CAACC,MAAM,GAAG,YAAY;AAClC,EAAA,CAACD,mBAAW,CAACE,QAAQ,GAAG,cAAc;EACtC,CAACF,mBAAW,CAACG,QAAQ,GAAG,cAAA;EACzB;AAEM,MAAMC,gBAAgB,GAAG;AAC9B,EAAA,CAACC,gBAAQ,CAACC,OAAO,GAAG,gBAAgB;AACpC,EAAA,CAACD,gBAAQ,CAACE,SAAS,GAAG,gBAAgB;EACtC,CAACF,gBAAQ,CAACG,QAAQ,GAAG,gBAAA;;;;;;"}
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import '../../common/theme.mjs';
|
|
2
|
-
import '../../common/direction.mjs';
|
|
3
|
-
import { ControlType, Priority } from '../../common/propsValues/control.mjs';
|
|
4
|
-
import '../../common/propsValues/breakpoint.mjs';
|
|
5
|
-
import '../../common/propsValues/size.mjs';
|
|
6
|
-
import '../../common/propsValues/typography.mjs';
|
|
7
|
-
import '../../common/propsValues/width.mjs';
|
|
8
|
-
import '../../common/propsValues/type.mjs';
|
|
9
|
-
import '../../common/propsValues/dateMode.mjs';
|
|
10
|
-
import '../../common/propsValues/monthFormat.mjs';
|
|
11
|
-
import '../../common/propsValues/position.mjs';
|
|
12
|
-
import '../../common/propsValues/layouts.mjs';
|
|
13
|
-
import '../../common/propsValues/status.mjs';
|
|
14
|
-
import '../../common/propsValues/sentiment.mjs';
|
|
15
|
-
import '../../common/propsValues/profileType.mjs';
|
|
16
|
-
import '../../common/propsValues/variant.mjs';
|
|
17
|
-
import '../../common/propsValues/scroll.mjs';
|
|
18
|
-
import '../../common/propsValues/markdownNodeType.mjs';
|
|
19
|
-
import '../../common/fileType.mjs';
|
|
20
|
-
import '@transferwise/icons';
|
|
21
|
-
import 'clsx';
|
|
22
|
-
import 'react';
|
|
23
|
-
import 'react-intl';
|
|
24
|
-
import '../../common/closeButton/CloseButton.messages.mjs';
|
|
25
|
-
import 'react/jsx-runtime';
|
|
26
|
-
|
|
27
|
-
const typeClassMap = {
|
|
28
|
-
[ControlType.ACCENT]: 'btn-accent',
|
|
29
|
-
[ControlType.POSITIVE]: 'btn-positive',
|
|
30
|
-
[ControlType.NEGATIVE]: 'btn-negative'
|
|
31
|
-
};
|
|
32
|
-
const priorityClassMap = {
|
|
33
|
-
[Priority.PRIMARY]: 'btn-priority-1',
|
|
34
|
-
[Priority.SECONDARY]: 'btn-priority-2',
|
|
35
|
-
[Priority.TERTIARY]: 'btn-priority-3'
|
|
36
|
-
};
|
|
37
|
-
|
|
38
|
-
export { priorityClassMap, typeClassMap };
|
|
39
|
-
//# sourceMappingURL=classMap.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"classMap.mjs","sources":["../../../src/button/LegacyButton/classMap.ts"],"sourcesContent":["import { ControlType, Priority } from '../../common';\n\nexport const typeClassMap = {\n [ControlType.ACCENT]: 'btn-accent',\n [ControlType.POSITIVE]: 'btn-positive',\n [ControlType.NEGATIVE]: 'btn-negative',\n};\n\nexport const priorityClassMap = {\n [Priority.PRIMARY]: 'btn-priority-1',\n [Priority.SECONDARY]: 'btn-priority-2',\n [Priority.TERTIARY]: 'btn-priority-3',\n};\n"],"names":["typeClassMap","ControlType","ACCENT","POSITIVE","NEGATIVE","priorityClassMap","Priority","PRIMARY","SECONDARY","TERTIARY"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAEO,MAAMA,YAAY,GAAG;AAC1B,EAAA,CAACC,WAAW,CAACC,MAAM,GAAG,YAAY;AAClC,EAAA,CAACD,WAAW,CAACE,QAAQ,GAAG,cAAc;EACtC,CAACF,WAAW,CAACG,QAAQ,GAAG,cAAA;EACzB;AAEM,MAAMC,gBAAgB,GAAG;AAC9B,EAAA,CAACC,QAAQ,CAACC,OAAO,GAAG,gBAAgB;AACpC,EAAA,CAACD,QAAQ,CAACE,SAAS,GAAG,gBAAgB;EACtC,CAACF,QAAQ,CAACG,QAAQ,GAAG,gBAAA;;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"legacyUtils.js","sources":["../../../../src/button/LegacyButton/legacyUtils/legacyUtils.ts"],"sourcesContent":["import { ControlType, Priority, Size, Type } from '../../../common';\nimport { logActionRequired, logActionRequiredIf } from '../../../utilities';\n\nconst deprecatedTypeMap: Record<Type, ControlType> = {\n [Type.PRIMARY]: ControlType.ACCENT,\n [Type.SECONDARY]: ControlType.ACCENT,\n [Type.LINK]: ControlType.ACCENT,\n [Type.PAY]: ControlType.POSITIVE,\n [Type.DANGER]: ControlType.NEGATIVE,\n};\n\ntype OldTypeKeys = Type.DANGER | Type.LINK | Type.SECONDARY;\nconst oldTypePriorityMap: Record<OldTypeKeys, Priority> = {\n [Type.DANGER]: Priority.SECONDARY,\n [Type.LINK]: Priority.TERTIARY,\n [Type.SECONDARY]: Priority.SECONDARY,\n};\n\nconst deprecatedTypeMapMessage = {\n [Type.DANGER]: 'Type.NEGATIVE',\n [Type.LINK]: 'ControlType.ACCENT with priority Priority.TERTIARY',\n [Type.PAY]: 'ControlType.POSITIVE',\n [Type.PRIMARY]: 'ControlType.ACCENT',\n [Type.SECONDARY]: 'ControlType.ACCENT with priority Priority.SECONDARY',\n};\n\nconst deprecatedTypes = Object.keys(deprecatedTypeMap);\n\ntype EstablishNewTypeType = (\n originalType: Type | (string & Record<never, never>) | null,\n) => `${ControlType}` | string | null;\n\nexport const establishNewType: EstablishNewTypeType = (originalType) =>\n originalType && originalType in deprecatedTypeMap\n ? deprecatedTypeMap[originalType as Type]\n : originalType;\n\ntype EstablishNewPriorityType = (\n originalPriority?: Priority | (string & Record<never, never>) | null,\n originalType?: OldTypeKeys | (string & Record<never, never>) | null,\n) => `${ControlType}` | string | null | undefined;\n\nexport const establishNewPriority: EstablishNewPriorityType = (originalPriority, originalType) => {\n const type = originalType ? establishNewType(originalType) : '';\n\n // The old SECONDARY and LINK types now map to priorities. If they're still using one of\n // these old types, ignore whatever priority they've passed and use this instead.\n if (originalType && originalType in oldTypePriorityMap) {\n return oldTypePriorityMap[originalType as OldTypeKeys];\n }\n // Only ControlType.ACCENT supports tertiary styles\n if (originalPriority === Priority.TERTIARY && type !== ControlType.ACCENT) {\n return Priority.SECONDARY;\n }\n return originalPriority;\n};\n\ntype DeprecatedTypeMapMessageType = keyof typeof deprecatedTypeMapMessage;\ntype LogDeprecationNoticesType = (params: {\n size?: `${Size}`;\n type?: DeprecatedTypeMapMessageType | (string & Record<never, never>) | null;\n}) => void;\nexport const logDeprecationNotices: LogDeprecationNoticesType = ({ size, type }) => {\n logActionRequiredIf(\n 'Button has deprecated the `Size.EXTRA_SMALL` value for the `size` prop. Please use Size.SMALL instead.',\n size === Size.EXTRA_SMALL,\n );\n\n if (type && deprecatedTypes.includes(type) && type in deprecatedTypeMapMessage) {\n logActionRequired(\n `Button has deprecated the ${type} value for the \\`type\\` prop. Please update to ${deprecatedTypeMapMessage[type as DeprecatedTypeMapMessageType]}.`,\n );\n }\n};\n"],"names":["deprecatedTypeMap","Type","PRIMARY","ControlType","ACCENT","SECONDARY","LINK","PAY","POSITIVE","DANGER","NEGATIVE","oldTypePriorityMap","Priority","TERTIARY","deprecatedTypeMapMessage","deprecatedTypes","Object","keys","establishNewType","originalType","establishNewPriority","originalPriority","type","logDeprecationNotices","size","logActionRequiredIf","Size","EXTRA_SMALL","includes","logActionRequired"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,MAAMA,iBAAiB,GAA8B;AACnD,EAAA,CAACC,SAAI,CAACC,OAAO,GAAGC,mBAAW,CAACC,MAAM;AAClC,EAAA,CAACH,SAAI,CAACI,SAAS,GAAGF,mBAAW,CAACC,MAAM;AACpC,EAAA,CAACH,SAAI,CAACK,IAAI,GAAGH,mBAAW,CAACC,MAAM;AAC/B,EAAA,CAACH,SAAI,CAACM,GAAG,GAAGJ,mBAAW,CAACK,QAAQ;AAChC,EAAA,CAACP,SAAI,CAACQ,MAAM,GAAGN,mBAAW,CAACO,QAAAA;CAC5B,CAAA;AAGD,MAAMC,kBAAkB,GAAkC;AACxD,EAAA,CAACV,SAAI,CAACQ,MAAM,GAAGG,gBAAQ,CAACP,SAAS;AACjC,EAAA,CAACJ,SAAI,CAACK,IAAI,GAAGM,gBAAQ,CAACC,QAAQ;AAC9B,EAAA,CAACZ,SAAI,CAACI,SAAS,GAAGO,gBAAQ,CAACP,SAAAA;CAC5B,CAAA;AAED,MAAMS,wBAAwB,GAAG;AAC/B,EAAA,CAACb,SAAI,CAACQ,MAAM,GAAG,eAAe;AAC9B,EAAA,CAACR,SAAI,CAACK,IAAI,GAAG,oDAAoD;AACjE,EAAA,CAACL,SAAI,CAACM,GAAG,GAAG,sBAAsB;AAClC,EAAA,CAACN,SAAI,CAACC,OAAO,GAAG,oBAAoB;EACpC,CAACD,SAAI,CAACI,SAAS,GAAG,qDAAA;CACnB,CAAA;AAED,MAAMU,eAAe,GAAGC,MAAM,CAACC,IAAI,CAACjB,iBAAiB,CAAC,CAAA;MAMzCkB,gBAAgB,GAA0BC,YAAY,IACjEA,YAAY,IAAIA,YAAY,IAAInB,iBAAiB,GAC7CA,iBAAiB,CAACmB,YAAoB,CAAC,GACvCA,aAAY;MAOLC,oBAAoB,GAA6BA,CAACC,gBAAgB,EAAEF,YAAY,KAAI;EAC/F,MAAMG,IAAI,GAAGH,YAAY,GAAGD,gBAAgB,CAACC,YAAY,CAAC,GAAG,EAAE,CAAA;AAE/D;AACA;AACA,EAAA,IAAIA,YAAY,IAAIA,YAAY,IAAIR,kBAAkB,EAAE;IACtD,OAAOA,kBAAkB,CAACQ,YAA2B,CAAC,CAAA;AACxD,GAAA;AACA;EACA,IAAIE,gBAAgB,KAAKT,gBAAQ,CAACC,QAAQ,IAAIS,IAAI,KAAKnB,mBAAW,CAACC,MAAM,EAAE;IACzE,OAAOQ,gBAAQ,CAACP,SAAS,CAAA;AAC3B,GAAA;AACA,EAAA,OAAOgB,gBAAgB,CAAA;AACzB,EAAC;AAOM,MAAME,qBAAqB,GAA8BA,CAAC;QAAEC,MAAI;AAAEF,EAAAA,IAAAA;AAAM,CAAA,KAAI;EACjFG,qCAAmB,CACjB,wGAAwG,EACxGD,MAAI,KAAKE,SAAI,CAACC,WAAW,CAC1B,CAAA;AAED,EAAA,IAAIL,IAAI,IAAIP,eAAe,CAACa,QAAQ,CAACN,IAAI,CAAC,IAAIA,IAAI,IAAIR,wBAAwB,EAAE;IAC9Ee,mCAAiB,CACf,6BAA6BP,IAAI,CAAA,+CAAA,EAAkDR,wBAAwB,CAACQ,IAAoC,CAAC,CAAA,CAAA,CAAG,CACrJ,CAAA;AACH,GAAA;AACF;;;;;;"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"legacyUtils.mjs","sources":["../../../../src/button/LegacyButton/legacyUtils/legacyUtils.ts"],"sourcesContent":["import { ControlType, Priority, Size, Type } from '../../../common';\nimport { logActionRequired, logActionRequiredIf } from '../../../utilities';\n\nconst deprecatedTypeMap: Record<Type, ControlType> = {\n [Type.PRIMARY]: ControlType.ACCENT,\n [Type.SECONDARY]: ControlType.ACCENT,\n [Type.LINK]: ControlType.ACCENT,\n [Type.PAY]: ControlType.POSITIVE,\n [Type.DANGER]: ControlType.NEGATIVE,\n};\n\ntype OldTypeKeys = Type.DANGER | Type.LINK | Type.SECONDARY;\nconst oldTypePriorityMap: Record<OldTypeKeys, Priority> = {\n [Type.DANGER]: Priority.SECONDARY,\n [Type.LINK]: Priority.TERTIARY,\n [Type.SECONDARY]: Priority.SECONDARY,\n};\n\nconst deprecatedTypeMapMessage = {\n [Type.DANGER]: 'Type.NEGATIVE',\n [Type.LINK]: 'ControlType.ACCENT with priority Priority.TERTIARY',\n [Type.PAY]: 'ControlType.POSITIVE',\n [Type.PRIMARY]: 'ControlType.ACCENT',\n [Type.SECONDARY]: 'ControlType.ACCENT with priority Priority.SECONDARY',\n};\n\nconst deprecatedTypes = Object.keys(deprecatedTypeMap);\n\ntype EstablishNewTypeType = (\n originalType: Type | (string & Record<never, never>) | null,\n) => `${ControlType}` | string | null;\n\nexport const establishNewType: EstablishNewTypeType = (originalType) =>\n originalType && originalType in deprecatedTypeMap\n ? deprecatedTypeMap[originalType as Type]\n : originalType;\n\ntype EstablishNewPriorityType = (\n originalPriority?: Priority | (string & Record<never, never>) | null,\n originalType?: OldTypeKeys | (string & Record<never, never>) | null,\n) => `${ControlType}` | string | null | undefined;\n\nexport const establishNewPriority: EstablishNewPriorityType = (originalPriority, originalType) => {\n const type = originalType ? establishNewType(originalType) : '';\n\n // The old SECONDARY and LINK types now map to priorities. If they're still using one of\n // these old types, ignore whatever priority they've passed and use this instead.\n if (originalType && originalType in oldTypePriorityMap) {\n return oldTypePriorityMap[originalType as OldTypeKeys];\n }\n // Only ControlType.ACCENT supports tertiary styles\n if (originalPriority === Priority.TERTIARY && type !== ControlType.ACCENT) {\n return Priority.SECONDARY;\n }\n return originalPriority;\n};\n\ntype DeprecatedTypeMapMessageType = keyof typeof deprecatedTypeMapMessage;\ntype LogDeprecationNoticesType = (params: {\n size?: `${Size}`;\n type?: DeprecatedTypeMapMessageType | (string & Record<never, never>) | null;\n}) => void;\nexport const logDeprecationNotices: LogDeprecationNoticesType = ({ size, type }) => {\n logActionRequiredIf(\n 'Button has deprecated the `Size.EXTRA_SMALL` value for the `size` prop. Please use Size.SMALL instead.',\n size === Size.EXTRA_SMALL,\n );\n\n if (type && deprecatedTypes.includes(type) && type in deprecatedTypeMapMessage) {\n logActionRequired(\n `Button has deprecated the ${type} value for the \\`type\\` prop. Please update to ${deprecatedTypeMapMessage[type as DeprecatedTypeMapMessageType]}.`,\n );\n }\n};\n"],"names":["deprecatedTypeMap","Type","PRIMARY","ControlType","ACCENT","SECONDARY","LINK","PAY","POSITIVE","DANGER","NEGATIVE","oldTypePriorityMap","Priority","TERTIARY","deprecatedTypeMapMessage","deprecatedTypes","Object","keys","establishNewType","originalType","establishNewPriority","originalPriority","type","logDeprecationNotices","size","logActionRequiredIf","Size","EXTRA_SMALL","includes","logActionRequired"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,MAAMA,iBAAiB,GAA8B;AACnD,EAAA,CAACC,IAAI,CAACC,OAAO,GAAGC,WAAW,CAACC,MAAM;AAClC,EAAA,CAACH,IAAI,CAACI,SAAS,GAAGF,WAAW,CAACC,MAAM;AACpC,EAAA,CAACH,IAAI,CAACK,IAAI,GAAGH,WAAW,CAACC,MAAM;AAC/B,EAAA,CAACH,IAAI,CAACM,GAAG,GAAGJ,WAAW,CAACK,QAAQ;AAChC,EAAA,CAACP,IAAI,CAACQ,MAAM,GAAGN,WAAW,CAACO,QAAAA;CAC5B,CAAA;AAGD,MAAMC,kBAAkB,GAAkC;AACxD,EAAA,CAACV,IAAI,CAACQ,MAAM,GAAGG,QAAQ,CAACP,SAAS;AACjC,EAAA,CAACJ,IAAI,CAACK,IAAI,GAAGM,QAAQ,CAACC,QAAQ;AAC9B,EAAA,CAACZ,IAAI,CAACI,SAAS,GAAGO,QAAQ,CAACP,SAAAA;CAC5B,CAAA;AAED,MAAMS,wBAAwB,GAAG;AAC/B,EAAA,CAACb,IAAI,CAACQ,MAAM,GAAG,eAAe;AAC9B,EAAA,CAACR,IAAI,CAACK,IAAI,GAAG,oDAAoD;AACjE,EAAA,CAACL,IAAI,CAACM,GAAG,GAAG,sBAAsB;AAClC,EAAA,CAACN,IAAI,CAACC,OAAO,GAAG,oBAAoB;EACpC,CAACD,IAAI,CAACI,SAAS,GAAG,qDAAA;CACnB,CAAA;AAED,MAAMU,eAAe,GAAGC,MAAM,CAACC,IAAI,CAACjB,iBAAiB,CAAC,CAAA;MAMzCkB,gBAAgB,GAA0BC,YAAY,IACjEA,YAAY,IAAIA,YAAY,IAAInB,iBAAiB,GAC7CA,iBAAiB,CAACmB,YAAoB,CAAC,GACvCA,aAAY;MAOLC,oBAAoB,GAA6BA,CAACC,gBAAgB,EAAEF,YAAY,KAAI;EAC/F,MAAMG,IAAI,GAAGH,YAAY,GAAGD,gBAAgB,CAACC,YAAY,CAAC,GAAG,EAAE,CAAA;AAE/D;AACA;AACA,EAAA,IAAIA,YAAY,IAAIA,YAAY,IAAIR,kBAAkB,EAAE;IACtD,OAAOA,kBAAkB,CAACQ,YAA2B,CAAC,CAAA;AACxD,GAAA;AACA;EACA,IAAIE,gBAAgB,KAAKT,QAAQ,CAACC,QAAQ,IAAIS,IAAI,KAAKnB,WAAW,CAACC,MAAM,EAAE;IACzE,OAAOQ,QAAQ,CAACP,SAAS,CAAA;AAC3B,GAAA;AACA,EAAA,OAAOgB,gBAAgB,CAAA;AACzB,EAAC;AAOM,MAAME,qBAAqB,GAA8BA,CAAC;EAAEC,IAAI;AAAEF,EAAAA,IAAAA;AAAM,CAAA,KAAI;EACjFG,mBAAmB,CACjB,wGAAwG,EACxGD,IAAI,KAAKE,IAAI,CAACC,WAAW,CAC1B,CAAA;AAED,EAAA,IAAIL,IAAI,IAAIP,eAAe,CAACa,QAAQ,CAACN,IAAI,CAAC,IAAIA,IAAI,IAAIR,wBAAwB,EAAE;IAC9Ee,iBAAiB,CACf,6BAA6BP,IAAI,CAAA,+CAAA,EAAkDR,wBAAwB,CAACQ,IAAoC,CAAC,CAAA,CAAA,CAAG,CACrJ,CAAA;AACH,GAAA;AACF;;;;"}
|
|
@@ -1,66 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var React = require('react');
|
|
4
|
-
var Button$2 = require('../LegacyButton/Button.js');
|
|
5
|
-
var Button$1 = require('../Button/src/Button.js');
|
|
6
|
-
var jsxRuntime = require('react/jsx-runtime');
|
|
7
|
-
|
|
8
|
-
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
|
|
9
|
-
const mapProps = props => {
|
|
10
|
-
const {
|
|
11
|
-
priority,
|
|
12
|
-
size,
|
|
13
|
-
type,
|
|
14
|
-
as,
|
|
15
|
-
...newProps
|
|
16
|
-
} = props;
|
|
17
|
-
const priorityMapping = {
|
|
18
|
-
accent: {
|
|
19
|
-
primary: 'primary',
|
|
20
|
-
secondary: 'tertiary',
|
|
21
|
-
tertiary: 'minimal'
|
|
22
|
-
},
|
|
23
|
-
positive: {
|
|
24
|
-
primary: 'primary',
|
|
25
|
-
secondary: 'tertiary',
|
|
26
|
-
tertiary: 'tertiary'
|
|
27
|
-
},
|
|
28
|
-
negative: {
|
|
29
|
-
primary: 'primary',
|
|
30
|
-
secondary: 'secondary',
|
|
31
|
-
tertiary: 'secondary'
|
|
32
|
-
}
|
|
33
|
-
};
|
|
34
|
-
const mappedPriority = type && priority ? priorityMapping[type]?.[priority] || priority : priority || null;
|
|
35
|
-
const mappedAppearance = type === 'negative' ? 'negative' : null;
|
|
36
|
-
const legacyButtonTypes = ['accent', 'negative', 'positive', 'primary', 'pay', 'secondary', 'danger', 'link'];
|
|
37
|
-
return {
|
|
38
|
-
...newProps,
|
|
39
|
-
size: size === 'xs' || size === 'sm' ? 'sm' : size === 'md' ? 'md' : size === 'lg' ? 'lg' : size,
|
|
40
|
-
priority: mappedPriority,
|
|
41
|
-
appearance: mappedAppearance || ('appearance' in props ? props.appearance : null),
|
|
42
|
-
type: as === 'button' && !legacyButtonTypes.includes(type) ? props.htmlType : null,
|
|
43
|
-
href: as === 'a' ? props.href || '' : null
|
|
44
|
-
};
|
|
45
|
-
};
|
|
46
|
-
const Button = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
47
|
-
const {
|
|
48
|
-
useNewButton,
|
|
49
|
-
...rest
|
|
50
|
-
} = props;
|
|
51
|
-
if (useNewButton) {
|
|
52
|
-
const mappedProps = mapProps(props);
|
|
53
|
-
return /*#__PURE__*/jsxRuntime.jsx(Button$1, {
|
|
54
|
-
...mappedProps,
|
|
55
|
-
ref: ref
|
|
56
|
-
});
|
|
57
|
-
}
|
|
58
|
-
return /*#__PURE__*/jsxRuntime.jsx(Button$2, {
|
|
59
|
-
...rest,
|
|
60
|
-
ref: ref
|
|
61
|
-
});
|
|
62
|
-
});
|
|
63
|
-
Button.displayName = 'Button';
|
|
64
|
-
|
|
65
|
-
module.exports = Button;
|
|
66
|
-
//# sourceMappingURL=Button.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../../src/button/src/Button.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { forwardRef } from 'react';\nimport LegacyButton, { ButtonProps as LegacyButtonProps } from '../LegacyButton';\nimport NewButton from '../Button';\nimport { ButtonProps as NewButtonProps } from '../Button/src/Button.types';\n\ntype LegacyButtonType =\n | 'accent'\n | 'negative'\n | 'positive'\n | 'primary'\n | 'pay'\n | 'secondary'\n | 'danger'\n | 'link'\n | null\n | undefined;\ntype NewButtonType = 'button' | 'submit' | 'reset' | LegacyButtonType | undefined;\n\nexport type ButtonProps =\n | (LegacyButtonProps & { type?: LegacyButtonType; useNewButton?: false })\n | (Omit<NewButtonProps, 'type'> & { type?: NewButtonType; useNewButton: true });\n\nconst mapProps = (props: LegacyButtonProps): NewButtonProps => {\n const { priority, size, type, as, ...newProps } = props;\n\n const priorityMapping: Record<string, Record<string, NewButtonProps['priority']>> = {\n accent: {\n primary: 'primary',\n secondary: 'tertiary',\n tertiary: 'minimal',\n },\n positive: {\n primary: 'primary',\n secondary: 'tertiary',\n tertiary: 'tertiary',\n },\n negative: {\n primary: 'primary',\n secondary: 'secondary',\n tertiary: 'secondary',\n },\n };\n\n const mappedPriority =\n type && priority ? priorityMapping[type]?.[priority] || priority : priority || null;\n const mappedAppearance = type === 'negative' ? 'negative' : null;\n\n const legacyButtonTypes: LegacyButtonType[] = [\n 'accent',\n 'negative',\n 'positive',\n 'primary',\n 'pay',\n 'secondary',\n 'danger',\n 'link',\n ];\n\n return {\n ...newProps,\n size:\n size === 'xs' || size === 'sm' ? 'sm' : size === 'md' ? 'md' : size === 'lg' ? 'lg' : size,\n priority: mappedPriority,\n appearance: mappedAppearance || ('appearance' in props ? props.appearance : null),\n type:\n as === 'button' && !legacyButtonTypes.includes(type as LegacyButtonType)\n ? props.htmlType\n : null,\n href: as === 'a' ? props.href || '' : null,\n } as NewButtonProps;\n};\n\nconst Button = forwardRef<any, ButtonProps>((props, ref) => {\n const { useNewButton, ...rest } = props;\n\n if (useNewButton) {\n const mappedProps = mapProps(props as LegacyButtonProps);\n return <NewButton {...mappedProps} ref={ref as any} />;\n }\n\n return <LegacyButton {...(rest as LegacyButtonProps)} ref={ref as any} />;\n});\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["mapProps","props","priority","size","type","as","newProps","priorityMapping","accent","primary","secondary","tertiary","positive","negative","mappedPriority","mappedAppearance","legacyButtonTypes","appearance","includes","htmlType","href","Button","forwardRef","ref","useNewButton","rest","mappedProps","_jsx","NewButton","LegacyButton","displayName"],"mappings":";;;;;;;AAAA;AAuBA,MAAMA,QAAQ,GAAIC,KAAwB,IAAoB;EAC5D,MAAM;IAAEC,QAAQ;IAAEC,IAAI;IAAEC,IAAI;IAAEC,EAAE;IAAE,GAAGC,QAAAA;AAAU,GAAA,GAAGL,KAAK,CAAA;AAEvD,EAAA,MAAMM,eAAe,GAA+D;AAClFC,IAAAA,MAAM,EAAE;AACNC,MAAAA,OAAO,EAAE,SAAS;AAClBC,MAAAA,SAAS,EAAE,UAAU;AACrBC,MAAAA,QAAQ,EAAE,SAAA;KACX;AACDC,IAAAA,QAAQ,EAAE;AACRH,MAAAA,OAAO,EAAE,SAAS;AAClBC,MAAAA,SAAS,EAAE,UAAU;AACrBC,MAAAA,QAAQ,EAAE,UAAA;KACX;AACDE,IAAAA,QAAQ,EAAE;AACRJ,MAAAA,OAAO,EAAE,SAAS;AAClBC,MAAAA,SAAS,EAAE,WAAW;AACtBC,MAAAA,QAAQ,EAAE,WAAA;AACX,KAAA;GACF,CAAA;AAED,EAAA,MAAMG,cAAc,GAClBV,IAAI,IAAIF,QAAQ,GAAGK,eAAe,CAACH,IAAI,CAAC,GAAGF,QAAQ,CAAC,IAAIA,QAAQ,GAAGA,QAAQ,IAAI,IAAI,CAAA;EACrF,MAAMa,gBAAgB,GAAGX,IAAI,KAAK,UAAU,GAAG,UAAU,GAAG,IAAI,CAAA;AAEhE,EAAA,MAAMY,iBAAiB,GAAuB,CAC5C,QAAQ,EACR,UAAU,EACV,UAAU,EACV,SAAS,EACT,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,CACP,CAAA;EAED,OAAO;AACL,IAAA,GAAGV,QAAQ;IACXH,IAAI,EACFA,IAAI,KAAK,IAAI,IAAIA,IAAI,KAAK,IAAI,GAAG,IAAI,GAAGA,IAAI,KAAK,IAAI,GAAG,IAAI,GAAGA,IAAI,KAAK,IAAI,GAAG,IAAI,GAAGA,IAAI;AAC5FD,IAAAA,QAAQ,EAAEY,cAAc;AACxBG,IAAAA,UAAU,EAAEF,gBAAgB,KAAK,YAAY,IAAId,KAAK,GAAGA,KAAK,CAACgB,UAAU,GAAG,IAAI,CAAC;AACjFb,IAAAA,IAAI,EACFC,EAAE,KAAK,QAAQ,IAAI,CAACW,iBAAiB,CAACE,QAAQ,CAACd,IAAwB,CAAC,GACpEH,KAAK,CAACkB,QAAQ,GACd,IAAI;IACVC,IAAI,EAAEf,EAAE,KAAK,GAAG,GAAGJ,KAAK,CAACmB,IAAI,IAAI,EAAE,GAAG,IAAA;GACrB,CAAA;AACrB,CAAC,CAAA;AAEKC,MAAAA,MAAM,gBAAGC,gBAAU,CAAmB,CAACrB,KAAK,EAAEsB,GAAG,KAAI;EACzD,MAAM;IAAEC,YAAY;IAAE,GAAGC,IAAAA;AAAM,GAAA,GAAGxB,KAAK,CAAA;AAEvC,EAAA,IAAIuB,YAAY,EAAE;AAChB,IAAA,MAAME,WAAW,GAAG1B,QAAQ,CAACC,KAA0B,CAAC,CAAA;IACxD,oBAAO0B,cAAA,CAACC,QAAS,EAAA;AAAA,MAAA,GAAKF,WAAW;AAAEH,MAAAA,GAAG,EAAEA,GAAAA;AAAW,MAAG,CAAA;AACxD,GAAA;EAEA,oBAAOI,cAAA,CAACE,QAAY,EAAA;AAAA,IAAA,GAAMJ,IAA0B;AAAEF,IAAAA,GAAG,EAAEA,GAAAA;AAAW,IAAG,CAAA;AAC3E,CAAC,EAAC;AAEFF,MAAM,CAACS,WAAW,GAAG,QAAQ;;;;"}
|
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
import { forwardRef } from 'react';
|
|
2
|
-
import Button$2 from '../LegacyButton/Button.mjs';
|
|
3
|
-
import Button$1 from '../Button/src/Button.mjs';
|
|
4
|
-
import { jsx } from 'react/jsx-runtime';
|
|
5
|
-
|
|
6
|
-
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
|
|
7
|
-
const mapProps = props => {
|
|
8
|
-
const {
|
|
9
|
-
priority,
|
|
10
|
-
size,
|
|
11
|
-
type,
|
|
12
|
-
as,
|
|
13
|
-
...newProps
|
|
14
|
-
} = props;
|
|
15
|
-
const priorityMapping = {
|
|
16
|
-
accent: {
|
|
17
|
-
primary: 'primary',
|
|
18
|
-
secondary: 'tertiary',
|
|
19
|
-
tertiary: 'minimal'
|
|
20
|
-
},
|
|
21
|
-
positive: {
|
|
22
|
-
primary: 'primary',
|
|
23
|
-
secondary: 'tertiary',
|
|
24
|
-
tertiary: 'tertiary'
|
|
25
|
-
},
|
|
26
|
-
negative: {
|
|
27
|
-
primary: 'primary',
|
|
28
|
-
secondary: 'secondary',
|
|
29
|
-
tertiary: 'secondary'
|
|
30
|
-
}
|
|
31
|
-
};
|
|
32
|
-
const mappedPriority = type && priority ? priorityMapping[type]?.[priority] || priority : priority || null;
|
|
33
|
-
const mappedAppearance = type === 'negative' ? 'negative' : null;
|
|
34
|
-
const legacyButtonTypes = ['accent', 'negative', 'positive', 'primary', 'pay', 'secondary', 'danger', 'link'];
|
|
35
|
-
return {
|
|
36
|
-
...newProps,
|
|
37
|
-
size: size === 'xs' || size === 'sm' ? 'sm' : size === 'md' ? 'md' : size === 'lg' ? 'lg' : size,
|
|
38
|
-
priority: mappedPriority,
|
|
39
|
-
appearance: mappedAppearance || ('appearance' in props ? props.appearance : null),
|
|
40
|
-
type: as === 'button' && !legacyButtonTypes.includes(type) ? props.htmlType : null,
|
|
41
|
-
href: as === 'a' ? props.href || '' : null
|
|
42
|
-
};
|
|
43
|
-
};
|
|
44
|
-
const Button = /*#__PURE__*/forwardRef((props, ref) => {
|
|
45
|
-
const {
|
|
46
|
-
useNewButton,
|
|
47
|
-
...rest
|
|
48
|
-
} = props;
|
|
49
|
-
if (useNewButton) {
|
|
50
|
-
const mappedProps = mapProps(props);
|
|
51
|
-
return /*#__PURE__*/jsx(Button$1, {
|
|
52
|
-
...mappedProps,
|
|
53
|
-
ref: ref
|
|
54
|
-
});
|
|
55
|
-
}
|
|
56
|
-
return /*#__PURE__*/jsx(Button$2, {
|
|
57
|
-
...rest,
|
|
58
|
-
ref: ref
|
|
59
|
-
});
|
|
60
|
-
});
|
|
61
|
-
Button.displayName = 'Button';
|
|
62
|
-
|
|
63
|
-
export { Button as default };
|
|
64
|
-
//# sourceMappingURL=Button.mjs.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Button.mjs","sources":["../../../src/button/src/Button.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-assignment */\nimport { forwardRef } from 'react';\nimport LegacyButton, { ButtonProps as LegacyButtonProps } from '../LegacyButton';\nimport NewButton from '../Button';\nimport { ButtonProps as NewButtonProps } from '../Button/src/Button.types';\n\ntype LegacyButtonType =\n | 'accent'\n | 'negative'\n | 'positive'\n | 'primary'\n | 'pay'\n | 'secondary'\n | 'danger'\n | 'link'\n | null\n | undefined;\ntype NewButtonType = 'button' | 'submit' | 'reset' | LegacyButtonType | undefined;\n\nexport type ButtonProps =\n | (LegacyButtonProps & { type?: LegacyButtonType; useNewButton?: false })\n | (Omit<NewButtonProps, 'type'> & { type?: NewButtonType; useNewButton: true });\n\nconst mapProps = (props: LegacyButtonProps): NewButtonProps => {\n const { priority, size, type, as, ...newProps } = props;\n\n const priorityMapping: Record<string, Record<string, NewButtonProps['priority']>> = {\n accent: {\n primary: 'primary',\n secondary: 'tertiary',\n tertiary: 'minimal',\n },\n positive: {\n primary: 'primary',\n secondary: 'tertiary',\n tertiary: 'tertiary',\n },\n negative: {\n primary: 'primary',\n secondary: 'secondary',\n tertiary: 'secondary',\n },\n };\n\n const mappedPriority =\n type && priority ? priorityMapping[type]?.[priority] || priority : priority || null;\n const mappedAppearance = type === 'negative' ? 'negative' : null;\n\n const legacyButtonTypes: LegacyButtonType[] = [\n 'accent',\n 'negative',\n 'positive',\n 'primary',\n 'pay',\n 'secondary',\n 'danger',\n 'link',\n ];\n\n return {\n ...newProps,\n size:\n size === 'xs' || size === 'sm' ? 'sm' : size === 'md' ? 'md' : size === 'lg' ? 'lg' : size,\n priority: mappedPriority,\n appearance: mappedAppearance || ('appearance' in props ? props.appearance : null),\n type:\n as === 'button' && !legacyButtonTypes.includes(type as LegacyButtonType)\n ? props.htmlType\n : null,\n href: as === 'a' ? props.href || '' : null,\n } as NewButtonProps;\n};\n\nconst Button = forwardRef<any, ButtonProps>((props, ref) => {\n const { useNewButton, ...rest } = props;\n\n if (useNewButton) {\n const mappedProps = mapProps(props as LegacyButtonProps);\n return <NewButton {...mappedProps} ref={ref as any} />;\n }\n\n return <LegacyButton {...(rest as LegacyButtonProps)} ref={ref as any} />;\n});\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["mapProps","props","priority","size","type","as","newProps","priorityMapping","accent","primary","secondary","tertiary","positive","negative","mappedPriority","mappedAppearance","legacyButtonTypes","appearance","includes","htmlType","href","Button","forwardRef","ref","useNewButton","rest","mappedProps","_jsx","NewButton","LegacyButton","displayName"],"mappings":";;;;;AAAA;AAuBA,MAAMA,QAAQ,GAAIC,KAAwB,IAAoB;EAC5D,MAAM;IAAEC,QAAQ;IAAEC,IAAI;IAAEC,IAAI;IAAEC,EAAE;IAAE,GAAGC,QAAAA;AAAU,GAAA,GAAGL,KAAK,CAAA;AAEvD,EAAA,MAAMM,eAAe,GAA+D;AAClFC,IAAAA,MAAM,EAAE;AACNC,MAAAA,OAAO,EAAE,SAAS;AAClBC,MAAAA,SAAS,EAAE,UAAU;AACrBC,MAAAA,QAAQ,EAAE,SAAA;KACX;AACDC,IAAAA,QAAQ,EAAE;AACRH,MAAAA,OAAO,EAAE,SAAS;AAClBC,MAAAA,SAAS,EAAE,UAAU;AACrBC,MAAAA,QAAQ,EAAE,UAAA;KACX;AACDE,IAAAA,QAAQ,EAAE;AACRJ,MAAAA,OAAO,EAAE,SAAS;AAClBC,MAAAA,SAAS,EAAE,WAAW;AACtBC,MAAAA,QAAQ,EAAE,WAAA;AACX,KAAA;GACF,CAAA;AAED,EAAA,MAAMG,cAAc,GAClBV,IAAI,IAAIF,QAAQ,GAAGK,eAAe,CAACH,IAAI,CAAC,GAAGF,QAAQ,CAAC,IAAIA,QAAQ,GAAGA,QAAQ,IAAI,IAAI,CAAA;EACrF,MAAMa,gBAAgB,GAAGX,IAAI,KAAK,UAAU,GAAG,UAAU,GAAG,IAAI,CAAA;AAEhE,EAAA,MAAMY,iBAAiB,GAAuB,CAC5C,QAAQ,EACR,UAAU,EACV,UAAU,EACV,SAAS,EACT,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,CACP,CAAA;EAED,OAAO;AACL,IAAA,GAAGV,QAAQ;IACXH,IAAI,EACFA,IAAI,KAAK,IAAI,IAAIA,IAAI,KAAK,IAAI,GAAG,IAAI,GAAGA,IAAI,KAAK,IAAI,GAAG,IAAI,GAAGA,IAAI,KAAK,IAAI,GAAG,IAAI,GAAGA,IAAI;AAC5FD,IAAAA,QAAQ,EAAEY,cAAc;AACxBG,IAAAA,UAAU,EAAEF,gBAAgB,KAAK,YAAY,IAAId,KAAK,GAAGA,KAAK,CAACgB,UAAU,GAAG,IAAI,CAAC;AACjFb,IAAAA,IAAI,EACFC,EAAE,KAAK,QAAQ,IAAI,CAACW,iBAAiB,CAACE,QAAQ,CAACd,IAAwB,CAAC,GACpEH,KAAK,CAACkB,QAAQ,GACd,IAAI;IACVC,IAAI,EAAEf,EAAE,KAAK,GAAG,GAAGJ,KAAK,CAACmB,IAAI,IAAI,EAAE,GAAG,IAAA;GACrB,CAAA;AACrB,CAAC,CAAA;AAEKC,MAAAA,MAAM,gBAAGC,UAAU,CAAmB,CAACrB,KAAK,EAAEsB,GAAG,KAAI;EACzD,MAAM;IAAEC,YAAY;IAAE,GAAGC,IAAAA;AAAM,GAAA,GAAGxB,KAAK,CAAA;AAEvC,EAAA,IAAIuB,YAAY,EAAE;AAChB,IAAA,MAAME,WAAW,GAAG1B,QAAQ,CAACC,KAA0B,CAAC,CAAA;IACxD,oBAAO0B,GAAA,CAACC,QAAS,EAAA;AAAA,MAAA,GAAKF,WAAW;AAAEH,MAAAA,GAAG,EAAEA,GAAAA;AAAW,MAAG,CAAA;AACxD,GAAA;EAEA,oBAAOI,GAAA,CAACE,QAAY,EAAA;AAAA,IAAA,GAAMJ,IAA0B;AAAEF,IAAAA,GAAG,EAAEA,GAAAA;AAAW,IAAG,CAAA;AAC3E,CAAC,EAAC;AAEFF,MAAM,CAACS,WAAW,GAAG,QAAQ;;;;"}
|
|
@@ -1,253 +0,0 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
--Button-background: var(--color-interactive-accent);
|
|
3
|
-
--Button-background-hover: var(--color-interactive-accent-hover);
|
|
4
|
-
--Button-background-active: var(--color-interactive-accent-active);
|
|
5
|
-
--Button-color: var(--color-interactive-control);
|
|
6
|
-
--Button-padding: var(--size-8) var(--size-12);
|
|
7
|
-
--Button-border-radius: var(--radius-full);
|
|
8
|
-
--Button-font-size: var(--font-size-16);
|
|
9
|
-
--Button-line-height: var(--size-24);
|
|
10
|
-
--Button-font-weight: var(--font-weight-semi-bold);
|
|
11
|
-
--Button-letter-spacing: -0.011em;
|
|
12
|
-
--Button-size-small-padding: 5px var(--size-12);
|
|
13
|
-
--Button-size-medium-padding: var(--size-8) var(--size-12);
|
|
14
|
-
--Button-size-large-padding: var(--size-12) var(--size-16);
|
|
15
|
-
--Button-avatar-border-color: var(--color-border-neutral);
|
|
16
|
-
--Button-secondary-background: var(--color-interactive-neutral);
|
|
17
|
-
--Button-secondary-background-hover: var(--color-interactive-neutral-hover);
|
|
18
|
-
--Button-secondary-background-active: var(--color-interactive-neutral-active);
|
|
19
|
-
--Button-secondary-color: var(--color-interactive-primary);
|
|
20
|
-
--Button-tertiary-background: var(--color-background-neutral);
|
|
21
|
-
--Button-tertiary-background-hover: var(--color-background-neutral-hover);
|
|
22
|
-
--Button-tertiary-background-active: var(--color-background-neutral-active);
|
|
23
|
-
--Button-tertiary-color: var(--color-content-primary);
|
|
24
|
-
--Button-minimal-background: transparent;
|
|
25
|
-
--Button-minimal-background-hover: var(--color-background-screen-hover);
|
|
26
|
-
--Button-minimal-background-active: var(--color-background-screen-active);
|
|
27
|
-
--Button-minimal-color: var(--color-interactive-primary);
|
|
28
|
-
--Button-primary-negative-background: var(--color-sentiment-negative-primary);
|
|
29
|
-
--Button-primary-negative-background-hover: var(--color-sentiment-negative-primary-hover);
|
|
30
|
-
--Button-primary-negative-background-active: var(--color-sentiment-negative-primary-active);
|
|
31
|
-
--Button-primary-negative-color: var(--color-contrast);
|
|
32
|
-
--Button-primary-netative-avatar-border-color: rgba(255,255,255,0.2);
|
|
33
|
-
--Button-secondary-negative-background: var(--color-sentiment-negative-secondary);
|
|
34
|
-
--Button-secondary-negative-background-hover: var(--color-sentiment-negative-secondary-hover);
|
|
35
|
-
--Button-secondary-negative-background-active: var(--color-sentiment-negative-secondary-active);
|
|
36
|
-
--Button-secondary-negative-color: var(--color-sentiment-negative-primary);
|
|
37
|
-
--Button-secondary-netative-avatar-border-color: rgba(168,32,13,0.12157);
|
|
38
|
-
}
|
|
39
|
-
.np-theme-personal--dark {
|
|
40
|
-
--Button-primary-netative-avatar-border-color: rgba(14,15,12,0.12157);
|
|
41
|
-
}
|
|
42
|
-
.np-theme-personal--forest-green {
|
|
43
|
-
--color-interactive-neutral: rgba(159,232,112,0.2);
|
|
44
|
-
--color-interactive-neutral-hover: rgba(205,255,173,0.2);
|
|
45
|
-
--color-interactive-neutral-active: rgba(236,255,224,0.2);
|
|
46
|
-
--color-sentiment-negative-secondary: rgba(255,196,194,0.2);
|
|
47
|
-
--color-sentiment-negative-secondary-hover: rgba(255,220,219,0.2);
|
|
48
|
-
--color-sentiment-negative-secondary-active: rgba(255,235,235,0.2);
|
|
49
|
-
--Button-primary-netative-avatar-border-color: rgba(14,15,12,0.12157);
|
|
50
|
-
--Button-secondary-netative-avatar-border-color: rgba(14,15,12,0.12157);
|
|
51
|
-
}
|
|
52
|
-
.np-theme-personal--bright-green {
|
|
53
|
-
--color-contrast: #FFFFFF;
|
|
54
|
-
--Button-secondary-color: var(--color-interactive-control);
|
|
55
|
-
--Button-secondary-negative-color: var(--color-contrast);
|
|
56
|
-
--Button-secondary-netative-avatar-border-color: var(--Button-primary-netative-avatar-border-color);
|
|
57
|
-
}
|
|
58
|
-
/* Button Styles */
|
|
59
|
-
.wds-Button {
|
|
60
|
-
display: inline-flex;
|
|
61
|
-
flex: none;
|
|
62
|
-
width: auto;
|
|
63
|
-
align-items: center;
|
|
64
|
-
justify-content: center;
|
|
65
|
-
vertical-align: middle;
|
|
66
|
-
font-weight: 600;
|
|
67
|
-
font-weight: var(--Button-font-weight);
|
|
68
|
-
font-size: 1rem;
|
|
69
|
-
font-size: var(--Button-font-size);
|
|
70
|
-
letter-spacing: -0.011em;
|
|
71
|
-
letter-spacing: var(--Button-letter-spacing);
|
|
72
|
-
line-height: 24px;
|
|
73
|
-
line-height: var(--Button-line-height);
|
|
74
|
-
text-align: center;
|
|
75
|
-
-webkit-text-decoration: none;
|
|
76
|
-
text-decoration: none;
|
|
77
|
-
white-space: nowrap;
|
|
78
|
-
word-wrap: break-word;
|
|
79
|
-
-webkit-appearance: none;
|
|
80
|
-
-moz-appearance: none;
|
|
81
|
-
appearance: none;
|
|
82
|
-
background-color: #00a2dd;
|
|
83
|
-
background-color: var(--Button-background);
|
|
84
|
-
border: none;
|
|
85
|
-
border-radius: 9999px;
|
|
86
|
-
border-radius: var(--Button-border-radius);
|
|
87
|
-
color: var(--Button-color);
|
|
88
|
-
cursor: pointer;
|
|
89
|
-
padding: 8px 12px;
|
|
90
|
-
padding: var(--Button-padding);
|
|
91
|
-
}
|
|
92
|
-
.wds-Button:focus {
|
|
93
|
-
-webkit-text-decoration: none;
|
|
94
|
-
text-decoration: none;
|
|
95
|
-
}
|
|
96
|
-
.wds-Button:hover {
|
|
97
|
-
background-color: #008fc9;
|
|
98
|
-
background-color: var(--Button-background-hover);
|
|
99
|
-
-webkit-text-decoration: none;
|
|
100
|
-
text-decoration: none;
|
|
101
|
-
}
|
|
102
|
-
.wds-Button:active {
|
|
103
|
-
background-color: #0081ba;
|
|
104
|
-
background-color: var(--Button-background-active);
|
|
105
|
-
-webkit-text-decoration: none;
|
|
106
|
-
text-decoration: none;
|
|
107
|
-
}
|
|
108
|
-
.wds-Button:disabled {
|
|
109
|
-
mix-blend-mode: luminosity;
|
|
110
|
-
opacity: 0.45;
|
|
111
|
-
cursor: not-allowed;
|
|
112
|
-
}
|
|
113
|
-
.wds-Button:disabled:hover,
|
|
114
|
-
.wds-Button:disabled:active {
|
|
115
|
-
background-color: #00a2dd;
|
|
116
|
-
background-color: var(--Button-background);
|
|
117
|
-
}
|
|
118
|
-
.wds-Button--secondary {
|
|
119
|
-
--Button-background: var(--Button-secondary-background);
|
|
120
|
-
--Button-background-hover: var(--Button-secondary-hover-background);
|
|
121
|
-
--Button-background-active: var(--Button-secondary-active-background);
|
|
122
|
-
--Button-color: var(--Button-secondary-color);
|
|
123
|
-
}
|
|
124
|
-
.wds-Button--tertiary {
|
|
125
|
-
--Button-background: var(--Button-tertiary-background);
|
|
126
|
-
--Button-background-hover: var(--Button-tertiary-hover-background);
|
|
127
|
-
--Button-background-active: var(--Button-tertiary-active-background);
|
|
128
|
-
--Button-color: var(--Button-tertiary-color);
|
|
129
|
-
}
|
|
130
|
-
.wds-Button--tertiary .wds-Button-icon--right {
|
|
131
|
-
color: var(--color-interactive-primary);
|
|
132
|
-
}
|
|
133
|
-
.wds-Button--minimal {
|
|
134
|
-
--Button-background: var(--Button-minimal-background);
|
|
135
|
-
--Button-background-hover: var(--Button-minimal-hover-background);
|
|
136
|
-
--Button-background-active: var(--Button-minimal-active-background);
|
|
137
|
-
--Button-color: var(--Button-minimal-color);
|
|
138
|
-
-webkit-text-decoration: underline;
|
|
139
|
-
text-decoration: underline;
|
|
140
|
-
}
|
|
141
|
-
.wds-Button--minimal:hover,
|
|
142
|
-
.wds-Button--minimal:hover:active {
|
|
143
|
-
-webkit-text-decoration: underline;
|
|
144
|
-
text-decoration: underline;
|
|
145
|
-
}
|
|
146
|
-
.wds-Button--negative.wds-Button--primary {
|
|
147
|
-
--Button-background: var(--Button-primary-negative-background);
|
|
148
|
-
--Button-background-hover: var(--Button-primary-negative-hover-background);
|
|
149
|
-
--Button-background-active: var(--Button-primary-negative-active-background);
|
|
150
|
-
--Button-color: var(--Button-primary-negative-color);
|
|
151
|
-
--Button-avatar-border-color: var(--Button-primary-netative-avatar-border-color);
|
|
152
|
-
}
|
|
153
|
-
.wds-Button--negative.wds-Button--secondary {
|
|
154
|
-
--Button-background: var(--Button-secondary-negative-background);
|
|
155
|
-
--Button-background-hover: var(--Button-secondary-negative-hover-background);
|
|
156
|
-
--Button-background-active: var(--Button-secondary-negative-active-background);
|
|
157
|
-
--Button-color: var(--Button-secondary-negative-color);
|
|
158
|
-
--Button-avatar-border-color: var(--Button-secondary-netative-avatar-border-color);
|
|
159
|
-
}
|
|
160
|
-
.wds-Button--small {
|
|
161
|
-
--Button-padding: var(--Button-size-small-padding);
|
|
162
|
-
--Button-line-height: 22px;
|
|
163
|
-
--Button-font-size: var(--font-size-14);
|
|
164
|
-
--Button-letter-spacing: -0.006em;
|
|
165
|
-
}
|
|
166
|
-
.wds-Button--small .wds-Button-icon--left {
|
|
167
|
-
margin-right: 4px;
|
|
168
|
-
margin-right: var(--size-4);
|
|
169
|
-
}
|
|
170
|
-
[dir="rtl"] .wds-Button--small .wds-Button-icon--left {
|
|
171
|
-
margin-right: 0;
|
|
172
|
-
margin-left: 4px;
|
|
173
|
-
margin-left: var(--size-4);
|
|
174
|
-
}
|
|
175
|
-
.wds-Button--medium {
|
|
176
|
-
--Button-padding: var(--Button-size-medium-padding);
|
|
177
|
-
}
|
|
178
|
-
.wds-Button--large {
|
|
179
|
-
--Button-padding: var(--Button-size-large-padding);
|
|
180
|
-
}
|
|
181
|
-
.wds-Button--block {
|
|
182
|
-
width: 100%;
|
|
183
|
-
}
|
|
184
|
-
.wds-Button-avatars {
|
|
185
|
-
display: inline-flex;
|
|
186
|
-
margin-right: 5px;
|
|
187
|
-
margin-left: calc(4px * -1);
|
|
188
|
-
margin-left: calc(var(--size-4) * -1);
|
|
189
|
-
}
|
|
190
|
-
[dir="rtl"] .wds-Button-avatars {
|
|
191
|
-
margin-right: 0;
|
|
192
|
-
margin-left: 5px;
|
|
193
|
-
}
|
|
194
|
-
.wds-Button-avatars .np-circle {
|
|
195
|
-
--circle-border-color: var(--Button-avatar-border-color);
|
|
196
|
-
}
|
|
197
|
-
.wds-Button-avatars .np-avatar-view .np-avatar-view-content {
|
|
198
|
-
color: var(--Button-color);
|
|
199
|
-
}
|
|
200
|
-
.wds-Button-icon {
|
|
201
|
-
display: inline-block;
|
|
202
|
-
}
|
|
203
|
-
.wds-Button-icon--left {
|
|
204
|
-
margin-right: 8px;
|
|
205
|
-
margin-right: var(--size-8);
|
|
206
|
-
}
|
|
207
|
-
[dir="rtl"] .wds-Button-icon--left {
|
|
208
|
-
margin-right: 0;
|
|
209
|
-
margin-left: 8px;
|
|
210
|
-
margin-left: var(--size-8);
|
|
211
|
-
}
|
|
212
|
-
.wds-Button-icon--right {
|
|
213
|
-
margin-left: 4px;
|
|
214
|
-
margin-left: var(--size-4);
|
|
215
|
-
}
|
|
216
|
-
[dir="rtl"] .wds-Button-icon--right {
|
|
217
|
-
margin-left: 0;
|
|
218
|
-
margin-right: 4px;
|
|
219
|
-
margin-right: var(--size-4);
|
|
220
|
-
}
|
|
221
|
-
.wds-Button-content {
|
|
222
|
-
position: relative;
|
|
223
|
-
}
|
|
224
|
-
.wds-Button-content--loading .wds-Button-label,
|
|
225
|
-
.wds-Button-content--loading .wds-Button-media,
|
|
226
|
-
.wds-Button-content--loading .wds-Button-icon {
|
|
227
|
-
visibility: hidden;
|
|
228
|
-
opacity: 0;
|
|
229
|
-
}
|
|
230
|
-
.wds-Button-label {
|
|
231
|
-
display: flex;
|
|
232
|
-
justify-content: center;
|
|
233
|
-
align-items: center;
|
|
234
|
-
position: relative;
|
|
235
|
-
}
|
|
236
|
-
.wds-Button-loader {
|
|
237
|
-
position: absolute;
|
|
238
|
-
display: flex;
|
|
239
|
-
justify-content: center;
|
|
240
|
-
align-items: center;
|
|
241
|
-
width: 100%;
|
|
242
|
-
height: 100%;
|
|
243
|
-
}
|
|
244
|
-
.wds-Button-loader .process-circle {
|
|
245
|
-
stroke: var(--Button-color);
|
|
246
|
-
}
|
|
247
|
-
/* RTL Styles */
|
|
248
|
-
[dir="rtl"] .wds-Button .tw-icon-chevron-right,[dir="rtl"] .wds-Button .tw-icon-arrow-right {
|
|
249
|
-
transform: rotate(180deg);
|
|
250
|
-
}
|
|
251
|
-
[dir="rtl"] .wds-Button .tw-icon-chevron-left,[dir="rtl"] .wds-Button .tw-icon-arrow-left {
|
|
252
|
-
transform: rotate(180deg);
|
|
253
|
-
}
|