@transferwise/components 0.0.0-experimental-db4013c → 0.0.0-experimental-bd6f8cc

package/src/main.css

@@ -518,18 +518,10 @@ div.critical-comms .critical-comms-body {
   -webkit-mask-image: radial-gradient(circle at bottom calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)) right calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)), transparent 0, transparent calc(var(--np-avatar-size) / 2 + 2px), black 0);
           mask-image: radial-gradient(circle at bottom calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)) right calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)), transparent 0, transparent calc(var(--np-avatar-size) / 2 + 2px), black 0);
 }
-[dir="rtl"] .np-avatar-layout-diagonal-mask {
-  -webkit-mask-image: radial-gradient(circle at bottom calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)) left calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)), transparent 0, transparent calc(var(--np-avatar-size) / 2 + 2px), black 0);
-          mask-image: radial-gradient(circle at bottom calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)) left calc(100% - var(--np-avatar-size) - var(--np-avatar-offset)), transparent 0, transparent calc(var(--np-avatar-size) / 2 + 2px), black 0);
-}
 .np-avatar-layout-diagonal-child {
   margin-left: calc(var(--np-avatar-layout-size) - var(--np-avatar-size) * 2);
   margin-top: calc(var(--np-avatar-layout-size) - var(--np-avatar-size));
 }
