@redneckz/wildless-cms-uni-blocks 0.14.875 → 0.14.877

package/src/ui-kit/FormField/NameFieldDef.ts

@@ -7,6 +7,7 @@ type NameFieldApplicationDef =
   | 'fullName'
   | 'inn'
   | 'comment'
+  | 'fullRegion'
   | 'region'
   | 'addressBranch'
   | 'typeForm'
@@ -37,6 +38,9 @@ type NameFieldApplicationDef =
   | 'representativeName'
   | 'regionBranch'
   | 'consentToReceiveMaterials'
-  | 'consentDataProcessing';
+  | 'consentDataProcessing'
+  | 'partnerSymbolCode'
+  | 'innDadata'
+  | 'companyNameByInn';
 
 export type NameFieldDef = NameFieldApplicationDef;

package/src/ui-kit/FormField/getField.tsx

@@ -13,10 +13,13 @@ import { BankEmpoleeField } from './Fields/BankEmpoleeField';
 import { BirthdayField } from './Fields/BirthdayField';
 import { CollectionCountField } from './Fields/CollectionCountField';
 import { CommentField } from './Fields/CommentField';
+import { CompanyNameByInnField } from './Fields/CompanyNameByInnField';
 import { DesiredMeetingDateField } from './Fields/DesiredMeetingDateField';
 import { EmailField } from './Fields/EmailField';
 import { FeedbackMethodField } from './Fields/FeedbackMethodField';
 import { FullNameField } from './Fields/FullNameField';
+import { FullRegionField } from './Fields/FullRegionField';
+import { InnDadataField } from './Fields/InnDadataField';
 import { InnField } from './Fields/InnField';
 import { IsClientField } from './Fields/IsClientField';
 import { LocalitiesField } from './Fields/LocalitiesField';
@@ -24,11 +27,11 @@ import { MiddleNameField } from './Fields/MiddleNameField';
 import { NameField } from './Fields/NameField';
 import { OnlineCheckoutField } from './Fields/OnlineCheckoutField';
 import { PartnerCommentsField } from './Fields/PartnerCommentsField';
+import { PartnerSymbolCodeField } from './Fields/PartnerSymbolCodeField';
 import { PhoneField } from './Fields/PhoneField';
 import { PosTerminalField } from './Fields/PosTerminalField';
 import { ProductField } from './Fields/ProductField';
 import { RegionField } from './Fields/RegionField';
-import { RegionPremiumField } from './Fields/RegionPremiumField';
 import { RepresentativeNameField } from './Fields/RepresentativeNameField';
 import { SecondaryPhoneField } from './Fields/SecondaryPhoneField';
 import { ServiceDirectionField } from './Fields/ServiceDirectionField';
@@ -46,6 +49,10 @@ const PRODUCT_REF = {
   $ref: '/wcms-resources/outservice-productlist.json',
 };
 
