@transferwise/components 0.0.0-experimental-eaf43c2 → 0.0.0-experimental-6730b89

package/build/types/moneyInputField/AmountInput.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AmountInput.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/AmountInput.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,IAAI,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAelE,KAAK,KAAK,GAAG;IACX,EAAE,EAAE,MAAM,CAAC;IACX,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC1C,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAC5C,GAAG,IAAI,CAAC,oBAAoB,EAAE,SAAS,CAAC,CAAC;AAE1C,eAAO,MAAM,WAAW,GAAI,uFASzB,KAAK,gCA6SP,CAAC"}

package/build/types/moneyInputField/AnimatedNumber.d.ts

@@ -1,9 +0,0 @@
-import type { ReactNode } from 'react';
-interface Props {
-    children: ReactNode;
-    onClick?: () => void;
-    className?: string;
-}
-export declare const AnimatedNumber: ({ children, onClick, className }: Props) => import("react").JSX.Element;
-export {};
-//# sourceMappingURL=AnimatedNumber.d.ts.map

package/build/types/moneyInputField/AnimatedNumber.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"AnimatedNumber.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/AnimatedNumber.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,UAAU,KAAK;IACb,QAAQ,EAAE,SAAS,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,cAAc,GAAI,kCAAkC,KAAK,gCA8BrE,CAAC"}

package/build/types/moneyInputField/Chevron.d.ts

@@ -1,6 +0,0 @@
-interface Props {
-    shouldShow: boolean;
-}
-export declare const Chevron: ({ shouldShow }: Props) => import("react").JSX.Element;
-export {};
-//# sourceMappingURL=Chevron.d.ts.map

package/build/types/moneyInputField/Chevron.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Chevron.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/Chevron.tsx"],"names":[],"mappings":"AAIA,UAAU,KAAK;IACb,UAAU,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,OAAO,GAAI,gBAAuB,KAAK,gCA0BnD,CAAC"}

package/build/types/moneyInputField/CurrencySelector.d.ts

@@ -1,30 +0,0 @@
-import { AvatarLayoutProps } from '..';
-import { CurrencyType, Props as MoneyInputFieldProps } from './MoneyInputField';
-import { type ButtonHTMLAttributes, type ReactNode } from 'react';
-export interface CurrencyOption {
-    label?: string;
-    code: string;
-    keywords: string[] | undefined;
-}
-export interface CurrencySection {
-    title: string;
-    currencies: CurrencyOption[];
-}
-export type CurrencyOptions = CurrencySection[];
-export type Props = {
-    id: string;
-    labelId: string;
-    options?: CurrencyOptions;
-    onChange?: (currency: CurrencyType) => void;
-    onOpen?: () => void;
-    addons?: AvatarLayoutProps['avatars'];
-    onSearchChange?: (payload: {
-        query: string;
-        resultCount: number;
-    }) => void;
-} & Pick<MoneyInputFieldProps, 'currency'>;
-export declare const CurrencySelector: ({ id, currency, options, labelId, onChange, addons, onOpen, onSearchChange, }: Props) => import("react").JSX.Element;
-export declare const ButtonInput: import("react").ForwardRefExoticComponent<ButtonHTMLAttributes<HTMLButtonElement> & {
-    children?: ReactNode | undefined;
-} & import("react").RefAttributes<HTMLButtonElement | null>>;
-//# sourceMappingURL=CurrencySelector.d.ts.map

package/build/types/moneyInputField/CurrencySelector.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CurrencySelector.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/CurrencySelector.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAKlB,MAAM,IAAI,CAAC;AACZ,OAAO,EAAE,YAAY,EAAE,KAAK,IAAI,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAGhF,OAAO,EACL,KAAK,oBAAoB,EAGzB,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AAKf,MAAM,WAAW,cAAc;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,EAAE,GAAG,SAAS,CAAC;CAChC;AAED,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,cAAc,EAAE,CAAC;CAC9B;AAED,MAAM,MAAM,eAAe,GAAG,eAAe,EAAE,CAAC;AAEhD,MAAM,MAAM,KAAK,GAAG;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAC;IAC5C,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,MAAM,CAAC,EAAE,iBAAiB,CAAC,SAAS,CAAC,CAAC;IACtC,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CAC5E,GAAG,IAAI,CAAC,oBAAoB,EAAE,UAAU,CAAC,CAAC;AAE3C,eAAO,MAAM,gBAAgB,GAAI,+EAS9B,KAAK,gCA2FP,CAAC;AAEF,eAAO,MAAM,WAAW;;4DAgBtB,CAAC"}

