@redneckz/wildless-cms-uni-blocks 0.14.899 → 0.14.900

package/mobile/lib/components/ExchangeRateTile/renderInput.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@redneckz/uni-jsx/jsx-runtime";
+import { Input } from '../../ui-kit/Input/Input.js';
+import { Select } from '../../ui-kit/Select/Select.js';
+export function renderInput(props) {
+    const { placeholder, rates, selected, value, onChange, setSelected } = props;
+    const ratesOptions = rates.map((_) => ({
+        key: _?.currency?.currency ?? '',
+        text: _?.currency?.currency ?? '',
+    }));
+    const selectedValue = { key: selected, text: selected };
+    return (_jsxs("div", { className: "relative flex", children: [_jsx(Input, { className: "shrink-0 text-l w-full appearance-none -mr-20", placeholder: placeholder, type: "text", value: value, onChange: onChange }), ratesOptions.length ? (_jsx(Select, { className: "absolute right-0", isBorder: false, onChange: (_) => setSelected(_.key), options: ratesOptions, value: selectedValue })) : null] }));
+}
+//# sourceMappingURL=renderInput.js.map

package/mobile/lib/components/ExchangeRateTile/renderInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderInput.js","sourceRoot":"","sources":["../../../src/components/ExchangeRateTile/renderInput.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAEjD,OAAO,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAUpD,MAAM,UAAU,WAAW,CAAC,KAAiB;IAC3C,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IAC7E,MAAM,YAAY,GAAa,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;QAC/C,GAAG,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,IAAI,EAAE;QAChC,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,IAAI,EAAE;KAClC,CAAC,CAAC,CAAC;IACJ,MAAM,aAAa,GAAW,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;IAEhE,OAAO,CACL,eAAK,SAAS,EAAC,eAAe,aAC5B,KAAC,KAAK,IACJ,SAAS,EAAC,+CAA+C,EACzD,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,GAClB,EACD,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,CACrB,KAAC,MAAM,IACL,SAAS,EAAC,kBAAkB,EAC5B,QAAQ,EAAE,KAAK,EACf,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,GAAe,CAAC,EAC/C,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,aAAa,GACpB,CACH,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAC;AACJ,CAAC"}

package/mobile/lib/components/ExchangeRateTile/useFetchExchangeRateData.d.ts

@@ -0,0 +1,9 @@
+import { type ExchangeCurrencyItem } from '../../components/ExchangeRateTile/ExchangeCurrencyCalculator';
+import { type Region } from '../../hooks/useRegions';
+export interface ExchangeData {
+    exchangeRate?: {
+        currencies?: ExchangeCurrencyItem[];
+    };
+    address?: string;
+}
+export declare function useFetchExchangeRateData(currentRegion: Region): ExchangeData;

package/mobile/lib/components/ExchangeRateTile/useFetchExchangeRateData.js

@@ -0,0 +1,10 @@
+import { useAsyncData } from '@redneckz/uni-jsx/lib/hooks/useAsyncData';
+import { API_BASE_URI } from '../../api/apiBaseUrl.js';
+import { fetchJSONUnsafe } from '../../utils/fetchJSON.js';
+const EXCHANGE_RATES_URL = `${API_BASE_URI}/exchangerates`;
+export function useFetchExchangeRateData(currentRegion) {
+    const regionCode = currentRegion?.code || '000';
+    const { data } = useAsyncData(EXCHANGE_RATES_URL + `?regionCode=${regionCode}`, fetchJSONUnsafe);
+    return data || {};
+}
+//# sourceMappingURL=useFetchExchangeRateData.js.map

