types: infer Elements props for Calculation

Components/Calculation/config/elements-components.ts

@@ -8,14 +8,19 @@ import Segmented from 'Elements/Segmented';
 import Select from 'Elements/Select';
 import Switch from 'Elements/Switch';
 import Text from 'Elements/Text';
+import type { ComponentProps } from 'react';
 import type { Elements as ActionElements } from './map/actions';
 import type { Elements as ComputedElements } from './map/computed';
 import type { Elements as ValuesElements } from './map/values';
 
-const components: Record<
-  ValuesElements | ComputedElements | ActionElements,
-  (props: any) => JSX.Element
-> = {
+function wrapComponentsMap<
+  C,
+  T extends Record<ValuesElements | ComputedElements | ActionElements, C>
+>(arg: T) {
+  return arg;
+}
+
+const components = wrapComponentsMap({
   selectProduct: Select,
   selectClientRisk: Select,
   selectClientType: Select,
@@ -169,6 +174,12 @@ const components: Record<
 
   /** Link Elements */
   linkDownloadKp: Link,
-};
+});
 
 export default components;
+
+type ComponentsTypes = typeof components;
+
+export type ElementsProps = {
+  [Component in keyof ComponentsTypes]: ComponentProps<ComponentsTypes[Component]>;
+};

Components/Calculation/config/elements-props.ts

@@ -4,7 +4,7 @@ import date from 'tools/date';
 import { formatMoney, formatNumber } from 'tools/format';
 import { pipe } from 'tools/function';
 import { round } from 'tools/number';