package/build/types/moneyInputField/MoneyInputField.d.ts

@@ -1,30 +0,0 @@
-import { type ReactNode } from 'react';
-import { type Props as CurrencySelectorProps } from './CurrencySelector';
-import { CommonProps } from '../common';
-import { type InlinePromptProps } from '../prompt/InlinePrompt';
-type AmountType = number | null;
-export type CurrencyType = string;
-type DefaultCurrencySelectorInstanceType = Pick<CurrencySelectorProps, 'addons' | 'options' | 'onChange' | 'onOpen' | 'onSearchChange'>;
-type CustomCurrencySelectorInstanceType = (props: {
-    id: string;
-    labelId: string;
-}) => ReactNode;
-type CurrencySelectorType = DefaultCurrencySelectorInstanceType | CustomCurrencySelectorInstanceType;
-export type Props = {
-    label?: ReactNode;
-    currencySelector?: CurrencySelectorType;
-    amount?: AmountType;
-    currency: CurrencyType;
-    inlinePrompt?: {
-        sentiment?: InlinePromptProps['sentiment'];
-        message: InlinePromptProps['children'];
-    };
-    showChevron?: boolean;
-    autoFocus?: boolean;
-    loading?: boolean;
-    onAmountChange: (amount: AmountType) => void;
-    onFocusChange?: (focused: boolean) => void;
-} & CommonProps;
-export default function MoneyInputField({ label, currency, currencySelector, amount, onAmountChange, className, inlinePrompt, showChevron, autoFocus, loading, onFocusChange, }: Props): import("react").JSX.Element;
-export {};
-//# sourceMappingURL=MoneyInputField.d.ts.map

package/build/types/moneyInputField/MoneyInputField.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MoneyInputField.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/MoneyInputField.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAS,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9C,OAAO,EAAE,KAAK,KAAK,IAAI,qBAAqB,EAAoB,MAAM,oBAAoB,CAAC;AAC3F,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAGxC,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAE9E,KAAK,UAAU,GAAG,MAAM,GAAG,IAAI,CAAC;AAChC,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC;AAElC,KAAK,mCAAmC,GAAG,IAAI,CAC7C,qBAAqB,EACrB,QAAQ,GAAG,SAAS,GAAG,UAAU,GAAG,QAAQ,GAAG,gBAAgB,CAChE,CAAC;AACF,KAAK,kCAAkC,GAAG,CAAC,KAAK,EAAE;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,KAAK,SAAS,CAAC;AAChG,KAAK,oBAAoB,GACrB,mCAAmC,GACnC,kCAAkC,CAAC;AAEvC,MAAM,MAAM,KAAK,GAAG;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,gBAAgB,CAAC,EAAE,oBAAoB,CAAC;IACxC,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,QAAQ,EAAE,YAAY,CAAC;IACvB,YAAY,CAAC,EAAE;QACb,SAAS,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;QAC3C,OAAO,EAAE,iBAAiB,CAAC,UAAU,CAAC,CAAC;KACxC,CAAC;IACF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IAC7C,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAC5C,GAAG,WAAW,CAAC;AAEhB,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,KAAK,EACL,QAAQ,EACR,gBAAyE,EACzE,MAAM,EACN,cAAc,EACd,SAAS,EACT,YAAY,EACZ,WAAW,EACX,SAAS,EACT,OAAO,EACP,aAAa,GACd,EAAE,KAAK,+BAuEP"}

package/build/types/moneyInputField/MoneyInputField.messages.d.ts