package/mobile/lib/components/ExchangeRateTile/useFetchExchangeRateData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFetchExchangeRateData.js","sourceRoot":"","sources":["../../../src/components/ExchangeRateTile/useFetchExchangeRateData.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,0CAA0C,CAAC;AACxE,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAGpD,OAAO,EAAE,eAAe,EAA4B,MAAM,uBAAuB,CAAC;AASlF,MAAM,kBAAkB,GAAG,GAAG,YAAY,gBAAgB,CAAC;AAE3D,MAAM,UAAU,wBAAwB,CAAC,aAAqB;IAC5D,MAAM,UAAU,GAAG,aAAa,EAAE,IAAI,IAAI,KAAK,CAAC;IAEhD,MAAM,EAAE,IAAI,EAAE,GAAG,YAAY,CAC3B,kBAAkB,GAAG,eAAe,UAAU,EAAE,EAChD,eAAoD,CACrD,CAAC;IAEF,OAAO,IAAI,IAAI,EAAE,CAAC;AACpB,CAAC"}

package/mobile/src/components/ApplicationForm/ApplicationForm.example.json

@@ -182,7 +182,7 @@
         "padding": "",
         "title": "Заявка на выпуск бизнес-карты",
         "typeForm": "BCRD",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
             "inputs": [
@@ -235,7 +235,7 @@
         "padding": "",
         "title": "Заполните онлайн-заявку на открытие брокерского счёта",
         "typeForm": "BROK",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
             "columns": 2,
@@ -334,7 +334,7 @@
         "padding": "",
         "title": "Заполните заявку на консультацию",
         "typeForm": "COLLECTION",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
             "inputs": [
@@ -388,7 +388,7 @@
         "padding": "",
         "title": "Оформите заявку на кредит прямо сейчас",
         "typeForm": "CRED",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
             "title": "Параметры кредита",
@@ -659,7 +659,9 @@
                 "required": true,
                 "condition": {
                   "name": "serviceDirection",
-                  "values": ["Юридическое лицо / ИП"]
+                  "values": [
+                    "Юридическое лицо / ИП"
+                  ]
                 }
               },
               {
@@ -667,7 +669,9 @@
                 "label": "Наименование организации",
                 "condition": {
                   "name": "serviceDirection",
-                  "values": ["Юридическое лицо / ИП"]
+                  "values": [
+                    "Юридическое лицо / ИП"
+                  ]
                 }
               },
               {
@@ -723,7 +727,7 @@
         "padding": "",
         "title": "Заполните заявку на консультацию",
         "typeForm": "SELFCOLLECTION",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
             "inputs": [
@@ -901,7 +905,7 @@
         "padding": "",
         "title": "Получите консультацию по обслуживанию ВЭД",
         "typeForm": "KVED",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
             "inputs": [
@@ -922,7 +926,9 @@
                 "required": true,
                 "condition": {
                   "name": "vedTypes",
-                  "values": ["currencyControl"]
+                  "values": [
+                    "currencyControl"
+                  ]
                 }
               }
             ]
@@ -935,7 +941,10 @@
                 "required": true,
                 "condition": {
                   "name": "vedTypes",
-                  "values": ["currencyControl", "documentOperations"]
+                  "values": [
+                    "currencyControl",
+                    "documentOperations"
+                  ]
                 }
               },
               {
@@ -957,7 +966,11 @@
                 "required": true,
                 "condition": {
                   "name": "vedTypes",
-                  "values": ["documentOperations", "conversionTransactions", "otherIssues"]
+                  "values": [
+                    "documentOperations",
+                    "conversionTransactions",
+                    "otherIssues"
+                  ]
                 }
               }
             ]
@@ -1062,16 +1075,27 @@
         "padding": "",
         "title": "Заявка по акции 'Шеф в деле'",
         "typeForm": "FCB",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
-            "inputs": [{ "name": "name", "required": true }]
+            "inputs": [
+              {
+                "name": "name",
+                "required": true
+              }
+            ]
           },
           {
             "columns": 2,
             "inputs": [
-              { "name": "phone", "required": true },
-              { "name": "inn", "required": true }
+              {
+                "name": "phone",
+                "required": true
+              },
+              {
+                "name": "inn",
+                "required": true
+              }
             ]
           }
         ],