-import type { ElementsProps } from '../types/elements-props';
+import type { ElementsProps } from './elements-components';
 
 const props: Partial<ElementsProps> = {
   tbxLeaseObjectPrice: {

Components/Calculation/types/elements-props.ts

@@ -1,169 +0,0 @@
-import type { ButtonProps } from 'Elements/Button';
-import type { CheckboxProps } from 'Elements/Checkbox';
-import type { InputProps } from 'Elements/Input';
-import type { InputNumberProps } from 'Elements/InputNumber';
-import type { LinkProps } from 'Elements/Link';
-import type { RadioProps } from 'Elements/Radio';
-import type { SegmentedProps } from 'Elements/Segmented';
-import type { SelectProps } from 'Elements/Select';
-import type { SwitchProps } from 'Elements/Switch';
-import type { TextProps } from 'Elements/Text';
-
-export interface ElementsProps {
-  selectProduct: SelectProps;
-  selectClientRisk: SelectProps;
-  selectClientType: SelectProps;
-  selectSupplierCurrency: SelectProps;
-  tbxLeaseObjectPrice: InputNumberProps;
-  tbxLeaseObjectPriceWthtVAT: InputNumberProps;
-  tbxVATInLeaseObjectPrice: InputNumberProps;
-  tbxSupplierDiscountRub: InputNumberProps;
-  tbxSupplierDiscountPerc: InputNumberProps;
-  radioBalanceHolder: RadioProps;
-  tbxSaleBonus: InputNumberProps;
-  tbxFirstPaymentPerc: InputNumberProps;
-  tbxFirstPaymentRub: InputNumberProps;
-  radioLastPaymentRule: RadioProps;
-  tbxLastPaymentPerc: InputNumberProps;
-  tbxLastPaymentRub: InputNumberProps;
-  tbxRedemptionPaymentSum: InputNumberProps;
-  tbxLeasingPeriod: InputNumberProps;
-  radioGraphType: RadioProps;
-  tbxParmentsDecreasePercent: InputNumberProps;
-  selectSeasonType: SelectProps;
-  selectHighSeasonStart: SelectProps;
-  tbxComissionPerc: InputNumberProps;
-  tbxComissionRub: InputNumberProps;
-  selectLeaseObjectType: SelectProps;
-  selectBrand: SelectProps;
-  selectModel: SelectProps;
-  selectConfiguration: SelectProps;
-  labelDepreciationGroup: TextProps;
-  cbxLeaseObjectUsed: CheckboxProps;
-  radioDeliveryTime: SegmentedProps;
-  tbxLeaseObjectCount: InputNumberProps;
-  selectLeaseObjectUseFor: SelectProps;
-  tbxLeaseObjectYear: InputNumberProps;
-  selectLeaseObjectCategory: SelectProps;
-  selectEngineType: SelectProps;
-  tbxLeaseObjectMotorPower: InputNumberProps;
-  tbxEngineVolume: InputNumberProps;
-  tbxMaxMass: InputNumberProps;
-  tbxCountSeats: InputNumberProps;
-  tbxMaxSpeed: InputNumberProps;
-  cbxWithTrailer: CheckboxProps;
-  selectDealer: SelectProps;
-  selectDealerPerson: SelectProps;
-  selectDealerRewardCondition: SelectProps;
-  tbxDealerRewardSumm: InputNumberProps;
-  selectDealerBroker: SelectProps;
-  selectDealerBrokerRewardCondition: SelectProps;
-  tbxDealerBrokerRewardSumm: InputNumberProps;
-  selectIndAgent: SelectProps;
-  selectIndAgentRewardCondition: SelectProps;
-  tbxIndAgentRewardSumm: InputNumberProps;
-  selectCalcDoubleAgent: SelectProps;
-  selectCalcDoubleAgentRewardCondition: SelectProps;
-  tbxCalcDoubleAgentRewardSumm: InputNumberProps;
-  selectCalcBroker: SelectProps;
-  selectCalcBrokerRewardCondition: SelectProps;
-  tbxCalcBrokerRewardSum: InputNumberProps;
-  selectCalcFinDepartment: SelectProps;
-  selectFinDepartmentRewardCondtion: SelectProps;
-  tbxFinDepartmentRewardSumm: InputNumberProps;
-  cbxInsDecentral: SwitchProps;
-  radioInsKaskoType: RadioProps;
-  tbxInsFranchise: InputNumberProps;
-  cbxInsUnlimitDrivers: SwitchProps;
-  tbxInsAgeDrivers: InputNumberProps;
-  tbxInsExpDrivers: InputNumberProps;
-  tbxINNForCalc: InputNumberProps;
-  selectGPSBrand: SelectProps;
-  selectGPSModel: SelectProps;
-  selectRegionRegistration: SelectProps;
-  selectTownRegistration: SelectProps;
-  radioInfuranceOPF: RadioProps;
-  selectRegistration: SelectProps;
-  selectInsNSIB: SelectProps;
-  selectRequirementTelematic: SelectProps;
-  selectTracker: SelectProps;
-  selectTelematic: SelectProps;
-  selectTechnicalCard: SelectProps;
-  cbxLastPaymentRedemption: SwitchProps;
-  cbxPriceWithDiscount: SwitchProps;
-  cbxFullPriceWithDiscount: SwitchProps;
-  cbxCostIncrease: SwitchProps;
-  cbxInsurance: SwitchProps;
-  cbxRegistrationQuote: SwitchProps;
-  cbxTechnicalCardQuote: SwitchProps;
-  cbxNSIB: SwitchProps;
-  cbxQuoteRedemptionGraph: SwitchProps;
-  cbxShowFinGAP: SwitchProps;
-  tbxQuoteName: InputProps;
-  radioQuoteContactGender: RadioProps;
-  cbxDisableChecks: SwitchProps;
-  selectTarif: SelectProps;
-  tbxCreditRate: InputNumberProps;
-  selectRate: SelectProps;
-  tbxMaxPriceChange: InputNumberProps;
-  tbxImporterRewardPerc: InputNumberProps;
-  tbxImporterRewardRub: InputNumberProps;
-  selectLead: SelectProps;
-  selectOpportunity: SelectProps;
-  selectQuote: SelectProps;
-  cbxRecalcWithRevision: CheckboxProps;
-  tbxIRR_Perc: InputNumberProps;
-  tbxMileage: InputNumberProps;
-  tbxEngineHours: InputNumberProps;
-  radioCalcType: SegmentedProps;
-  tbxTotalPayments: InputNumberProps;
-  radioObjectRegistration: RadioProps;
-  selectObjectRegionRegistration: SelectProps;
-  tbxVehicleTaxInYear: InputNumberProps;
-  tbxVehicleTaxInLeasingPeriod: InputNumberProps;
-  selectObjectCategoryTax: SelectProps;
-  selectObjectTypeTax: SelectProps;
-  radioTypePTS: RadioProps;
-  selectLegalClientRegion: SelectProps;
-  selectLegalClientTown: SelectProps;
-  selectSubsidy: SelectProps;
-  selectFuelCard: SelectProps;
-  labelSubsidySum: TextProps;
-  tbxMinPriceChange: InputNumberProps;
-
-  /** Computed Elements */
-  labelLeaseObjectRisk: TextProps;
-  tbxInsKaskoPriceLeasePeriod: InputNumberProps;
-  labelIrrInfo: TextProps;
-  labelRegistrationDescription: TextProps;
-
-  /** Result Elements */
-  labelResultTotalGraphwithNDS: TextProps;
-  labelResultPlPrice: TextProps;
-  labelResultPriceUpPr: TextProps;
-  labelResultIRRGraphPerc: TextProps;
-  labelResultIRRNominalPerc: TextProps;
-  labelResultInsKasko: TextProps;
-  labelResultInsOsago: TextProps;
-  labelResultDopProdSum: TextProps;
-  labelResultFirstPayment: TextProps;
-  labelResultLastPayment: TextProps;
-  labelResultTerm: TextProps;
-  labelResultAB_FL: TextProps;
-  labelResultAB_UL: TextProps;
-  labelResultBonusMPL: TextProps;
-  labelResultDopMPLLeasing: TextProps;
-  labelResultBonusDopProd: TextProps;
-  labelResultBonusSafeFinance: TextProps;
-  labelResultFirstPaymentRiskPolicy: TextProps;
-
-  /** Button Elements */
-  btnCreateKP: ButtonProps;
-  btnCalculate: ButtonProps;
-
-  /** Link Elements */
-  linkDownloadKp: LinkProps;
-  linkLeadUrl: LinkProps;
-  linkOpportunityUrl: LinkProps;
-  linkQuoteUrl: LinkProps;
-}

Elements/Button.tsx

@@ -1,6 +1,7 @@
 import { Button as AntButton } from 'antd';
 import type { BaseButtonProps } from 'antd/lib/button/button';
 import { throttle } from 'lodash';
+import type { FC } from 'react';
 import type { BaseElementProps } from './types';
 
 type ElementProps = {
@@ -8,7 +9,9 @@ type ElementProps = {
   text: string;
 };
 
-export default function Button({
+type ButtonProps = BaseButtonProps & Pick<ElementProps, 'text'>;
+
+export default (function Button({
   status,
   action,
   text,
@@ -28,8 +31,4 @@ export default function Button({
       {text}
     </AntButton>
   );
-}
-
-type ButtonProps = BaseButtonProps & Pick<ElementProps, 'text'>;
-
-export type { ButtonProps };
+} as FC<ButtonProps>);

Elements/Checkbox.tsx

@@ -1,6 +1,7 @@
 import type { CheckboxProps as AntCheckboxProps } from 'antd';
 import { Checkbox as AntCheckbox, Form } from 'antd';
 import type { CheckboxChangeEvent } from 'antd/lib/checkbox';
+import type { FC } from 'react';
 import type { BaseElementProps } from './types';
 
 const { Item: FormItem } = Form;
@@ -9,7 +10,9 @@ type ElementProps = {
   text: string;
 };
 
-export default function Checkbox({
+type CheckboxProps = AntCheckboxProps & ElementProps;
+
+export default (function Checkbox({
   value,
   setValue,
   status,
@@ -34,8 +37,4 @@ export default function Checkbox({
       </AntCheckbox>
     </FormItem>
   );
-}
-
-type CheckboxProps = AntCheckboxProps & ElementProps;
-
-export type { CheckboxProps };
+} as FC<CheckboxProps>);

Elements/Input.tsx

@@ -1,10 +1,11 @@
+import type { InputProps } from 'antd';
 import { Form, Input as AntInput } from 'antd';
-import type { ChangeEvent } from 'react';
+import type { ChangeEvent, FC } from 'react';
 import type { BaseElementProps } from './types';
 
 const { Item: FormItem } = Form;
 
-export default function Input({
+export default (function Input({
   value,
   setValue,
   status,
@@ -21,6 +22,4 @@ export default function Input({
       <AntInput value={value} onChange={handleChange} disabled={status === 'Disabled'} {...props} />
     </FormItem>
   );
-}
-
-export { type InputProps } from 'antd';
+} as FC<InputProps>);

Elements/InputNumber.tsx

@@ -5,6 +5,8 @@ import type { BaseElementProps } from './types';
 
 const { Item: FormItem } = Form;
 
+type InputNumberProps = AntInputNumberProps<number>;
+
 export default (function InputNumber({
   setValue,
   status,
@@ -25,7 +27,3 @@ export default (function InputNumber({
     </FormItem>
   );
 } as FC<InputNumberProps>);
-
-type InputNumberProps = AntInputNumberProps<number>;
-
-export type { InputNumberProps };

Elements/Link.tsx

@@ -1,12 +1,15 @@
 import { Button as AntButton } from 'antd';
 import type { BaseButtonProps } from 'antd/lib/button/button';
+import type { FC } from 'react';
 import type { BaseElementProps } from './types';
 
 type ElementProps = {
   text: string;
 };
 
-export default function Link({
+type LinkProps = BaseButtonProps & ElementProps;
+
+export default (function Link({
   value,
   status,
   text,
@@ -24,8 +27,4 @@ export default function Link({
       {text}
     </AntButton>
   );
-}
-
-type LinkProps = BaseButtonProps & ElementProps;
-
-export type { LinkProps };
+} as FC<LinkProps>);

Elements/Radio.tsx

@@ -1,5 +1,6 @@
 import type { RadioChangeEvent, RadioGroupProps, SpaceProps } from 'antd';
 import { Form, Radio as AntRadio, Space } from 'antd';
+import type { FC } from 'react';
 import type { BaseElementProps, BaseOption } from './types';
 
 const { Item: FormItem } = Form;
@@ -9,7 +10,11 @@ type ElementProps = BaseElementProps<string | null> & {
   spaceProps?: SpaceProps;
 };
 
-export default function Radio({
+type RadioProps = RadioGroupProps & {
+  spaceProps?: SpaceProps;
+};
+
+export default (function Radio({
   value = null,
   setValue,
   options,
@@ -41,10 +46,4 @@ export default function Radio({
       </AntRadio.Group>
     </FormItem>
   );
-}
-
-type RadioProps = RadioGroupProps & {
-  spaceProps?: SpaceProps;
-};
-
-export type { RadioProps };
+} as FC<RadioProps>);

Elements/Segmented.tsx

@@ -1,22 +1,21 @@
-import type { SpaceProps } from 'antd';
+import type { SegmentedProps } from 'antd';
 import { Form, Segmented as AntSegmented } from 'antd';
+import type { FC } from 'react';
 import type { BaseElementProps, BaseOption } from './types';
 
 const { Item: FormItem } = Form;
 
 type ElementProps = BaseElementProps<string | number> & {
   options: BaseOption[];
-  spaceProps?: SpaceProps;
 };
 
-export default function Segmented({
+export default (function Segmented({
   value,
   setValue,
   options,
   status,
   isValid,
   help,
-  spaceProps,
   ...props
 }: ElementProps) {
   return (
@@ -30,6 +29,4 @@ export default function Segmented({
       />
     </FormItem>
   );
-}
-
-export { type SegmentedProps } from 'antd';
+} as FC<SegmentedProps>);

Elements/Select.tsx

@@ -44,5 +44,3 @@ export default (function Select({
     </FormItem>
   );
 } as FC<SelectProps>);
-
-export { type SelectProps } from 'antd';

Elements/Switch.tsx

@@ -1,9 +1,11 @@
+import type { SwitchProps } from 'antd';
 import { Form, Switch as AntSwitch } from 'antd';
+import type { FC } from 'react';
 import type { BaseElementProps } from './types';
 
 const { Item: FormItem } = Form;
 
-export default function Switch({
+export default (function Switch({
   value,
   setValue,
   status,
@@ -16,6 +18,4 @@ export default function Switch({
       <AntSwitch checked={value} onChange={setValue} disabled={status === 'Disabled'} {...props} />
     </FormItem>
   );
-}
-
-export { type SwitchProps } from 'antd';
+} as FC<SwitchProps>);

Elements/Text.tsx

@@ -1,3 +1,4 @@
+import type { FC } from 'react';
 import styled from 'styled-components';
 import type { BaseElementProps } from './types';
 
@@ -6,12 +7,10 @@ const Span = styled.span`
   font-size: 0.85rem;
 `;
 
-export default function Text({ value, ...props }: BaseElementProps<string>) {
-  return <Span {...props}>{value}</Span>;
-}
-
 type TextProps = {
   middleware: (value: any) => string;
 };
 
-export type { TextProps };
+export default (function Text({ value, ...props }: BaseElementProps<string> & TextProps) {
+  return <Span {...props}>{value}</Span>;
+} as FC<TextProps>);

Elements/Tooltip.js

@@ -1,3 +1,3 @@
-import { Tooltip } from 'antd';
-
-export default Tooltip;
+/* eslint-disable unicorn/filename-case */
+/* eslint-disable no-restricted-exports */
+export { Tooltip as default } from 'antd';