@@ -1,12 +0,0 @@
-declare const _default: {
-    currencySelectorSearchPlaceholder: {
-        id: string;
-        defaultMessage: string;
-    };
-    currencySelectorSelectCurrency: {
-        id: string;
-        defaultMessage: string;
-    };
-};
-export default _default;
-//# sourceMappingURL=MoneyInputField.messages.d.ts.map

package/build/types/moneyInputField/MoneyInputField.messages.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"MoneyInputField.messages.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/MoneyInputField.messages.ts"],"names":[],"mappings":";;;;;;;;;;AAEA,wBAUG"}

package/build/types/moneyInputField/index.d.ts

@@ -1,3 +0,0 @@
-export type { Props as MoneyInputFieldProps } from './MoneyInputField';
-export { default } from './MoneyInputField';
-//# sourceMappingURL=index.d.ts.map

package/build/types/moneyInputField/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,KAAK,IAAI,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC"}

package/build/types/moneyInputField/useFocus.d.ts

@@ -1,7 +0,0 @@
-export declare const useFocus: () => {
-    focus: boolean;
-    setFocus: (value: boolean) => void;
-    visualFocus: boolean;
-    setVisualFocus: (value: boolean) => void;
-};
-//# sourceMappingURL=useFocus.d.ts.map

package/build/types/moneyInputField/useFocus.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useFocus.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/useFocus.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,QAAQ;;sBAgBC,OAAO;;4BAUD,OAAO;CAIlC,CAAC"}

package/build/types/moneyInputField/useInputStyle.d.ts

@@ -1,10 +0,0 @@
-import { type CSSProperties } from 'react';
-import { Props as MoneyInputFieldProps } from './MoneyInputField';
-type InputStyleObject = {
-    value: string;
-    focus: boolean;
-    inputElement: HTMLInputElement | null;
-} & Pick<MoneyInputFieldProps, 'loading'>;
-export declare const useInputStyle: ({ value, focus, inputElement, loading }: InputStyleObject) => CSSProperties;
-export {};
-//# sourceMappingURL=useInputStyle.d.ts.map

package/build/types/moneyInputField/useInputStyle.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useInputStyle.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/useInputStyle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAwC,MAAM,OAAO,CAAC;AACjF,OAAO,EAAE,KAAK,IAAI,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AAElE,KAAK,gBAAgB,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,OAAO,CAAC;IACf,YAAY,EAAE,gBAAgB,GAAG,IAAI,CAAC;CACvC,GAAG,IAAI,CAAC,oBAAoB,EAAE,SAAS,CAAC,CAAC;AAE1C,eAAO,MAAM,aAAa,GAAI,yCAAyC,gBAAgB,kBAyBtF,CAAC"}

package/build/types/moneyInputField/useSelectionRange.d.ts

@@ -1,10 +0,0 @@
-import { type SyntheticEvent } from 'react';
-export declare const useSelectionRange: () => {
-    selection: {
-        selectionStart: number | null;
-        selectionEnd: number | null;
-    } | undefined;
-    handleSelect: (e: SyntheticEvent<HTMLInputElement>) => void;
-    handleSelectionBlur: () => void;
-};
-//# sourceMappingURL=useSelectionRange.d.ts.map

package/build/types/moneyInputField/useSelectionRange.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useSelectionRange.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/useSelectionRange.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAU,MAAM,OAAO,CAAC;AAEpD,eAAO,MAAM,iBAAiB;;wBAEV,MAAM,GAAG,IAAI;sBACf,MAAM,GAAG,IAAI;;sBAGJ,cAAc,CAAC,gBAAgB,CAAC;;CAc1D,CAAC"}

package/build/types/moneyInputField/utils.d.ts