@@ -1095,10 +1119,15 @@
         "padding": "",
         "title": "Льготное кредитование АПК",
         "typeForm": "CREDL",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
-            "inputs": [{ "name": "name", "required": true }]
+            "inputs": [
+              {
+                "name": "name",
+                "required": true
+              }
+            ]
           },
           {
             "columns": 2,
@@ -1134,14 +1163,27 @@
         "padding": "",
         "title": "Подключить расчетно-кассовое обслуживание",
         "typeForm": "CONT",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
-            "inputs": [{ "name": "name", "required": true }]
+            "inputs": [
+              {
+                "name": "name",
+                "required": true
+              }
+            ]
           },
           {
             "columns": 2,
-            "inputs": [{ "name": "phone", "required": true }, { "name": "inn" }]
+            "inputs": [
+              {
+                "name": "phone",
+                "required": true
+              },
+              {
+                "name": "inn"
+              }
+            ]
           }
         ],
         "button": {
@@ -1312,7 +1354,9 @@
                 "required": true,
                 "condition": {
                   "name": "serviceDirection",
-                  "values": ["Юридическое лицо / ИП"]
+                  "values": [
+                    "Юридическое лицо / ИП"
+                  ]
                 }
               },
               {
@@ -1320,7 +1364,9 @@
                 "label": "Наименование организации",
                 "condition": {
                   "name": "serviceDirection",
-                  "values": ["Юридическое лицо / ИП"]
+                  "values": [
+                    "Юридическое лицо / ИП"
+                  ]
                 }
               },
               {
@@ -1337,7 +1383,9 @@
                 "label": "Ваше сообщение",
                 "condition": {
                   "name": "serviceDirection",
-                  "values": ["Физическое лицо"]
+                  "values": [
+                    "Физическое лицо"
+                  ]
                 }
               },
               {
@@ -1346,7 +1394,9 @@
                 "required": true,
                 "condition": {
                   "name": "serviceDirection",
-                  "values": ["Юридическое лицо / ИП"]
+                  "values": [
+                    "Юридическое лицо / ИП"
+                  ]
                 }
               }
             ]
@@ -1379,7 +1429,7 @@
         "version": "primary",
         "title": "Онлайн-заявка от партнёра",
         "typeForm": "PF",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
             "title": "Информация о партнёре",
@@ -1468,14 +1518,27 @@
         "padding": "",
         "title": "Подключить расчетно-кассовое обслуживание'",
         "typeForm": "UNIVERSAL",
-        "endpoint": "sendcorporatelead",
+        "endpoint": "initcorporatelead",
         "sections": [
           {
-            "inputs": [{ "name": "name", "required": true }]
+            "inputs": [
+              {
+                "name": "name",
+                "required": true
+              }
+            ]
           },
           {
             "columns": 2,
-            "inputs": [{ "name": "phone", "required": true }, { "name": "inn" }]
+            "inputs": [
+              {
+                "name": "phone",
+                "required": true
+              },
+              {
+                "name": "inn"
+              }
+            ]
           }
         ],
         "button": {
@@ -1490,4 +1553,4 @@
       }
     }
   ]
-]
+]

package/mobile/src/components/ApplicationForm/ApplicationFormContent.ts

@@ -38,10 +38,11 @@ export type FieldDef = Required &
     name?: NameFieldDef;
     dadata?: boolean;
     defaultValue?: string;
+    placeholder?: string;
   };
 
 /** @hidden */