+const AGENTS_REF = {
+  $ref: '/wcms-resources/agenty-dlya-rko.json',
+};
+
 const InputsMap = {
   fullName: FullNameField,
   addressBranch: AddressBranchField,
@@ -70,7 +77,7 @@ const InputsMap = {
   applicationDate: ApplicationDateField,
   region: (props: CustomFieldProps) =>
     getPremium(props?.params?.typeForm as FormTypeFieldDef) ? (
-      <RegionPremiumField {...props} />
+      <FullRegionField {...props} />
     ) : (
       <RegionField {...props} />
     ),
@@ -87,6 +94,12 @@ const InputsMap = {
   email: EmailField,
   inn: InnField,
   comment: CommentField,
+  fullRegion: FullRegionField,
+  partnerSymbolCode: (props: CustomFieldProps) => (
+    <PartnerSymbolCodeField {...props} source={AGENTS_REF} />
+  ),
+  innDadata: InnDadataField,
+  companyNameByInn: CompanyNameByInnField,
 };
 
 export const getField =

package/src/ui-kit/FormField/getObjectValidator.tsx

@@ -6,6 +6,7 @@ import {
   defaultSelectValidator,
   defaultValidator,
   emailValidator,
+  innDadataValidator,
   innValidator,
   nameValidator,
   phoneValidator,
@@ -40,6 +41,9 @@ export const validatorObj: Record<string, Validator> = {
   typeForm: defaultValidator(),
   consentToReceiveMaterials: agreementValidator,
   consentDataProcessing: agreementValidator,
+  partnerSymbolCode: defaultValidator(),
+  innDadata: innDadataValidator('Укажите ИНН'),
+  companyNameByInn: defaultValidator(),
 };
 
 export const getFormValidator = <FormState extends Record<string, any>, F extends BaseFieldDef>(

package/src/ui-kit/FormField/inputColumnStyle.tsx

@@ -1,4 +1,4 @@
 import { type ColumnsCount } from '../../model/ColumnCount';
 
 export const inputColumnStyles = (column: ColumnsCount | undefined) =>
-  column === 2 ? '@xl:grid-cols-2' : '';
+  column === 2 ? '@xl:grid-cols-2' : '@xl:grid-cols-1 gap-x-0';

package/src/ui-kit/FormField/validators.ts

@@ -2,6 +2,12 @@ import { isCyrillic } from '../../utils/isCyrilic';
 import { required } from '../../validation/required';
 import { validator } from '../../validation/validator';
 
+interface DadataItem {
+  text?: string;
+  key?: string;
+  innDaData?: any;
+}
+
 const ERROR_MESSAGE = 'Некорректно заполненное поле';
 
 export const defaultValidator = (errorMsg?: string) => required(errorMsg ?? ERROR_MESSAGE);
@@ -15,7 +21,10 @@ export const nameValidator = (errorMsg?: string) =>
   );
 
 export const innValidator = (errorMsg: string) =>
-  validator((_) => typeof _ === 'string' && (_.length === 10 || _.length === 12))(errorMsg);
+  validator((_: string) => isValidInnLength(_))(errorMsg);
+
+export const innDadataValidator = (errorMsg: string) =>
+  validator((_: DadataItem) => Boolean(_?.text) && isValidInnLength(_.text))(errorMsg);
 
 const phoneValidate = (email: string) =>
   /^(\+7)?[\s-]?\(?[0-9]{3}\)?[\s-]?[0-9]{3}[\s-]?[0-9]{2}[\s-]?[0-9]{2}$/.test(email);
@@ -33,3 +42,6 @@ const emailValidate = (email: string) => /^[^\s@]+@[^\s@]+\.[a-zA-Z]{2,4}$/.test
 
 export const emailValidator = (errorMsg: string) =>
   validator((_: string) => emailValidate(_))(errorMsg);
+
+const isValidInnLength = (value: string | undefined): boolean =>
+  typeof value === 'string' && (value.length === 10 || value.length === 12);

package/src/ui-kit/Select/Option.ts

@@ -1,5 +1,11 @@
 import type { TextProps } from '../../model/HeadlineType';
 
+type companyData = {
+  companyName?: string;
+  companyAddress?: string;
+};
+
 export type Option = TextProps & {
   key: string;
+  innDaData?: companyData;
 };

package/src/ui-kit/Select/Select.tsx

@@ -1,9 +1,10 @@
 import { JSX } from '@redneckz/uni-jsx';
-import { useCallback, useState } from '@redneckz/uni-jsx/lib/hooks';
+import { useCallback, useMemo, useState } from '@redneckz/uni-jsx/lib/hooks';
 import { useBool } from '@redneckz/uni-jsx/lib/hooks/useBool';
 import { type ControlProps } from '../../model/ControlProps';
 import { type DefaultControlType } from '../../model/DefaultControlType';
 import { type IconVersion } from '../../model/IconVersion';
+import { debounce } from '../../utils/debounce';
 import { style } from '../../utils/style';
 import { Icon } from '../Icon/Icon';
 import { Input } from '../Input/Input';
@@ -17,9 +18,18 @@ export interface SelectProps extends DefaultControlType, ControlProps<Option> {
   valid?: boolean;
   isBorder?: boolean;
   isSearch?: boolean;
+  isManualInput?: boolean;
   iconVersion?: IconVersion;
+  onSearchQuery?: (value: string) => void;
 }
 
+type renderOptionTextProps = {
+  isManualInput?: boolean;
+  query?: string;
+  value?: Option;
+  placeholder?: string;
+};
+
 export const Select = JSX<SelectProps>(
   ({
     className,
@@ -30,15 +40,23 @@ export const Select = JSX<SelectProps>(
     isBorder = true,
     placeholder = '',
     isSearch = false,
+    isManualInput = false,
     disabled = false,
     iconVersion = 'black',
     onChange,
+    onSearchQuery,
   }) => {
     const [isOpen, { setFalse: close, setTrue: open }] = useBool();
     const [query, setQuery] = useState('');
-    const isDisabled = getDisabled(disabled, options.length);
+    const isDisabled = getDisabled(disabled, options.length, isManualInput);
+    const isIconHidden = getIconHidden(isManualInput, options);
     const hasOpen = isOpen && !isDisabled;
 
+    const debouncedOnSearchQuery = useMemo(
+      () => onSearchQuery && getDebouncedSearchQuery(onSearchQuery),
+      [onSearchQuery],
+    );
+
     const handleOpen = useCallback(() => {
       if (isDisabled) {
         return;
@@ -47,8 +65,14 @@ export const Select = JSX<SelectProps>(
       open();
     }, [isDisabled]);
 
+    const handleChangeQuery = (newQuery: string) => {
+      setQuery(newQuery);
+      setOption(newQuery, onChange);
+      debouncedOnSearchQuery && debouncedOnSearchQuery(newQuery);
+    };
+
     const handleClose = useCallback(() => {
-      setQuery('');
+      !isManualInput && setQuery('');
       close();
     }, []);
 
@@ -60,6 +84,7 @@ export const Select = JSX<SelectProps>(
       onChange,
       onClose: handleClose,
       iconVersion,
+      onChangeQuery: setQuery,
     });
 
     return (
@@ -73,26 +98,43 @@ export const Select = JSX<SelectProps>(
             )}
             onClick={hasOpen ? handleClose : handleOpen}
           >
-            <p className="line-clamp-2 text-ellipsis">{formatOption(value) || placeholder}</p>
-            {renderIcon(hasOpen, iconVersion)}
+            <p className="line-clamp-2 text-ellipsis">
+              {useRenderOptionText({ isManualInput, query, value, placeholder })}
+            </p>
+            {isIconHidden ? '' : renderIcon(hasOpen, iconVersion)}
           </div>
-          {isSearch && hasOpen ? (
-            <div className={style('absolute top-0 w-full z-20')}>
-              <Input
-                type="text"
-                value={query}
-                autoFocus
-                disabled={isDisabled}
-                onChange={setQuery}
-              />
-            </div>
-          ) : null}
+          {isSearch && hasOpen ? renderSearchInput(query, isDisabled, handleChangeQuery) : null}
         </div>
       </div>
     );
   },
 );
 
+const useRenderOptionText = (data: renderOptionTextProps) =>
+  useMemo(() => {
+    if (data.isManualInput && data.query) {
+      return data.query;
+    }
+
+    return formatOption(data.value) || data.placeholder;
+  }, [data.isManualInput, data.query, data.value, data.placeholder]);
+
+const renderSearchInput = (
+  query: string,
+  isDisabled: boolean,
+  onChangeQuery: (value: string) => void,
+) => (
+  <div className={style('absolute top-0 w-full z-20')}>
+    <Input
+      type="text"
+      value={query}
+      autoFocus
+      disabled={isDisabled}
+      onChange={(value) => onChangeQuery(value)}
+    />
+  </div>
+);
+
 const renderIcon = (isOpen: boolean, iconVersion?: IconVersion) => (
   <Icon
     className={style('absolute right-0 flex self-center', { 'rotate-180': !isOpen })}
@@ -111,4 +153,16 @@ const getStyle = (isBorder: boolean, valid: boolean, disabled: boolean) =>
     valid ? 'border-gray' : 'border-error',
   );
 
-const getDisabled = (disabled: boolean, length: number) => disabled || length === 0;
+// TODO Нужен рефактор и декомпозиция компонента getDisabled, setOption, getIconHidden
+const getDisabled = (disabled: boolean, length: number, isManualInput: boolean) =>
+  disabled || (!isManualInput && length === 0);
+
+const setOption = (query: string, onChange?: (data: Option) => void) => {
+  onChange && query.trim() !== '' && onChange({ key: query, text: query, innDaData: {} });
+};
+
+const getIconHidden = (isManualInput: boolean, options: Option[]) =>
+  isManualInput && !options.length;
+
+const getDebouncedSearchQuery = (onSearchQuery: (value: string) => void) =>
+  debounce((searchValue: string) => onSearchQuery(searchValue), 300);

package/src/ui-kit/Select/SelectPopup.tsx

@@ -3,6 +3,7 @@ import { type ControlProps } from '../../model/ControlProps';
 import { type IconVersion } from '../../model/IconVersion';
 import { style } from '../../utils/style';
 import { Icon } from '../Icon/Icon';
+import { Text } from '../Text/Text';
 import { filterOptions } from './filterOptions';
 import { formatOption } from './formatOption';
 import { type Option } from './Option';
@@ -12,10 +13,11 @@ export interface SelectPopupProps extends ControlProps<Option> {
   options?: Option[];
   popupRef?: { current: HTMLDivElement | null };
   query?: string;
+  onChangeQuery?: (value: string) => void;
 }
 
 export const SelectPopup = JSX<SelectPopupProps>(
-  ({ popupRef, options, value, query, onChange, iconVersion }) =>
+  ({ popupRef, options, value, query, onChange, iconVersion, onChangeQuery }) =>
     options?.length ? (
       <div
         className="bg-white text-l max-h-64 overflow-y-auto overflow-x-hidden rounded-md shadow-2xl"
@@ -31,11 +33,27 @@ export const SelectPopup = JSX<SelectPopupProps>(
             onClick={(e) => {
               e.stopPropagation();
               if (onChange) {
+                onChangeQuery?.('');
                 onChange(option);
               }
             }}
           >
-            <span className="min-h-6">{formatOption(option)}</span>
+            {option?.innDaData ? (
+              <span>
+                <Text size="text-s">{option?.innDaData?.companyName}</Text>
+                <div className="space-x-2">
+                  <Text size="text-s" font="font-light">
+                    {formatOption(option)}
+                  </Text>
+                  <Text size="text-s" font="font-light">
+                    {option?.innDaData?.companyAddress}
+                  </Text>
+                </div>
+              </span>
+            ) : (
+              <span className="min-h-6">{formatOption(option)}</span>
+            )}
+
             <Icon
               name="DoneSimpleIcon"
               width="16"

package/src/ui-kit/Select/useSelectPopup.tsx

@@ -7,6 +7,7 @@ import { SelectPopup, type SelectPopupProps } from './SelectPopup';
 
 interface SelectPopupOptions extends SelectPopupProps, OnCloseProps {
   isOpen?: boolean;
+  onChangeQuery?: (value: string) => void;
 }
 
 export function useSelectPopup({
@@ -17,6 +18,7 @@ export function useSelectPopup({
   onChange,
   onClose,
   iconVersion,
+  onChangeQuery,
 }: SelectPopupOptions) {
   const popup = usePopupManager();
 
@@ -29,6 +31,7 @@ export function useSelectPopup({
     (option: Option) => {
       close();
       onChange && onChange(option);
+      onChangeQuery && onChangeQuery('');
     },
     [close, onChange],
   );
@@ -53,6 +56,7 @@ export function useSelectPopup({
           query={query}
           onChange={handleChange}
           iconVersion={iconVersion}
+          onChangeQuery={onChangeQuery}
         />
       ),
       top: top + window.scrollY + height,

package/bundle/ui-kit/FormField/Fields/RegionPremiumField.d.ts

@@ -1,2 +0,0 @@
-import { type CustomFieldProps } from '../CustomFieldProps';
-export declare const RegionPremiumField: import("@redneckz/uni-jsx").UNIComponent<CustomFieldProps, any, any>;

package/dist/ui-kit/FormField/Fields/RegionPremiumField.d.ts

@@ -1,2 +0,0 @@
-import { type CustomFieldProps } from '../CustomFieldProps';
-export declare const RegionPremiumField: import("@redneckz/uni-jsx").UNIComponent<CustomFieldProps, any, any>;

package/dist/ui-kit/FormField/Fields/RegionPremiumField.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RegionPremiumField.js","sourceRoot":"","sources":["../../../../src/ui-kit/FormField/Fields/RegionPremiumField.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AACxC,uDAAsD;AACtD,8EAA2E;AAE3E,8DAA2D;AAG9C,QAAA,kBAAkB,GAAG,IAAA,aAAG,EAAmB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3E,MAAM,eAAe,GAAG,IAAA,2CAAoB,EAAC,IAAI,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAA,eAAO,EACrB,GAAG,EAAE,CACH,eAAe,EAAE,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;QACpC,GAAG,EAAE,MAAM;QACX,IAAI,EAAE,MAAM;KACb,CAAC,CAAC,EACL,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,OAAO,CACL,uBAAC,6BAAa,IACZ,KAAK,EAAC,sCAAQ,EACd,WAAW,EAAC,uFAAiB,EAC7B,OAAO,EAAE,OAAmB,KACxB,KAAK,CAAC,KAAK,EAAE,IAAI,IAAI,EAAE,CAAC,GAC5B,CACH,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/lib/ui-kit/FormField/Fields/RegionPremiumField.d.ts

@@ -1,2 +0,0 @@
-import { type CustomFieldProps } from '../CustomFieldProps';
-export declare const RegionPremiumField: import("@redneckz/uni-jsx").UNIComponent<CustomFieldProps, any, any>;

package/lib/ui-kit/FormField/Fields/RegionPremiumField.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RegionPremiumField.js","sourceRoot":"","sources":["../../../../src/ui-kit/FormField/Fields/RegionPremiumField.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAE3E,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAG3D,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,CAAmB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3E,MAAM,eAAe,GAAG,oBAAoB,CAAC,IAAI,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CACH,eAAe,EAAE,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;QACpC,GAAG,EAAE,MAAM;QACX,IAAI,EAAE,MAAM;KACb,CAAC,CAAC,EACL,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,OAAO,CACL,KAAC,aAAa,IACZ,KAAK,EAAC,sCAAQ,EACd,WAAW,EAAC,uFAAiB,EAC7B,OAAO,EAAE,OAAmB,KACxB,KAAK,CAAC,KAAK,EAAE,IAAI,IAAI,EAAE,CAAC,GAC5B,CACH,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/mobile/bundle/ui-kit/FormField/Fields/RegionPremiumField.d.ts

@@ -1,2 +0,0 @@
-import { type CustomFieldProps } from '../CustomFieldProps';
-export declare const RegionPremiumField: import("@redneckz/uni-jsx").UNIComponent<CustomFieldProps, any, any>;

package/mobile/dist/ui-kit/FormField/Fields/RegionPremiumField.d.ts

@@ -1,2 +0,0 @@
-import { type CustomFieldProps } from '../CustomFieldProps';
-export declare const RegionPremiumField: import("@redneckz/uni-jsx").UNIComponent<CustomFieldProps, any, any>;

package/mobile/dist/ui-kit/FormField/Fields/RegionPremiumField.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RegionPremiumField.js","sourceRoot":"","sources":["../../../../src/ui-kit/FormField/Fields/RegionPremiumField.tsx"],"names":[],"mappings":";;;AAAA,+CAAwC;AACxC,uDAAsD;AACtD,8EAA2E;AAE3E,8DAA2D;AAG9C,QAAA,kBAAkB,GAAG,IAAA,aAAG,EAAmB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3E,MAAM,eAAe,GAAG,IAAA,2CAAoB,EAAC,IAAI,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAA,eAAO,EACrB,GAAG,EAAE,CACH,eAAe,EAAE,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;QACpC,GAAG,EAAE,MAAM;QACX,IAAI,EAAE,MAAM;KACb,CAAC,CAAC,EACL,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,OAAO,CACL,uBAAC,6BAAa,IACZ,KAAK,EAAC,sCAAQ,EACd,WAAW,EAAC,uFAAiB,EAC7B,OAAO,EAAE,OAAmB,KACxB,KAAK,CAAC,KAAK,EAAE,IAAI,IAAI,EAAE,CAAC,GAC5B,CACH,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/mobile/lib/ui-kit/FormField/Fields/RegionPremiumField.d.ts

@@ -1,2 +0,0 @@
-import { type CustomFieldProps } from '../CustomFieldProps';
-export declare const RegionPremiumField: import("@redneckz/uni-jsx").UNIComponent<CustomFieldProps, any, any>;

package/mobile/lib/ui-kit/FormField/Fields/RegionPremiumField.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RegionPremiumField.js","sourceRoot":"","sources":["../../../../src/ui-kit/FormField/Fields/RegionPremiumField.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,qCAAqC,CAAC;AAE3E,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAG3D,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,CAAmB,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE;IAC3E,MAAM,eAAe,GAAG,oBAAoB,CAAC,IAAI,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CACH,eAAe,EAAE,GAAG,CAAC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;QACpC,GAAG,EAAE,MAAM;QACX,IAAI,EAAE,MAAM;KACb,CAAC,CAAC,EACL,CAAC,eAAe,CAAC,CAClB,CAAC;IAEF,OAAO,CACL,KAAC,aAAa,IACZ,KAAK,EAAC,sCAAQ,EACd,WAAW,EAAC,uFAAiB,EAC7B,OAAO,EAAE,OAAmB,KACxB,KAAK,CAAC,KAAK,EAAE,IAAI,IAAI,EAAE,CAAC,GAC5B,CACH,CAAC;AACJ,CAAC,CAAC,CAAC"}