@@ -1,22 +0,0 @@
-import type { KeyboardEvent } from 'react';
-export declare const getDecimalSeparator: (currency: string, locale: string) => string | null;
-export declare const getGroupSeparator: (currency: string, locale: string) => string | null;
-export declare const getDecimalCount: (currency: string, locale: string) => number;
-export declare const getEnteredDecimalsCount: (value: string, decimalSeparator: string) => number;
-export declare const getUnformattedNumber: ({ value: formattedValue, currency, locale, }: {
-    value: string;
-    currency: string;
-    locale: string;
-}) => number | null;
-export declare const getFormattedString: ({ value: unformattedValue, currency, locale, alwaysShowDecimals, }: {
-    value: number;
-    currency: string;
-    locale: string;
-    alwaysShowDecimals?: boolean;
-}) => string;
-export declare const isInputPossiblyOverflowing: ({ ref, value, }: {
-    ref: React.RefObject<HTMLInputElement>;
-    value: string;
-}) => boolean | undefined;
-export declare const isAllowedInputKey: (e: KeyboardEvent<HTMLInputElement>) => boolean;
-//# sourceMappingURL=utils.d.ts.map

package/build/types/moneyInputField/utils.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/moneyInputField/utils.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,eAAO,MAAM,mBAAmB,GAAI,UAAU,MAAM,EAAE,QAAQ,MAAM,KAAG,MAAM,GAAG,IAE/E,CAAC;AAEF,eAAO,MAAM,iBAAiB,GAAI,UAAU,MAAM,EAAE,QAAQ,MAAM,KAAG,MAAM,GAAG,IAE7E,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,UAAU,MAAM,EAAE,QAAQ,MAAM,KAAG,MAOlE,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAI,OAAO,MAAM,EAAE,kBAAkB,MAAM,WAE9E,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,8CAIlC;IACD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;CAChB,KAAG,MAAM,GAAG,IAmBZ,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,oEAKhC;IACD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,KAAG,MAiBH,CAAC;AAEF,eAAO,MAAM,0BAA0B,GAAI,iBAGxC;IACD,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAAC;IACvC,KAAK,EAAE,MAAM,CAAC;CACf,wBASA,CAAC;AAaF,eAAO,MAAM,iBAAiB,GAAI,GAAG,aAAa,CAAC,gBAAgB,CAAC,YAKnE,CAAC"}

package/src/avatarView/NotificationDot.css

@@ -1,20 +0,0 @@
-.np-notification-dot {
-  --np-notification-dot-size: 14px;
-  position: relative;
-  display: inline-block;
-}
-.np-notification-dot-mask {
-  -webkit-mask-image: radial-gradient(circle at bottom calc(100% - (var(--np-notification-dot-size) / 2)) left calc(100% - (var(--np-notification-dot-size) / 2)), transparent 0, transparent calc(var(--np-notification-dot-size) / 2 + var(--np-notification-dot-offset)), black 0);
-          mask-image: radial-gradient(circle at bottom calc(100% - (var(--np-notification-dot-size) / 2)) left calc(100% - (var(--np-notification-dot-size) / 2)), transparent 0, transparent calc(var(--np-notification-dot-size) / 2 + var(--np-notification-dot-offset)), black 0);
-  -webkit-mask-image: radial-gradient(circle at bottom calc(100% - calc(var(--np-notification-dot-size) / 2)) left calc(100% - calc(var(--np-notification-dot-size) / 2)), transparent 0, transparent calc(var(--np-notification-dot-size) / 2 + var(--np-notification-dot-offset)), black 0);
-          mask-image: radial-gradient(circle at bottom calc(100% - calc(var(--np-notification-dot-size) / 2)) left calc(100% - calc(var(--np-notification-dot-size) / 2)), transparent 0, transparent calc(var(--np-notification-dot-size) / 2 + var(--np-notification-dot-offset)), black 0);
-}
-.np-notification-dot-badge {
-  position: absolute;
-  width: var(--np-notification-dot-size);
-  height: var(--np-notification-dot-size);
-  background-color: var(--color-sentiment-negative);
-  border-radius: 9999px;
-  border-radius: var(--radius-full);
-  right: 0;
-}

package/src/avatarView/NotificationDot.less