-export type EndpointType = 'lead' | 'sendcorporatelead' | 'initcorporatelead';
+export type EndpointType = 'lead' | 'initcorporatelead';
 
 /**
  * @title Секция полей ввода

package/mobile/src/components/Blocks.ts

@@ -22,6 +22,7 @@ import { CreditForm } from './CreditForm/CreditForm';
 import { DebitForm } from './DebitForm/DebitForm';
 import { DepositFiltration } from './DepositFiltration/DepositFiltration';
 import { ErrorBlock } from './ErrorBlock/ErrorBlock';
+import { ExchangeRateTile } from './ExchangeRateTile/ExchangeRateTile';
 import { Footer } from './Footer/Footer';
 import { GalleryLayout } from './GalleryLayout/GalleryLayout';
 import { GrantSupport } from './GrantSupport/GrantSupport';
@@ -61,6 +62,7 @@ export const Blocks: BlocksRegistry = {
   CarouselTariffsCard,
   DepositFiltration,
   ErrorBlock,
+  ExchangeRateTile,
   Footer,
   GalleryLayout,
   GrantSupport,

package/mobile/src/components/ExchangeRateTile/CurrencyProps.ts

@@ -0,0 +1,6 @@
+export enum Currency {
+  RUB = 'RUB',
+  EUR = 'EUR',
+  USD = 'USD',
+  CNY = 'CNY',
+}

package/mobile/src/components/ExchangeRateTile/CurrencyTable.tsx

@@ -0,0 +1,64 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { type ComponentType } from '../../model/ComponentType';
+import { Img } from '../../ui-kit/Img/Img';
+import { Text } from '../../ui-kit/Text/Text';
+import { style } from '../../utils/style';
+import { type ExchangeCurrencyItem } from './ExchangeCurrencyCalculator';
+import { formatCurrency } from './formatCurrency';
+
+const TABLE_STYLE_BASE = 'text-m font-light text-secondary-text ';
+const TABLE_HEAD_STYLE = `${TABLE_STYLE_BASE} text-left`;
+const TABLE_HEAD_STYLE_CENTER = `${TABLE_STYLE_BASE} pl-5xl text-center`;
+const TABLE_HEAD_STYLE_RIGHT = `${TABLE_STYLE_BASE} pl-5xl text-right`;
+
+const CURRENCY_ICONS_MAP = {
+  USD: 'DollarIcon',
+  EUR: 'EuroIcon',
+  CNY: 'ChineseYuanRenminbiIcon',
+};
+
+interface CurrencyTableProps extends ComponentType {
+  exchangeCurrencyItems: ExchangeCurrencyItem[];
+}
+
+export const CurrencyTable = JSX<CurrencyTableProps>(({ className, exchangeCurrencyItems }) => (
+  <table className={style('h-fit w-full', className)}>
+    <thead>
+      <tr>
+        <th className={TABLE_HEAD_STYLE}>
+          <Text size="text-m">Валюта</Text>
+        </th>
+        <th className={TABLE_HEAD_STYLE_CENTER}>
+          <Text size="text-m">Купить</Text>
+        </th>
+        <th className={TABLE_HEAD_STYLE_RIGHT}>
+          <Text size="text-m">Продать</Text>
+        </th>
+      </tr>
+    </thead>
+    <tbody>{exchangeCurrencyItems.map(renderCurrencyRow)}</tbody>
+  </table>
+));
+
+const renderCurrencyRow = (exchangeCurrencyItem: ExchangeCurrencyItem) => {
+  const currency = exchangeCurrencyItem?.currency?.currency;
+
+  return (
+    <tr key={currency} className="pb-2xs text-h6">
+      <td className="pt-m m-auto flex text-left">
+        <div className="flex items-center gap-xs">
+          {currency ? (
+            <Img image={{ icon: CURRENCY_ICONS_MAP[currency] }} width="24" height="24" />
+          ) : null}
+          <Text size="text-h6">{currency}</Text>
+        </div>
+      </td>
+      <td className="pt-m pl-5xl text-center">
+        <Text size="text-h6">{formatCurrency(exchangeCurrencyItem?.saleExchangeRate)}</Text>
+      </td>
+      <td className="pt-m pl-5xl text-right">
+        <Text size="text-h6">{formatCurrency(exchangeCurrencyItem?.buyExchangeRate)}</Text>
+      </td>
+    </tr>
+  );
+};

package/mobile/src/components/ExchangeRateTile/CurrentLocation.tsx

@@ -0,0 +1,28 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { type ComponentType } from '../../model/ComponentType';
+import { type Picture } from '../../model/Picture';
+import { RoundedIcon } from '../../ui-kit/Icon/RoundedIcon';
+import { Paragraph } from '../../ui-kit/Paragraph/Paragraph';
+import { style } from '../../utils/style';
+
+interface CurrentLocationProps extends ComponentType {
+  address?: string;
+}
+
+const icon: Picture = { icon: 'GpsIcon' };
+
+export const CurrentLocation = JSX<CurrentLocationProps>(({ className = '', address }) => (
+  <div className={style('flex gap-s w-full justify-between @sm:justify-center', className)}>
+    <RoundedIcon {...icon} iconBgVersion="primary" className="shrink-0" />
+    <div className="space-y-2xs whitespace-pre-wrap">
+      {address ? (
+        <Paragraph size="text-l" color="text-primary-main">
+          {address}
+        </Paragraph>
+      ) : null}
+      <Paragraph size="text-m" color="text-secondary-text">
+        Курс указан для заданного офиса
+      </Paragraph>
+    </div>
+  </div>
+));

package/mobile/src/components/ExchangeRateTile/ExchangeCurrencyCalculator.tsx

@@ -0,0 +1,155 @@
+import { JSX } from '@redneckz/uni-jsx';
+import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
+import { type ComponentType } from '../../model/ComponentType';
+import { LinkButton } from '../../ui-kit/LinkButton/LinkButton';
+import { type ButtonCommonContent } from '../../ui-kit/LinkButton/LinkButtonContent';
+import { calculateResult, formatValue } from './calculateResult';
+import { callbackCurrencySelect } from './callbackCurrencySelect';
+import { Currency } from './CurrencyProps';
+import { renderInput } from './renderInput';
+
+export interface ExchangeCurrencyItem {
+  currency?: {
+    id?: number;
+    code?: string;
+    currency?: Currency;
+  };
+  buyExchangeRate?: number;
+  saleExchangeRate?: number;
+}
+
+export interface ExchangeCurrencyCalculatorProps extends ComponentType {
+  currencyRatesBuy: ExchangeCurrencyItem[];
+  currencyRatesSell: ExchangeCurrencyItem[];
+  button?: ButtonCommonContent;
+}
+
+export interface CalcState {
+  inputSell: string;
+  inputBuy: string;
+  selectSell: Currency;
+  selectBuy: Currency;
+}
+
+export const ExchangeCurrencyCalculator = JSX<ExchangeCurrencyCalculatorProps>(
+  ({ className = '', currencyRatesBuy, currencyRatesSell, button }) => {
+    const [calcState, setCalcState] = useState<CalcState>({
+      inputSell: '',
+      inputBuy: '',
+      selectSell: currencyRatesBuy?.[0]?.currency?.currency || Currency.RUB,
+      selectBuy: currencyRatesSell?.[0]?.currency?.currency || Currency.USD,
+    });
+
+    const handleSetCalcState = useCallback(
+      (newState: Partial<CalcState>) => setCalcState((oldState) => ({ ...oldState, ...newState })),
+      [],
+    );
+
+    return (
+      <div className={`flex flex-col gap-m pt-2xl ${className}`}>
+        {currencyRatesBuy && currencyRatesSell ? (
+          <div className="grid gap-m">
+            {renderInput({
+              placeholder: 'Хочу продать',
+              rates: currencyRatesSell,
+              selected: calcState.selectSell,
+              setSelected: handleSelectSell(calcState, handleSetCalcState, currencyRatesSell),
+              value: calcState.inputSell,
+              onChange: (value) =>
+                handleInputSell(handleSetCalcState, currencyRatesSell)(
+                  value,
+                  calcState.selectSell,
+                  calcState.selectBuy,
+                ),
+            })}
+            {renderInput({
+              placeholder: 'Получу',
+              rates: currencyRatesBuy,
+              selected: calcState.selectBuy,
+              setSelected: handleSelectBuy(calcState, handleSetCalcState, currencyRatesBuy),
+              value: calcState.inputBuy,
+              onChange: (value) =>
+                handleInputBuy(handleSetCalcState, currencyRatesBuy)(
+                  value,
+                  calcState.selectBuy,
+                  calcState.selectSell,
+                ),
+            })}
+          </div>
+        ) : null}
+        {button?.text ? (
+          <LinkButton text={button.text} version={button?.version} {...button} />
+        ) : null}
+      </div>
+    );
+  },
+);
+
+const handleSelectSell =
+  (
+    calcState: CalcState,
+    setCalcState: (state: Partial<CalcState>) => void,
+    currencyRatesSell: ExchangeCurrencyItem[],
+  ) =>
+  (value: Currency) => {
+    setCalcState({ selectSell: value });
+    callbackCurrencySelect({
+      value,
+      oppositeValue: calcState.selectBuy,
+      handleConvert: (currencyFrom = calcState.selectSell, currencyTo = calcState.selectBuy) => {
+        handleInputSell(setCalcState, currencyRatesSell)(
+          calcState.inputSell,
+          currencyFrom,
+          currencyTo,
+        );
+      },
+    });
+  };
+
+const handleSelectBuy =
+  (
+    calcState: CalcState,
+    setCalcState: (state: Partial<CalcState>) => void,
+    currencyRatesBuy: ExchangeCurrencyItem[],
+  ) =>
+  (value: Currency) => {
+    setCalcState({ selectBuy: value });
+    callbackCurrencySelect({
+      value,
+      oppositeValue: calcState.selectSell,
+      handleConvert: (currencyTo = calcState.selectBuy, currencyFrom = calcState.selectSell) =>
+        handleInputBuy(setCalcState, currencyRatesBuy)(
+          calcState.inputBuy,
+          currencyTo,
+          currencyFrom,
+        ),
+    });
+  };
+
+const handleInputSell =
+  (setCalcState: (state: Partial<CalcState>) => void, currencyRatesSell: ExchangeCurrencyItem[]) =>
+  (value: string, currencyFrom: Currency, currencyTo: Currency) => {
+    setCalcState({ inputSell: formatValue(value), selectBuy: currencyTo });
+    const rate =
+      currencyRatesSell.find((_) => _.currency?.currency === currencyTo)?.buyExchangeRate ||
+      currencyRatesSell.find((_) => _.currency?.currency === currencyFrom)?.buyExchangeRate;
+    if (rate) {
+      setCalcState({
+        inputBuy: String(calculateResult(value, rate, currencyFrom === Currency.RUB) || ''),
+      });
+    }
+  };
+
+const handleInputBuy =
+  (setCalcState: (state: Partial<CalcState>) => void, currencyRatesBuy: ExchangeCurrencyItem[]) =>
+  (value: string, currencyTo: Currency, currencyFrom: Currency) => {
+    setCalcState({ inputBuy: formatValue(value), selectSell: currencyFrom });
+    const rate =
+      currencyRatesBuy.find((_) => _.currency?.currency === currencyFrom)?.saleExchangeRate ||
+      currencyRatesBuy.find((_) => _.currency?.currency === currencyTo)?.saleExchangeRate;
+    if (rate) {
+      setCalcState({
+        inputSell: String(calculateResult(value, rate, currencyTo === Currency.RUB) || ''),
+      });
+    }
+  };

package/mobile/src/components/ExchangeRateTile/ExchangeRateTile.example.json

@@ -0,0 +1,12 @@
+{
+  "content": {
+    "version": "primary",
+    "padding": "",
+    "button": {
+      "href": "https://coins.rshb.ru/exchange",
+      "text": "Купить валюту",
+      "target": "_blank",
+      "version": "primary"
+    }
+  }
+}