-[dir="rtl"] .np-avatar-layout-diagonal-child {
-  margin-left: 0;
-  margin-right: calc(var(--np-avatar-layout-size) - var(--np-avatar-size) * 2);
-}
 .np-avatar-layout-horizontal {
   width: calc(var(--np-avatar-size) * var(--np-avatar-avatars-count) - (var(--np-avatar-offset) * (var(--np-avatar-avatars-count) - 1)));
   width: calc(var(--np-avatar-size) * var(--np-avatar-avatars-count) - calc(var(--np-avatar-offset) * calc(var(--np-avatar-avatars-count) - 1)));
@@ -544,9 +536,6 @@ div.critical-comms .critical-comms-body {
 .np-avatar-layout-horizontal-child {
   margin-left: calc(var(--np-avatar-offset) * -1);
 }
-[dir="rtl"] .np-avatar-layout-horizontal-child {
-  margin-right: calc(var(--np-avatar-offset) * -1);
-}
 .np-icon-button {
   border: none;
 }
@@ -717,221 +706,6 @@ div.critical-comms .critical-comms-body {
 .np-btn.disabled[class] {
   pointer-events: auto;
 }
-.wds-Button {
-  --Button-background: var(--color-interactive-accent);
-  --Button-background-hover: var(--color-interactive-accent-hover);
-  --Button-background-active: var(--color-interactive-accent-active);
-  --Button-color: var(--color-interactive-control);
-  --Button-border-radius: var(--radius-full);
-  --Button-label-gap: var(--size-4);
-  --Button-large-padding: var(--size-12) var(--size-16);
-  --Button-medium-padding: var(--size-8) var(--size-12);
-  --Button-small-padding: calc(var(--size-10) * 0.5) var(--size-12);
-  --Button-avatar-border-color: var(--color-border-neutral);
-  --Button-transition-duration: 150ms;
-  --Button-transition-easing: ease-in-out;
-  --Button-secondary-background: var(--color-interactive-neutral);
-  --Button-secondary-background-hover: var(--color-interactive-neutral-hover);
-  --Button-secondary-background-active: var(--color-interactive-neutral-active);
-  --Button-secondary-color: var(--color-interactive-primary);
-  --Button-tertiary-background: var(--color-background-neutral);
-  --Button-tertiary-background-hover: var(--color-background-neutral-hover);
-  --Button-tertiary-background-active: var(--color-background-neutral-active);
-  --Button-tertiary-color: var(--color-content-primary);
-  --Button-minimal-background: transparent;
-  --Button-minimal-background-hover: var(--color-background-screen-hover);
-  --Button-minimal-background-active: var(--color-background-screen-active);
-  --Button-minimal-color: var(--color-interactive-primary);
-  --Button-primary-negative-background: var(--color-sentiment-negative-primary);
-  --Button-primary-negative-background-hover: var(--color-sentiment-negative-primary-hover);
-  --Button-primary-negative-background-active: var(--color-sentiment-negative-primary-active);
-  --Button-primary-negative-color: var(--color-contrast-overlay);
-  --Button-secondary-negative-background: var(--color-sentiment-negative-secondary);
-  --Button-secondary-negative-background-hover: var(--color-sentiment-negative-secondary-hover);
-  --Button-secondary-negative-background-active: var(--color-sentiment-negative-secondary-active);
-  --Button-secondary-negative-color: var(--color-sentiment-negative-primary);
-}
-.np-theme-personal--bright-green .wds-Button {
-  --Button-primary-negative-color: var(--color-white);
-  --Button-secondary-color: var(--color-interactive-control);
-  --Button-secondary-negative-color: var(--color-white);
-}
-.np-theme-personal--forest-green .wds-Button {
-  --Button-secondary-background: var(--color-interactive-neutral);
-  --Button-secondary-negative-background: var(--color-sentiment-negative-primary);
-  --Button-secondary-negative-background-hover: var(--color-sentiment-negative-primary-hover);
-  --Button-secondary-negative-background-active: var(--color-sentiment-negative-primary-active);
-  --Button-secondary-negative-color: var(--color-contrast-overlay);
-}
-/* Button Styles */
-.wds-Button {
-  display: inline-flex;
-  flex: none;
-  width: auto;
-  align-items: center;
-  justify-content: center;
-  vertical-align: middle;
-  text-align: center;
-  -webkit-text-decoration: none;
-  text-decoration: none;
-  white-space: nowrap;
-  word-wrap: break-word;
-  -webkit-appearance: none;
-     -moz-appearance: none;
-          appearance: none;
-  background-color: var(--Button-background);
-  border: none;
-  border-radius: var(--Button-border-radius);
-  color: var(--Button-color);
-  cursor: pointer;
-  transition: color, background-color var(--Button-transition-duration) var(--Button-transition-easing);
-}
-.wds-Button:hover {
-  background-color: var(--Button-background-hover);
-}
-.wds-Button:active {
-  background-color: var(--Button-background-active);
-}
-.wds-Button.wds-Button--disabled,
-.wds-Button:disabled {
-  filter: none;
-  mix-blend-mode: luminosity;
-  opacity: 0.45;
-  cursor: not-allowed;
-}
-.wds-Button.wds-Button--disabled,
-.wds-Button:disabled,
-.wds-Button.wds-Button--disabled:hover,
-.wds-Button:disabled:hover,
-.wds-Button.wds-Button--disabled:active,
-.wds-Button:disabled:active {
-  background-color: var(--Button-background);
-}
-.wds-Button--secondary {
-  --Button-background: var(--Button-secondary-background);
-  --Button-background-hover: var(--Button-secondary-background-hover);
-  --Button-background-active: var(--Button-secondary-background-active);
-  --Button-color: var(--Button-secondary-color);
-}
-.wds-Button--tertiary {
-  --Button-background: var(--Button-tertiary-background);
-  --Button-background-hover: var(--Button-tertiary-background-hover);
-  --Button-background-active: var(--Button-tertiary-background-active);
-  --Button-color: var(--Button-tertiary-color);
-}
-.wds-Button--tertiary .wds-Button-icon--end {
-  color: var(--color-interactive-primary);
-}
-.wds-Button--minimal {
-  --Button-background: var(--Button-minimal-background);
-  --Button-background-hover: var(--Button-minimal-background-hover);
-  --Button-background-active: var(--Button-minimal-background-active);
-  --Button-color: var(--Button-minimal-color);
-  -webkit-text-decoration: underline;
-  text-decoration: underline;
-  text-underline-offset: 3px;
-  text-decoration-thickness: 1px;
-}
-.wds-Button--negative.wds-Button--primary {
-  --Button-background: var(--Button-primary-negative-background);
-  --Button-background-hover: var(--Button-primary-negative-background-hover);
-  --Button-background-active: var(--Button-primary-negative-background-active);
-  --Button-color: var(--Button-primary-negative-color);
-}
-.wds-Button--negative.wds-Button--secondary {
-  --Button-background: var(--Button-secondary-negative-background);
-  --Button-background-hover: var(--Button-secondary-negative-background-hover);
-  --Button-background-active: var(--Button-secondary-negative-background-active);
-  --Button-color: var(--Button-secondary-negative-color);
-}
-.wds-Button--large {
-  padding: var(--Button-large-padding);
-}
-.wds-Button--medium {
-  padding: var(--Button-medium-padding);
-}
-.wds-Button--medium:has(.wds-Button-avatars) {
-  padding-inline-start: 8px;
-  padding-inline-start: var(--size-8);
-}
-.wds-Button--medium:has(.wds-Button-icon--end) {
-  padding-inline-end: 8px;
-  padding-inline-end: var(--size-8);
-}
-.wds-Button--medium .wds-Button-icon--start {
-  margin-inline-end: var(--Button-label-gap);
-}
-.wds-Button--small {
-  padding: var(--Button-small-padding);
-}
-.wds-Button--small:has(.wds-Button-icon--start) {
-  padding-inline-start: 8px;
-  padding-inline-start: var(--size-8);
-}
-.wds-Button--small:has(.wds-Button-icon--end) {
-  padding-inline-end: 8px;
-  padding-inline-end: var(--size-8);
-}
-.wds-Button--block {
-  width: 100%;
-}
-.wds-Button-avatars {
-  display: inline-flex;
-}
-.wds-Button-avatars .np-avatar-view .np-avatar-view-content {
-  color: var(--Button-color);
-}
-.wds-Button-icon {
-  display: inline-block;
-}
-.wds-Button-content {
-  position: relative;
-}
-.wds-Button-content--loading .wds-Button-label,
-.wds-Button-content--loading .wds-Button-media,
-.wds-Button-content--loading .wds-Button-icon {
-  visibility: hidden;
-  opacity: 0;
-}
-.wds-Button-label {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  gap: var(--Button-label-gap);
-  position: relative;
-}
-.wds-Button-loader {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-}
-.wds-Button-loader .process-circle {
-  stroke: var(--Button-color);
-}
-/* Avatar border transparency */
-/* dark buttons get 20% transparency, light buttons get 12% */
-.wds-Button-avatars .np-circle {
-  --circle-border-color: color-mix(in srgb, var(--Button-color) 20%, transparent);
-}
-.np-theme-personal:not(.np-theme-personal--dark):not(.np-theme-personal--forest-green):not(.np-theme-personal--bright-green) .wds-Button--secondary.wds-Button--negative .wds-Button-avatars .np-circle,
-.np-theme-personal:not(.np-theme-personal--dark):not(.np-theme-personal--forest-green):not(.np-theme-personal--bright-green) .wds-Button--secondary .wds-Button-avatars .np-circle,
-.np-theme-personal:not(.np-theme-personal--dark):not(.np-theme-personal--forest-green):not(.np-theme-personal--bright-green) .wds-Button--tertiary .wds-Button-avatars .np-circle,
-.np-theme-personal:not(.np-theme-personal--dark):not(.np-theme-personal--forest-green):not(.np-theme-personal--bright-green) .wds-Button--minimal .wds-Button-avatars .np-circle {
-  --circle-border-color: color-mix(in srgb, var(--Button-color) 12%, transparent);
-}
-.np-theme-personal--dark .wds-Button--primary .wds-Button-avatars .np-circle,
-.np-theme-personal--dark .wds-Button--primary.wds-Button--negative .wds-Button-avatars .np-circle,
-.np-theme-personal--forest-green .wds-Button--primary .wds-Button-avatars .np-circle,
-.np-theme-personal--forest-green .wds-Button--primary.wds-Button--negative .wds-Button-avatars .np-circle {
-  --circle-border-color: color-mix(in srgb, var(--Button-color) 12%, transparent);
-}
-.np-theme-personal--bright-green .wds-Button--tertiary .wds-Button-avatars .np-circle,
-.np-theme-personal--bright-green .wds-Button--minimal .wds-Button-avatars .np-circle {
-  --circle-border-color: color-mix(in srgb, var(--Button-color) 12%, transparent);
-}
-[dir="rtl"] .wds-Button .tw-icon-chevron-right,[dir="rtl"] .wds-Button .tw-icon-arrow-right,[dir="rtl"] .wds-Button .tw-icon-chevron-left,[dir="rtl"] .wds-Button .tw-icon-arrow-left,[dir="rtl"] .wds-Button .tw-icon-arrow-diagonal-down,[dir="rtl"] .wds-Button .tw-icon-arrow-diagonal-up,[dir="rtl"] .wds-Button .tw-icon-list,[dir="rtl"] .wds-Button .tw-icon-activity {
-  scale: -1 1;
-}
 .np-card {
   overflow: hidden;
   transition-property: transform, box-shadow;
@@ -3915,6 +3689,17 @@ html:not([dir="rtl"]) .np-navigation-option {
   margin-left: 0;
   margin-right: 1px;
 }
+.wds-nudge-media-flower {
+  margin-left: -24px;
+  margin-top: 11px;
+  position: absolute;
+  width: 156px;
+}
+[dir="rtl"] .wds-nudge-media-flower {
+  transform: scaleX(-1);
+  margin-left: 0;
+  margin-right: -24px;
+}
 .wds-nudge-container {
   align-items: stretch;
   display: flex;

package/src/main.less

@@ -7,7 +7,6 @@
 @import "./avatarLayout/AvatarLayout.less";
 @import "./iconButton/IconButton.less";
 @import "./badge/Badge.less";
-@import "./button/LegacyButton.less";
 @import "./button/Button.less";
 @import "./card/Card.less";
 @import "./carousel/Carousel.less";

package/src/nudge/Nudge.css

@@ -136,6 +136,17 @@
   margin-left: 0;
   margin-right: 1px;
 }
+.wds-nudge-media-flower {
+  margin-left: -24px;
+  margin-top: 11px;
+  position: absolute;
+  width: 156px;
+}
+[dir="rtl"] .wds-nudge-media-flower {
+  transform: scaleX(-1);
+  margin-left: 0;
+  margin-right: -24px;
+}
 .wds-nudge-container {
   align-items: stretch;
   display: flex;

package/src/nudge/Nudge.less

@@ -65,6 +65,9 @@
     &-shopping-bag {
       .media-position(116px, 1px, 14px);
     }
+    &-flower {
+      .media-position(156px, -24px, 11px);
+    }
   }
 
   &-container {

package/src/nudge/Nudge.story.tsx

@@ -104,6 +104,16 @@ export const Default = () => {
         onClick={action('action clicked')}
         onDismiss={action('dismissed')}
       />
+
+      <Nudge
+        mediaName={Assets.FLOWER}
+        className="m-b-2"
+        title="Text that is no longer than two lines."
+        link="Link"
+        href="#"
+        onClick={action('action clicked')}
+        onDismiss={action('dismissed')}
+      />
     </div>
   );
 };

package/src/nudge/Nudge.tsx

@@ -38,7 +38,8 @@ type MediaNameType =
   | `${Assets.BUSINESS_CARD}`
   | `${Assets.HEART}`
   | `${Assets.MULTI_CURRENCY}`
-  | `${Assets.SHOPPING_BAG}`;
+  | `${Assets.SHOPPING_BAG}`
+  | `${Assets.FLOWER}`;
 
 type BaseProps = {
   /** @deprecated use `mediaName` property instead */

package/src/primitives/PrimitiveAnchor/src/PrimitiveAnchor.tsx

@@ -30,7 +30,13 @@ const PrimitiveAnchor = forwardRef<HTMLAnchorElement, PrimitiveAnchorProps>(
     },
     ref,
   ) => {
-    const anchorClasses = clsx(className);
+    const anchorClasses = clsx(
+      'wds-Anchor',
+      {
+        'wds-Anchor--disabled': disabled,
+      },
+      className,
+    );
 
     const handleClick = useCallback(
       (event: React.MouseEvent<HTMLAnchorElement>) => {
@@ -90,7 +96,7 @@ const PrimitiveAnchor = forwardRef<HTMLAnchorElement, PrimitiveAnchorProps>(
      * https://www.scottohara.me/blog/2021/05/28/disabled-links.html
      */
     const anchorProps = {
-      'aria-disabled': disabled || undefined,
+      'aria-disabled': disabled,
       className: anchorClasses,
       'data-testid': testId,
       href: disabled ? undefined : href,

package/src/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.ts

@@ -13,21 +13,16 @@ export type PrimitiveAnchorElementRef = React.Ref<HTMLAnchorElement>;
 export interface PrimitiveAnchorProps
   extends BasePrimitiveProps,
     StyleProp,
-    Omit<PrimitiveAnchorAttributes, 'role' | 'type'> {
+    Omit<PrimitiveAnchorAttributes, 'role'> {
   /** Content of the anchor */
   children?: ReactNode;
 
   /** The URL to navigate to when the anchor is clicked */
-  href?: string | undefined;
+  href: string;
 
   /** Disable the anchor */
   disabled?: boolean;
 
   /** Reference to the anchor element */
   ref?: PrimitiveAnchorElementRef;
-
-  /**
-   * HTML anchor `target` attribute. If set to `_blank`, `rel="noopener noreferrer"` is automatically added to the rendered node.
-   */
-  target?: HTMLAnchorElement['target'];
 }

package/src/primitives/PrimitiveAnchor/test/PrimitiveAnchor.spec.tsx

@@ -1,5 +1,5 @@
 import { render, screen } from '@testing-library/react';
-import PrimitiveAnchor from '../src';
+import PrimitiveAnchor from '..';
 
 describe('PrimitiveAnchor', () => {
   const defaultProps = {
@@ -27,6 +27,7 @@ describe('PrimitiveAnchor', () => {
     renderAnchor(props);
 
     const link = screen.getByRole('link');
+    expect(link).toHaveClass('wds-Anchor');
     expect(link).toHaveClass('custom-class');
   });
 
@@ -40,6 +41,7 @@ describe('PrimitiveAnchor', () => {
 
     const link = screen.getByRole('link');
     expect(link).toHaveAttribute('aria-disabled', 'true');
+    expect(link).toHaveClass('wds-Anchor--disabled');
     expect(link).not.toHaveAttribute('href', 'https://example.com');
   });
 

package/src/primitives/PrimitiveButton/src/PrimitiveButton.tsx

@@ -35,7 +35,14 @@ const PrimitiveButton = forwardRef<HTMLButtonElement, PrimitiveButtonProps>(
     ref,
   ) => {
     const intl = useIntl();
-    const classNames = clsx(className);
+    const classNames = clsx(
+      'wds-Button',
+      {
+        'wds-Button--disabled': disabled,
+        'wds-Button--loading': loading,
+      },
+      className,
+    );
 
     const handleClick = useCallback(
       (event: React.MouseEvent<HTMLButtonElement>) => {
@@ -95,9 +102,10 @@ const PrimitiveButton = forwardRef<HTMLButtonElement, PrimitiveButtonProps>(
      *   by assistive technologies, set to 'polite' during loading.
      */
     const buttonProps = {
-      'aria-disabled': loading || undefined,
-      'aria-busy': loading || undefined,
-      'aria-label': loading ? intl.formatMessage(messages.loadingAriaLabel) : props['aria-label'],
+      'aria-disabled': disabled || loading,
+      'aria-label': loading
+        ? intl.formatMessage(messages.loadingAriaLabel as MessageDescriptor)
+        : props['aria-label'],
       'aria-live': (loading ? 'polite' : 'off') as 'polite' | 'off' | 'assertive' | undefined,
       className: classNames,
       'data-testid': testId,

package/src/primitives/PrimitiveButton/test/PrimitiveButton.spec.tsx

@@ -1,7 +1,8 @@
-import { screen } from '@testing-library/react';
+import { fireEvent, screen } from '@testing-library/react';
+import { userEvent } from '@testing-library/user-event';
+import PrimitiveButton from '..';
+import messages from '../../../i18n/commonMessages/Button.messages';
 import { render } from '../../../test-utils';
-import PrimitiveButton from '../src';
-import allMessages from '../../../i18n';
 
 describe('Button', () => {
   const defaultProps = {
@@ -11,7 +12,7 @@ describe('Button', () => {
   const renderButton = (
     props?: Partial<typeof defaultProps>,
     locale = 'en',
-    localeMessages = allMessages.en,
+    localeMessages = messages,
   ) => {
     return render(
       <PrimitiveButton {...defaultProps} {...props} />,
@@ -35,6 +36,7 @@ describe('Button', () => {
     renderButton(props);
 
     const button = screen.getByRole('button');
+    expect(button).toHaveClass('wds-Button');
     expect(button).toHaveClass('custom-class');
   });
 
@@ -47,20 +49,10 @@ describe('Button', () => {
     renderButton(props);
 
     const button = screen.getByRole('button');
+    expect(button).toHaveClass('wds-Button--disabled');
     expect(button).toBeDisabled();
   });
 
-  it('disables and announces the button as busy in loading mode', () => {
-    const props = {
-      ...defaultProps,
-      loading: true,
-    };
-
-    renderButton(props);
-
-    expect(screen.getByRole('button', { busy: true })).toHaveAttribute('aria-disabled', 'true');
-  });
-
   it('sets data-testid attribute', () => {
     const props = {
       ...defaultProps,
@@ -109,7 +101,12 @@ describe('Button', () => {
       loading: true,
     };
 
-    renderButton(props, 'es', allMessages.es);
+    const spanishMessages = {
+      ...messages,
+      'neptune.Button.loadingAriaLabel': 'cargando',
+    };
+
+    renderButton(props, 'es', spanishMessages);
 
     const button = screen.getByRole('button');
     expect(button).toHaveAttribute('aria-label', 'cargando');

package/src/test-utils/Parameters.d.ts

@@ -1,15 +1,7 @@
 declare module '@storybook/react' {
   interface Parameters {
     /** Prefer using `storyConfig` for configuring variants */
-    variants?: (
-      | 'default'
-      | 'light'
-      | 'dark'
-      | 'bright-green'
-      | 'forest-green'
-      | 'rtl'
-      | (string & Record<string, unknown>)
-    )[];
+    variants?: ('default' | 'light' | 'dark' | 'rtl' | (string & Record<string, unknown>))[];
     /** Used by Chromatic */
     chromatic?: ChromaticParameters;
     viewport?: {

package/src/test-utils/story-config.ts

@@ -30,16 +30,7 @@ interface StoryConfig {
    *
    * @default undefined
    */
-  variants?: (
-    | 'default'
-    | 'light'
-    | 'dark'
-    | 'bright-green'
-    | 'forest-green'
-    | 'rtl'
-    | 'mobile'
-    | '400%'
-  )[];
+  variants?: ('default' | 'light' | 'dark' | 'rtl' | 'mobile' | '400%')[];
 }
 
 const getViewportWidth = (viewport: (typeof viewports)[keyof typeof viewports]) => {

package/build/button/Button.resolver.js

@@ -1,74 +0,0 @@
-'use strict';
-
-var React = require('react');
-var LegacyButton = require('./LegacyButton.js');
-var Button$1 = require('./Button.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-const mapProps = props => {
-  const {
-    priority,
-    size,
-    type,
-    ...newProps
-  } = props;
-  const priorityMapping = {
-    accent: {
-      primary: 'primary',
-      secondary: 'tertiary',
-      tertiary: 'minimal'
-    },
-    positive: {
-      primary: 'primary',
-      secondary: 'tertiary',
-      tertiary: 'tertiary'
-    },
-    negative: {
-      primary: 'primary',
-      secondary: 'secondary',
-      tertiary: 'secondary'
-    }
-  };
-  const mappedPriority = type && priority ? priorityMapping[type]?.[priority] || priority : priority || undefined;
-  const mappedSentiment = type === 'negative' ? 'negative' : undefined;
-  const legacyButtonTypes = ['accent', 'negative', 'positive', 'primary', 'pay', 'secondary', 'danger', 'link'];
-  const resolveSize = () => {
-    if (size) {
-      return {
-        xs: 'sm',
-        sm: 'sm',
-        md: 'md',
-        lg: 'lg'
-      }[size] || size;
-    }
-    return size;
-  };
-  return {
-    ...newProps,
-    size: resolveSize(),
-    priority: mappedPriority,
-    sentiment: mappedSentiment || ('sentiment' in props ? props.sentiment : null),
-    type: type && !legacyButtonTypes.includes(type) ? type : props.htmlType || null,
-    v2: true
-  };
-};
-const Button = /*#__PURE__*/React.forwardRef(({
-  v2 = false,
-  ...props
-}, ref) => {
-  if (v2) {
-    const mappedProps = mapProps(props);
-    return /*#__PURE__*/jsxRuntime.jsx(Button$1, {
-      ...mappedProps,
-      ref: ref
-    });
-  }
-  return /*#__PURE__*/jsxRuntime.jsx(LegacyButton, {
-    ...props,
-    ref: ref
-  });
-});
-Button.displayName = 'Button';
-
-module.exports = Button;
-//# sourceMappingURL=Button.resolver.js.map

package/build/button/Button.resolver.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Button.resolver.js","sources":["../../src/button/Button.resolver.tsx"],"sourcesContent":["import { forwardRef } from 'react';\nimport LegacyButton, { LegacyButtonProps } from './LegacyButton';\nimport { ButtonReferenceType, ButtonProps as NewButtonProps } from './Button.types';\nimport NewButton from './Button';\n\nexport type ButtonProps = LegacyButtonProps | NewButtonProps;\n\nconst mapProps = (props: LegacyButtonProps): NewButtonProps => {\n  const { priority, size, type, ...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 || undefined;\n  const mappedSentiment = type === 'negative' ? 'negative' : undefined;\n\n  const legacyButtonTypes: LegacyButtonProps['type'][] = [\n    'accent',\n    'negative',\n    'positive',\n    'primary',\n    'pay',\n    'secondary',\n    'danger',\n    'link',\n  ];\n\n  const resolveSize = () => {\n    if (size) {\n      return { xs: 'sm', sm: 'sm', md: 'md', lg: 'lg' }[size] || size;\n    }\n\n    return size;\n  };\n\n  return {\n    ...newProps,\n    size: resolveSize(),\n    priority: mappedPriority,\n    sentiment: mappedSentiment || ('sentiment' in props ? props.sentiment : null),\n    type: type && !legacyButtonTypes.includes(type) ? type : props.htmlType || null,\n    v2: true,\n  } as NewButtonProps;\n};\n\nconst Button = forwardRef<ButtonReferenceType, ButtonProps>(({ v2 = false, ...props }, ref) => {\n  if (v2) {\n    const mappedProps = mapProps(props as LegacyButtonProps);\n    return <NewButton {...mappedProps} ref={ref} />;\n  }\n\n  return <LegacyButton {...(props as LegacyButtonProps)} ref={ref} />;\n});\n\nButton.displayName = 'Button';\n\nexport default Button;\n"],"names":["mapProps","props","priority","size","type","newProps","priorityMapping","accent","primary","secondary","tertiary","positive","negative","mappedPriority","undefined","mappedSentiment","legacyButtonTypes","resolveSize","xs","sm","md","lg","sentiment","includes","htmlType","v2","Button","forwardRef","ref","mappedProps","_jsx","NewButton","LegacyButton","displayName"],"mappings":";;;;;;;AAOA,MAAMA,QAAQ,GAAIC,KAAwB,IAAoB;EAC5D,MAAM;IAAEC,QAAQ;IAAEC,IAAI;IAAEC,IAAI;IAAE,GAAGC,QAAAA;AAAQ,GAAE,GAAGJ,KAAK,CAAA;AAEnD,EAAA,MAAMK,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,GAClBT,IAAI,IAAIF,QAAQ,GAAGI,eAAe,CAACF,IAAI,CAAC,GAAGF,QAAQ,CAAC,IAAIA,QAAQ,GAAGA,QAAQ,IAAIY,SAAS,CAAA;EAC1F,MAAMC,eAAe,GAAGX,IAAI,KAAK,UAAU,GAAG,UAAU,GAAGU,SAAS,CAAA;AAEpE,EAAA,MAAME,iBAAiB,GAAgC,CACrD,QAAQ,EACR,UAAU,EACV,UAAU,EACV,SAAS,EACT,KAAK,EACL,WAAW,EACX,QAAQ,EACR,MAAM,CACP,CAAA;EAED,MAAMC,WAAW,GAAGA,MAAK;AACvB,IAAA,IAAId,IAAI,EAAE;MACR,OAAO;AAAEe,QAAAA,EAAE,EAAE,IAAI;AAAEC,QAAAA,EAAE,EAAE,IAAI;AAAEC,QAAAA,EAAE,EAAE,IAAI;AAAEC,QAAAA,EAAE,EAAE,IAAA;AAAI,OAAE,CAAClB,IAAI,CAAC,IAAIA,IAAI,CAAA;AACjE,KAAA;AAEA,IAAA,OAAOA,IAAI,CAAA;GACZ,CAAA;EAED,OAAO;AACL,IAAA,GAAGE,QAAQ;IACXF,IAAI,EAAEc,WAAW,EAAE;AACnBf,IAAAA,QAAQ,EAAEW,cAAc;AACxBS,IAAAA,SAAS,EAAEP,eAAe,KAAK,WAAW,IAAId,KAAK,GAAGA,KAAK,CAACqB,SAAS,GAAG,IAAI,CAAC;AAC7ElB,IAAAA,IAAI,EAAEA,IAAI,IAAI,CAACY,iBAAiB,CAACO,QAAQ,CAACnB,IAAI,CAAC,GAAGA,IAAI,GAAGH,KAAK,CAACuB,QAAQ,IAAI,IAAI;AAC/EC,IAAAA,EAAE,EAAE,IAAA;GACa,CAAA;AACrB,CAAC,CAAA;AAED,MAAMC,MAAM,gBAAGC,gBAAU,CAAmC,CAAC;AAAEF,EAAAA,EAAE,GAAG,KAAK;EAAE,GAAGxB,KAAAA;AAAK,CAAE,EAAE2B,GAAG,KAAI;AAC5F,EAAA,IAAIH,EAAE,EAAE;AACN,IAAA,MAAMI,WAAW,GAAG7B,QAAQ,CAACC,KAA0B,CAAC,CAAA;IACxD,oBAAO6B,cAAA,CAACC,QAAS,EAAA;AAAA,MAAA,GAAKF,WAAW;AAAED,MAAAA,GAAG,EAAEA,GAAAA;AAAI,MAAG,CAAA;AACjD,GAAA;EAEA,oBAAOE,cAAA,CAACE,YAAY,EAAA;AAAA,IAAA,GAAM/B,KAA2B;AAAE2B,IAAAA,GAAG,EAAEA,GAAAA;AAAI,IAAG,CAAA;AACrE,CAAC,EAAC;AAEFF,MAAM,CAACO,WAAW,GAAG,QAAQ;;;;"}