feat(core-components-amount): add boilerplate for amount

packages/amount/package.json

@@ -0,0 +1,18 @@
+{
+    "name": "@alfalab/core-components-amount",
+    "version": "1.0.0",
+    "description": "",
+    "keywords": [],
+    "license": "ISC",
+    "main": "dist/index.js",
+    "files": [
+        "dist"
+    ],
+    "publishConfig": {
+        "access": "public"
+    },
+    "peerDependencies": {
+        "classnames": "^2.2.6",
+        "react": "^16.9.0"
+    }
+}

packages/amount/src/Component.tsx

@@ -1,40 +1,42 @@
 import React from 'react';
 
-import { formatAmount } from '../../utils';
-import {
-    AMOUNT_MAJOR_MINOR_PARTS_SEPARATOR,
-    THINSP,
-    CURRENCY_CODES,
-} from '../../configs/currencyCodes';
+import { formatAmount } from './utils';
+import { AMOUNT_MAJOR_MINOR_PARTS_SEPARATOR, THINSP, CurrencyCodes } from './utils/currencyCodes';
 
 type Props = {
     value: number;
-    currency: string;
+    currency: CurrencyCodes;
     minority: number;
     hideMinority?: boolean;
 
     className?: string;
     minorityClassName?: string;
+    /**
+     * Идентификатор для систем автоматизированного тестирования
+     */
+    dataTestId?: string;
 };
 
 export const Amount: React.FC<Props> = ({
     value,
     minority,
+    currency,
     hideMinority = false,
 
     className,
     minorityClassName,
+    dataTestId,
 }) => {
     const { majorPart, minorPart, currencySymbol } = formatAmount({
         value,
         currency: {
-            code: CURRENCY_CODES.RUR, // TODO need work
+            code: currency,
             minority,
         },
     });
 
     return (
-        <div className={className}>
+        <div className={className} data-test-id={dataTestId}>
             {majorPart}
             {!hideMinority && minorPart && AMOUNT_MAJOR_MINOR_PARTS_SEPARATOR}
 

packages/amount/src/__snapshots__/component.test.tsx.snap

@@ -0,0 +1,17 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Amount should match snapshot 1`] = `
+<div
+  data-test-id="test-id"
+>
+  1
+  ,
+  <span>
+    00
+  </span>
+  <span>
+     
+    ₽
+  </span>
+</div>
+`;

packages/amount/src/component.stories.mdx

@@ -0,0 +1,28 @@
+import { Meta, Story, Props, Title } from '@storybook/addon-docs/blocks';
+
+import { Amount } from './component';
+import { name, version } from '../package.json';
+
+<Meta title='Компоненты|Amount' component={Amount} />
+
+<Title>
+    Amount ({name}@{version})
+</Title>
+
+```tsx
+import { Amount } from '@alfalab/core-components-amount';
+```
+
+## Описание
+
+Компонент для ввода Денежных значений.
+
+<Story name='Песочница'>
+    {React.createElement(() => {
+        return (
+            <Amount value={100} currency='RUR' minority={100} />
+        );
+    })}
+</Story>
+
+<Props of={Amount} />

packages/amount/src/component.test.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import { Amount } from './index';
+
+describe('Amount', () => {
+    it('should match snapshot', () => {
+        const testId = 'test-id';
+
+        const { getByTestId } = render(
+            <Amount value={100} currency='RUR' minority={100} dataTestId={testId} />,
+        );
+        const amount = getByTestId(testId);
+        expect(amount).toMatchSnapshot();
+    });
+});

packages/amount/src/index.module.css

@@ -0,0 +1 @@
+@import '../../themes/src/default.css';

packages/amount/src/index.ts

@@ -0,0 +1 @@
+export * from './component';

packages/amount/src/utils/currencyCodes.ts

@@ -0,0 +1,125 @@
+export const THINSP = String.fromCharCode(8201); //  
+export const AMOUNT_MAJOR_MINOR_PARTS_SEPARATOR = ',';
+
+export const AMOUNT_MAJOR_PART_SIZE = 3;
+export const AMOUNT_SPLIT_CODE_FROM = 4;
+export const NEGATIVE_AMOUNT_SYMBOL = '−';
+
+export const CURRENCY_CODES = {
+    ALL: '\u004c\u0065\u006b',
+    AFN: '\u060b',
+    ARS: '\u0024',
+    AWG: '\u0192',
+    AUD: '\u0024',
+    AZN: '\u20bc',
+    BSD: '\u0024',
+    BBD: '\u0024',
+    BYR: '\u0042\u0072',
+    BZD: '\u0042\u005a\u0024',
+    BMD: '\u0024',
+    BOB: '\u0024\u0062',
+    BAM: '\u004b\u004d',
+    BWP: '\u0050',
+    BGN: '\u043b\u0432',
+    BRL: '\u0052\u0024',
+    BND: '\u0024',
+    KHR: '\u17db',
+    CAD: '\u0043\u0024',
+    KYD: '\u0024',
+    CLP: '\u0024',
+    CNY: '\u00a5',
+    COP: '\u0024',
+    CRC: '\u20a1',
+    HRK: '\u006b\u006e',
+    CUP: '\u20b1',
+    CZK: '\u004b\u010d',
+    DKK: '\u006b\u0072',
+    DOP: '\u0052\u0044\u0024',
+    XCD: '\u0024',
+    EGP: '\u00a3',
+    SVC: '\u0024',
+    EEK: '\u006b\u0072',
+    EUR: '\u20ac',
+    FKP: '\u00a3',
+    FJD: '\u0024',
+    FRF: '\u20a3',
+    GHC: '\u00a2',
+    GIP: '\u00a3',
+    GTQ: '\u0051',
+    GGP: '\u00a3',
+    GYD: '\u0024',
+    HNL: '\u004c',
+    HKD: '\u0024',
+    HUF: '\u0046\u0074',
+    ISK: '\u006b\u0072',
+    INR: '\u20a8',
+    IDR: '\u0052\u0070',
+    IRR: '\ufdfc',
+    IMP: '\u00a3',
+    ILS: '\u20aa',
+    JMD: '\u004a\u0024',
+    JPY: '\u00a5',
+    JEP: '\u00a3',
+    KZT: '\u20B8',
+    KGS: '\u004B\u0047\u0053',
+    LAK: '\u20ad',
+    LVL: '\u004c\u0073',
+    LBP: '\u00a3',
+    LRD: '\u0024',
+    LTL: '\u004c\u0074',
+    MKD: '\u0434\u0435\u043d',
+    MYR: '\u0052\u004d',
+    MUR: '\u20a8',
+    MXN: '\u0024',
+    MNT: '\u20ae',
+    MZN: '\u004d\u0054',
+    NAD: '\u0024',
+    NPR: '\u20a8',
+    ANG: '\u0192',
+    NZD: '\u0024',
+    NIO: '\u0043\u0024',
+    NGN: '\u20a6',
+    KPW: '\u20a9',
+    NOK: '\u006b\u0072',
+    OMR: '\ufdfc',
+    PKR: '\u20a8',
+    PAB: '\u0042\u002f\u002e',
+    PYG: '\u0047\u0073',
+    PEN: '\u0053\u002f\u002e',
+    PHP: '\u20b1',
+    PLN: '\u007a\u0142',
+    QAR: '\ufdfc',
+    RON: '\u006c\u0065\u0069',
+    RUR: '\u20bd',
+    SHP: '\u00a3',
+    SAR: '\ufdfc',
+    RSD: '\u0414\u0438\u043d\u002e',
+    SCR: '\u20a8',
+    SGD: '\u0024',
+    SBD: '\u0024',
+    SOS: '\u0053',
+    ZAR: '\u0052',
+    KRW: '\u20a9',
+    LKR: '\u20a8',
+    SEK: '\u006b\u0072',
+    CHF: '\u20a3',
+    SRD: '\u0024',
+    SYP: '\u00a3',
+    TWD: '\u004e\u0054\u0024',
+    THB: '\u0e3f',
+    TTD: '\u0054\u0054\u0024',
+    TRY: '\u20a4',
+    TRL: '\u20a4',
+    TVD: '\u0024',
+    UAH: '\u20b4',
+    GBP: '\u00a3',
+    USD: '\u0024',
+    UYU: '\u0024\u0055',
+    UZS: '\u043b\u0432',
+    VEF: '\u0042\u0073',
+    VND: '\u20ab',
+    YER: '\ufdfc',
+    ZWD: '\u005a\u0024',
+};
+
+export type CurrencyCodes = keyof typeof CURRENCY_CODES;

packages/amount/src/utils/formatAmount.test.ts

@@ -0,0 +1,10 @@
+import { splitAmount } from './formatAmount';
+
+test('splitAmount', () => {
+    expect(splitAmount('100', 3, ' ')).toBe('100');
+    expect(splitAmount('1000', 3, ' ')).toBe('1000');
+    expect(splitAmount('10000', 3, ' ')).toBe('10 000');
+    expect(splitAmount('100000', 3, ' ')).toBe('100 000');
+    expect(splitAmount('1000000', 3, ' ')).toBe('1 000 000');
+    expect(splitAmount('10000000', 3, ' ')).toBe('10 000 000');
+});