@@ -1,24 +0,0 @@
-.np-notification-dot {
-  --np-notification-dot-size: 14px;
-  position: relative;
-  display: inline-block;
-
-  &-mask {
-    mask-image: radial-gradient(
-        circle at bottom calc(100% - calc(var(--np-notification-dot-size) / 2))
-                  left calc(100% - calc(var(--np-notification-dot-size) / 2)),
-        transparent 0,
-        transparent calc(var(--np-notification-dot-size) / 2 + var(--np-notification-dot-offset)),
-        black 0
-    );
-  }
-
-  &-badge {
-    position: absolute;
-    width: var(--np-notification-dot-size);
-    height: var(--np-notification-dot-size);
-    background-color: var(--color-sentiment-negative);
-    border-radius: var(--radius-full);
-    right: 0;
-  }
-}

package/src/avatarView/NotificationDot.tsx

@@ -1,35 +0,0 @@
-import { HTMLAttributes } from 'react';
-import { Props as AvatarViewProps } from './AvatarView';
-
-type Props = Pick<HTMLAttributes<HTMLDivElement>, 'children'> & {
-  avatarSize?: AvatarViewProps['size'];
-};
-
-/**
- * Depending on avatar size, notifcation dot size and offset are different
- */
-const MAP_STYLE_CONFIG = {
-  16: { size: 6, offset: 1 },
-  24: { size: 8, offset: 2 },
-  32: { size: 10, offset: 2 },
-  40: { size: 10, offset: 2 },
-  48: { size: 14, offset: 2 },
-  56: { size: 16, offset: 3 },
-  72: { size: 20, offset: 3 },
-};
-
-export default function NotificationDot({ children, avatarSize = 48 }: Props) {
-  return (
-    <div
-      className="np-notification-dot"
-      style={{
-        // @ts-expect-error CSS custom props allowed
-        '--np-notification-dot-size': `${MAP_STYLE_CONFIG[avatarSize].size}px`,
-        '--np-notification-dot-offset': `${MAP_STYLE_CONFIG[avatarSize].offset}px`,
-      }}
-    >
-      <div className="np-notification-dot-badge" />
-      <div className="np-notification-dot-mask">{children}</div>
-    </div>
-  );
-}

package/src/moneyInputField/AmountInput.css

@@ -1,32 +0,0 @@
-.wds-amount-input-container {
-  width: 100%;
-}
-.wds-amount-input-input-container {
-  display: flex;
-  justify-content: right;
-  width: 100%;
-  transition: font-size 0.4s cubic-bezier(0.3, 0, 0.1, 1), height 0.4s cubic-bezier(0.3, 0, 0.1, 1), margin-top 0.4s cubic-bezier(0.3, 0, 0.1, 1), color 0.4s ease;
-  color: var(--color-interactive-primary);
-  overflow: hidden;
-  margin-bottom: 0 !important;
-}
-@media (prefers-reduced-motion: reduce) {
-  .wds-amount-input-input-container {
-    transition: none;
-  }
-}
-.wds-amount-input-input {
-  border: none;
-  outline: none;
-  flex-grow: 1;
-  text-align: right;
-  background-color: transparent;
-}
-.wds-amount-input-input:focus-visible {
-  outline: none;
-}
-.wds-amount-input-placeholder {
-  flex-grow: 0;
-  display: flex;
-  align-items: center;
-}

package/src/moneyInputField/AmountInput.less

@@ -1,43 +0,0 @@
-.wds-amount-input {
-  &-container {
-    width: 100%;
-  }
-
-  &-input-container {
-    display: flex;
-    justify-content: right;
-    width: 100%;
-    transition:
-      font-size 0.4s cubic-bezier(0.3, 0, 0.1, 1),
-      height 0.4s cubic-bezier(0.3, 0, 0.1, 1),
-      margin-top 0.4s cubic-bezier(0.3, 0, 0.1, 1),
-      color 0.4s ease;
-    color: var(--color-interactive-primary);
-    overflow: hidden;
-    margin-bottom: 0 !important;
-  }
-
-  @media (prefers-reduced-motion: reduce) {
-    &-input-container {
-      transition: none;
-    }
-  }
-
-  &-input {
-    border: none;
-    outline: none;
-    flex-grow: 1;
-    text-align: right;
-    background-color: transparent;
-
-    &:focus-visible {
-      outline: none;
-    }
-  }
-
-  &-placeholder {
-    flex-grow: 0;
-    display: flex;
-    align-items: center;
-  }
-}