@redneckz/wildless-cms-uni-blocks 0.13.7 → 0.13.9

package/src/components/Calculator/renderRate.tsx

@@ -1,18 +1,25 @@
-import { UnknownRate } from './UnknownRate';
-import { Rate } from './Rate';
 import { CalculatorValueBlock } from './CalculatorValueBlock';
+import { Rate } from './Rate';
+import { UnknownRate } from './UnknownRate';
 
 interface RenderRateProps {
   rate: number;
   depositeName?: string;
-  isShowUnknownRate?: boolean;
+  isUnavailableByTerm?: boolean;
   isShowDepositeName?: boolean;
+  fractionDigits?: number;
 }
 
-const renderDesktopRate = ({ rate, depositeName, isShowDepositeName }: RenderRateProps) => (
+const renderDesktopRate = ({
+  rate,
+  depositeName,
+  fractionDigits,
+  isShowDepositeName,
+}: RenderRateProps) => (
   <Rate
     rate={rate}
     depositeName={depositeName}
+    fractionDigits={fractionDigits}
     isShowDepositeName={isShowDepositeName}
     rateBlockClassName="tracking-[-25px]"
     unit="%"
@@ -24,8 +31,8 @@ const renderMobileRate = ({ rate }: RenderRateProps) => (
 );
 
 export const renderRate = (props: RenderRateProps) => {
-  if (props.isShowUnknownRate) {
-    return <UnknownRate />;
+  if (props.rate === 0) {
+    return <UnknownRate isUnavailableByTerm={props.isUnavailableByTerm} />;
   }
 
   return (

package/src/components/Calculator/useBusinessDepositCalculatorParams.ts

@@ -34,7 +34,7 @@ export interface BusinessDepositCalculatorParams
   income?: number;
   finalSum?: number;
   isDisabledOperatingDeposit?: boolean;
-  isShowUnknownRate?: boolean;
+  isUnavailableByTerm?: boolean;
 }
 
 export type BusinessDepositCalculatorData = {
@@ -66,7 +66,7 @@ export const useBusinessDepositCalculatorParams = (
       ...DEFAULT_BUSINESS_DEPOSIT_CALCULATOR_PARAMS,
       ...userInputParams,
       isDisabledOperatingDeposit,
-      isShowUnknownRate: true,
+      isUnavailableByTerm: true,
     };
   }
   const businessDepositCalculatorSourceBookParams =

package/src/components/Calculator/useCreditCalculatorParams.ts

@@ -1,5 +1,4 @@
 import { useMemo } from '@redneckz/uni-jsx/lib/hooks';
-import { clamp } from '../../utils/clamp';
 import type { CreditCalculatorParamsViewSettings } from './CalculatorContent';
 import { CREDIT_CALC_DEFAULT_DIR, DEFAULT_CREDIT_CALCULATOR_PARAMS } from './constants';
 import { getCreditCalculatorLimitParams } from './getCreditCalculatorLimitParams';
@@ -51,7 +50,7 @@ export const useCreditCalculatorParams = (
   sourceBookDir?: string,
   paramsViewSettings?: CreditCalculatorParamsViewSettings,
 ): CreditCalculatorParams => {
-  let { moneyValue, monthsValue } = userInputParams;
+  const { moneyValue, monthsValue } = userInputParams;
   const data = useCalculatorParams<CreditCalculatorData>(sourceBookDir || CREDIT_CALC_DEFAULT_DIR);
   const rateRows = data?.rateRows || [DEFAULT_CREDIT_CALCULATOR_PARAMS];
   const limitRows = data?.limitRows || [];
@@ -72,9 +71,6 @@ export const useCreditCalculatorParams = (
     rateRows,
   );
 
-  moneyValue = clamp(moneyValue, minSum, maxSum);
-  monthsValue = clamp(monthsValue, minMonths, maxMonths);
-
   const creditCalculatorRateParams = getCreditCalculatorRateParams({
     rateRows,
     userInputParams,

package/src/components/Calculator/useRefinancingCalculatorParams.ts

@@ -1,12 +1,11 @@
 import { useMemo } from '@redneckz/uni-jsx/lib/hooks';
-import { clamp } from '../../utils/clamp';
-import { DEFAULT_REFINANCING_CALCULATOR_PARAMS, REFINANCING_CALC_DEFAULT_DIR } from './constants';
-import { getLimitRangeByKeys } from './rangeHelpers';
-import { useCalculatorParams } from './useCalculatorParams';
 import { RefinancingCalculatorParamsViewSettings } from './CalculatorContent';
+import { DEFAULT_REFINANCING_CALCULATOR_PARAMS, REFINANCING_CALC_DEFAULT_DIR } from './constants';
+import { getMonthlyPayment } from './getMonthlyPayment';
 import { getRefinancingCalculatorLimitParams } from './getRefinancingCalculatorLimitParams';
 import { getRefinancingCalculatorRateParams } from './getRefinancingCalculatorRateParams';
-import { getMonthlyPayment } from './getMonthlyPayment';
+import { getLimitRangeByKeys } from './rangeHelpers';
+import { useCalculatorParams } from './useCalculatorParams';
 
 export interface CommonRefinancingParams {
   isSalaryClient: boolean;
@@ -61,7 +60,7 @@ export const useRefinancingCalculatorParams = (
   sourceBookDir?: string,
   paramsViewSettings?: RefinancingCalculatorParamsViewSettings,
 ): RefinancingCalculatorParams => {
-  let { moneyValue, monthsValue, oldMonthlyPayment, moneyExtra } = userInputParams;
+  const { moneyValue, monthsValue, oldMonthlyPayment, moneyExtra } = userInputParams;
   const data = useCalculatorParams<RefinancingCalculatorData>(
     sourceBookDir || REFINANCING_CALC_DEFAULT_DIR,
   );
@@ -79,29 +78,12 @@ export const useRefinancingCalculatorParams = (
     rateRows,
   );
 
-  const { minSumOld, maxSumOld } = getLimitRangeByKeys(
-    ['minSumOld', 'maxSumOld'],
-    sourceBookLimitParams,
-    rateRows,
-  );
-
-  const { minSumExtra, maxSumExtra } = getLimitRangeByKeys(
-    ['minSumExtra', 'maxSumExtra'],
-    sourceBookLimitParams,
-    rateRows,
-  );
-
   const { minMonths, maxMonths } = getLimitRangeByKeys(
     ['minMonths', 'maxMonths'],
     sourceBookLimitParams,
     rateRows,
   );
 
-  moneyValue = clamp(moneyValue, minSum, maxSum);
-  oldMonthlyPayment = clamp(oldMonthlyPayment, minSumOld, maxSumOld);
-  moneyExtra = clamp(moneyExtra, minSumExtra, maxSumExtra);
-  monthsValue = clamp(monthsValue, minMonths, maxMonths);
-
   const refinancingCalculatorSourceBookRateParams = getRefinancingCalculatorRateParams({
     rateRows,
     userInputParams,

package/src/components/Carousel/CarouselContent.ts

@@ -2,9 +2,9 @@ import type { UniBlockContent } from '../../model/JSXBlock';
 
 /**
  * @title Размер карточек
- * @enumNames ["Нормальный", "Большой"]
+ * @enumNames ["Маленький", "Нормальный", "Большой"]
  */
-export type CardSizeMode = 'normal' | 'big';
+export type CardSizeMode = 'small' | 'normal' | 'big';
 
 /**
  * @title Карусель

package/src/components/Carousel/renderCarouselCards.tsx

@@ -10,6 +10,7 @@ import type { CardSizeMode } from './CarouselContent';
 const cardBaseStyle = 'relative h-full';
 
 const CARD_SIZE_MAP: Record<CardSizeMode, string> = {
+  small: 'sm:min-w-64',
   normal: 'sm:min-w-96',
   big: 'sm:min-w-[515px]',
 };

package/src/components/DepositFiltration/DepositFiltration.example.json

@@ -30,7 +30,17 @@
       },
       "sum": {
         "title": "Сумма",
-        "type": "number"
+        "type": "object",
+        "properties": {
+          "min": {
+            "title": "Минимум",
+            "type": "number"
+          },
+          "max": {
+            "title": "Максимум",
+            "type": "number"
+          }
+        }
       },
       "period": {
         "title": "Срок",

package/src/components/DepositFiltration/DepositFiltration.fixture.tsx

@@ -78,7 +78,17 @@ const SCHEMA: DepositFiltrationContent['filtrationSchema'] = {
   },
   sum: {
     title: 'Сумма',
-    type: 'number',
+    type: 'object',
+    properties: {
+      min: {
+        title: 'Минимум',
+        type: 'number',
+      },
+      max: {
+        title: 'Максимум',
+        type: 'number',
+      },
+    },
   },
   period: {
     title: 'Срок',
@@ -109,7 +119,7 @@ export default {
         filtrationSchema={SCHEMA}
         topItemsCount={2}
         sumInput={{ title: 'Сумма' }}
-        periodInput={{ title: 'Срок, месяцев', min: 3, max: 36 }}
+        periodInput={{ title: 'Срок, месяцев', min: 3, max: 60 }}
         resetButton={{ text: 'Очистить фильтры', version: 'secondary' }}
         notFound={{
           title: 'Нет подходящей программы',
@@ -125,7 +135,7 @@ export default {
               OPTIONS_PENSIONER,
               PERCENTS_IN_THE_END,
               {
-                sum: 5000,
+                sum: { min: 500, max: 5000 },
                 period: { min: 9, max: 38 },
               },
             ),
@@ -135,7 +145,10 @@ export default {
               OPTIONS_ADD,
               OPTIONS_ONLINE,
               PERCENTS_EACH_MONTH,
-              { sum: 1000, period: { min: 9, max: 38 } },
+              {
+                sum: { min: 500, max: 1000 },
+                period: { min: 9, max: 38 },
+              },
             ),
             generateBlock(
               PRODUCT_TILE,
@@ -144,7 +157,7 @@ export default {
               OPTIONS_PENSIONER,
               PERCENTS_EACH_MONTH,
               {
-                sum: 500,
+                sum: { min: 500, max: 1500 },
                 period: { min: 9, max: 38 },
               },
             ),
@@ -155,7 +168,7 @@ export default {
               OPTIONS_PENSIONER,
               PERCENTS_EACH_MONTH,
               {
-                sum: 1000,
+                sum: { min: 500, max: 1000 },
                 period: { min: 9, max: 38 },
               },
             ),
@@ -166,7 +179,7 @@ export default {
               OPTIONS_ONLINE,
               PERCENTS_IN_THE_END,
               {
-                sum: 1000,
+                sum: { min: 500, max: 1000 },
                 period: { min: 9, max: 38 },
               },
             ),
@@ -177,7 +190,7 @@ export default {
               OPTIONS_PENSIONER,
               PERCENTS_EACH_MONTH,
               {
-                sum: 1000,
+                sum: { min: 500, max: 1000 },
                 period: { min: 9, max: 38 },
               },
             ),

package/src/components/DepositFiltration/DepositFiltration.tsx

@@ -11,25 +11,28 @@ import type { DepositFiltrationContent } from './DepositFiltrationContent';
 
 interface DepositFiltrationProps extends DepositFiltrationContent, UniBlockProps {}
 
+const DEFAULT_MIN_MONTHS = 3;
+const DEFAULT_MAX_MONTHS = 60;
+
+const DEFAULT_MIN_SUM = 500;
+const DEFAULT_MAX_SUM = 1000000000;
+
 const initialFiltrationState = {
-  sum: 500,
+  sum: {
+    min: 10000,
+    max: DEFAULT_MAX_SUM,
+  },
   period: {
     min: 3,
     max: 36,
   },
 };
 
-const DEFAULT_MIN_MONTHS = 3;
-const DEFAULT_MAX_MONTHS = 36;
-
-const DEFAULT_MIN_SUM = 500;
-const DEFAULT_MAX_SUM = 1000000000;
-
 export const DepositFiltration: JSXBlock<DepositFiltrationProps> = JSX<DepositFiltrationProps>(
   ({ className, filtrationSchema = {}, resetButton, sumInput, periodInput, ...rest }) => {
     const [filtrationState, { field, reset }] = useForm(initialFiltrationState);
 
-    const maxValue = periodInput?.max || DEFAULT_MAX_MONTHS;
+    const maxPeriodValue = periodInput?.max || DEFAULT_MAX_MONTHS;
 
     const Inputs = (
       <div>
@@ -37,15 +40,18 @@ export const DepositFiltration: JSXBlock<DepositFiltrationProps> = JSX<DepositFi
           label={sumInput?.title}
           min={DEFAULT_MIN_SUM}
           max={DEFAULT_MAX_SUM}
-          {...field('sum', { parse: Number, format: String })}
+          {...field('sum', {
+            parse: (min) => ({ min: Number(min), max: DEFAULT_MAX_SUM }),
+            format: ({ min }) => String(min),
+          })}
         />
         <InputRange
           title={periodInput?.title}
-          items={['От 3 мес', 'До 3 лет']}
+          items={['От 3 мес', 'До 5 лет']}
           min={periodInput?.min || DEFAULT_MIN_MONTHS}
-          max={maxValue}
+          max={maxPeriodValue}
           {...field('period', {
-            parse: (min) => ({ min, max: maxValue }),
+            parse: (min) => ({ min, max: maxPeriodValue }),
             format: ({ min }) => min,
           })}
         />

package/src/components/DepositFiltration/DepositFiltrationContent.ts

@@ -1,7 +1,6 @@
 import type {
   BaseFiltrationInnerContent,
   NumberRange,
-  NumberValue,
   StringArray,
 } from '../../ui-kit/BaseFiltration/BaseFiltrationContent';
 
@@ -13,7 +12,7 @@ export type DepositFiltrationSchema = {
   /** @title Выплата процентов */
   percents?: StringArray;
   /** @hidden */
-  sum?: NumberValue;
+  sum?: NumberRange;
   /** @hidden */
   period?: NumberRange;
 };

package/src/ui-kit/InputRange/renderRangeWithTicks.tsx

@@ -20,8 +20,9 @@ export function renderRangeWithTicks({
   onChange,
 }: RangeWithTicksProps) {
   const rangeValue = list.length ? list.indexOf(value) : value;
+  const rangeValueShift = rangeValue > min ? rangeValue - min : 0;
   const inputStyle = {
-    backgroundSize: `${(((rangeValue - min) * 100) / (max - min)).toFixed(2)}% 100%`,
+    backgroundSize: `${((rangeValueShift * 100) / (max - min)).toFixed(2)}% 100%`,
   };
 
   return (