@scbt-ecom/ui 0.22.7 → 0.23.0

package/dist/shared/ui/formElements/controlled/index.d.ts

@@ -37,31 +37,37 @@ export declare const Controlled: {
         };
         helperText?: string;
     }) => import("react/jsx-runtime").JSX.Element;
-    SelectControl: <TFieldValues extends import('react-hook-form').FieldValues = import('react-hook-form').FieldValues>({ control, classes, name, rules, shouldUnregister, disabled, defaultValue, returnValue, options, helperText, size, ...props }: import('react-hook-form').UseControllerProps<TFieldValues, import('react-hook-form').Path<TFieldValues>> & Omit<import('react-select').Props<import('..').SelectItemOption, boolean>, "options" | "defaultValue" | "placeholder" | "isSearchable"> & Pick<import('..').InputBaseProps, "invalid" | "label" | "attachmentProps"> & {
+    SelectControl: <TFieldValues extends import('react-hook-form').FieldValues = import('react-hook-form').FieldValues>({ control, classes, name, rules, shouldUnregister, disabled, defaultValue, returnValue, options, helperText, size, ...props }: import('react-hook-form').UseControllerProps<TFieldValues, import('react-hook-form').Path<TFieldValues>> & Omit<import('@headlessui/react').ComboboxProps<import('..').SelectItemOption, boolean, "li">, "onChange" | "className" | "multiple" | "by" | "virtual"> & {
+        label: string;
+        isMulti: boolean;
+        invalid?: boolean;
         isSearchable?: boolean;
-        returnValue?: (option: import('..').SelectItemOption) => string;
-        displayValue?: (option: import('..').SelectItemOption) => string;
+        options: import('..').SelectItemOption[];
         classes?: {
-            container?: string;
-            control?: import('../uncontrolled/select/ui').ControlClasses;
-            option?: import('../uncontrolled/select/ui').SelectItemClasses;
-            list?: import('../uncontrolled/select/ui').SelectListClasses;
+            item?: string;
+            helperText?: string;
+        } & {
+            root?: string;
+            list?: string;
         };
-        options: import('..').SelectItemOption[];
-        filterOptionDisabled?: boolean;
+        displayValue?: (option: import('..').SelectItemOption) => string;
+        onChange?: (value: import('..').SelectItemOption | import('..').SelectItemOption[] | null) => void;
+        attachmentProps?: import('../../../types').DeepPartial<import('../ui').IFieldAttachmentProps>;
     } & {
         control: import('react-hook-form').Control<TFieldValues>;
         classes?: {
-            container?: string;
-            control?: import('../uncontrolled/select/ui').ControlClasses;
-            option?: import('../uncontrolled/select/ui').SelectItemClasses;
-            list?: import('../uncontrolled/select/ui').SelectListClasses;
+            item?: string;
+            helperText?: string;
+        } & {
+            root?: string;
+            list?: string;
         } & {
             container?: string;
             message?: string;
         };
         helperText?: string;
         size?: import('../ui').TFieldContainerConfig["size"];
+        returnValue?: (option: import('..').SelectItemOption) => string;
     }) => import("react/jsx-runtime").JSX.Element;
     SwitchControl: <TFieldValues extends import('react-hook-form').FieldValues = import('react-hook-form').FieldValues>({ classes, className, control, name, rules, defaultValue, disabled, shouldUnregister, children, helperText, tooltip, popoverProps, ...props }: import('./switch/SwitchControl').SwitchControlProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
     RadioGroupControl: <TFieldValues extends import('react-hook-form').FieldValues = import('react-hook-form').FieldValues>({ classes, className, control, name, rules, shouldUnregister, disabled, defaultValue, helperText, label, ...props }: import('react-hook-form').UseControllerProps<TFieldValues, import('react-hook-form').Path<TFieldValues>> & Omit<import('..').RadioGroupBaseProps, "classes"> & {

package/dist/shared/ui/formElements/controlled/select/SelectControl.d.ts

@@ -1,11 +1,11 @@
 import { Control, FieldPath, FieldValues, UseControllerProps } from 'react-hook-form';
-import { SelectBaseProps } from '../../..';
+import { SelectBaseProps, SelectItemOption } from '../../..';
 import { TFieldContainerConfig } from '../../ui';
-type SelectControlClasses = SelectBaseProps['classes'] & {
+type SelectControlClasses = SelectBaseProps<boolean>['classes'] & {
     container?: string;
     message?: string;
 };
-type SelectControlProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = UseControllerProps<TFieldValues, TName> & SelectBaseProps & {
+type SelectControlProps<TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = UseControllerProps<TFieldValues, TName> & SelectBaseProps<boolean> & {
     /**
      * Контрол объект для управления полем
      */
@@ -22,6 +22,10 @@ type SelectControlProps<TFieldValues extends FieldValues = FieldValues, TName ex
      * Размер контейнера для поля
      */
     size?: TFieldContainerConfig['size'];
+    /**
+     * Функция для управления возвращаемым значением
+     */
+    returnValue?: (option: SelectItemOption) => string;
 };
 declare const InnerComponent: <TFieldValues extends FieldValues = FieldValues>({ control, classes, name, rules, shouldUnregister, disabled, defaultValue, returnValue, options, helperText, size, ...props }: SelectControlProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
 export declare const SelectControl: typeof InnerComponent;

package/dist/shared/ui/formElements/uncontrolled/index.d.ts

@@ -30,19 +30,23 @@ export declare const Uncontrolled: {
         mask: "datetime" | "email" | "numeric" | "currency" | "decimal" | "integer" | "percentage" | "url" | "ip" | "mac" | "ssn" | "brl-currency" | "cpf" | "cnpj" | (string & {}) | (string[] & {}) | null;
         externalMaskDefinitions?: Record<string, import('./maskInput/MaskInput').Definition>;
     } & import('react').RefAttributes<HTMLInputElement>>;
-    SelectBase: import('react').ForwardRefExoticComponent<Omit<import('react-select').Props<import('./select').SelectItemOption, boolean>, "options" | "defaultValue" | "placeholder" | "isSearchable"> & Pick<import('./input').InputBaseProps, "invalid" | "label" | "attachmentProps"> & {
+    SelectBase: import('react').ForwardRefExoticComponent<Omit<import('@headlessui/react').ComboboxProps<import('./select').SelectItemOption, boolean, "li">, "onChange" | "className" | "multiple" | "by" | "virtual"> & {
+        label: string;
+        isMulti: boolean;
+        invalid?: boolean;
         isSearchable?: boolean;
-        returnValue?: (option: import('./select').SelectItemOption) => string;
-        displayValue?: (option: import('./select').SelectItemOption) => string;
+        options: import('./select').SelectItemOption[];
         classes?: {
-            container?: string;
-            control?: import('./select/ui').ControlClasses;
-            option?: import('./select/ui').SelectItemClasses;
-            list?: import('./select/ui').SelectListClasses;
+            item?: string;
+            helperText?: string;
+        } & {
+            root?: string;
+            list?: string;
         };
-        options: import('./select').SelectItemOption[];
-        filterOptionDisabled?: boolean;
-    } & import('react').RefAttributes<import('node_modules/react-select/dist/declarations/src/Select').default<import('./select').SelectItemOption, boolean, import('react-select').GroupBase<import('./select').SelectItemOption>>>>;
+        displayValue?: (option: import('./select').SelectItemOption) => string;
+        onChange?: (value: import('./select').SelectItemOption | import('./select').SelectItemOption[] | null) => void;
+        attachmentProps?: import('../../../types').DeepPartial<import('../ui').IFieldAttachmentProps>;
+    } & import('react').RefAttributes<HTMLElement>>;
     CheckboxBase: import('react').ForwardRefExoticComponent<import('@radix-ui/react-checkbox').CheckboxProps & {
         classes?: {
             root?: string;

package/dist/shared/ui/formElements/uncontrolled/select/Select.d.ts

@@ -1,62 +1,87 @@
-import { Props } from 'react-select';
-import { ControlClasses, SelectItemClasses, SelectItemOption, SelectListClasses } from './ui';
-import { InputBaseProps } from '../../..';
-type SelectClasses = {
-    container?: string;
-    control?: ControlClasses;
-    option?: SelectItemClasses;
-    list?: SelectListClasses;
+import { ComboboxProps } from '@headlessui/react';
+import { SelectItemOption } from './model';
+import { SelectItemProps } from './ui';
+import { DeepPartial } from '../../../../types';
+import { FieldAttachment } from '../../ui';
+type FieldAttachmentProps = React.ComponentPropsWithoutRef<typeof FieldAttachment>;
+type SelectClasses = SelectItemProps['classes'] & {
+    root?: string;
+    list?: string;
 };
-export type SelectBaseProps<IsMulti extends boolean = boolean> = Omit<Props<SelectItemOption, IsMulti>, 'placeholder' | 'options' | 'defaultValue' | 'isSearchable'> & Pick<InputBaseProps, 'attachmentProps' | 'label' | 'invalid'> & {
+export type SelectBaseProps<Multi extends boolean> = Omit<ComboboxProps<SelectItemOption, Multi, 'li'>, 'multiple' | 'onChange' | 'by' | 'virtual' | 'className'> & {
+    /**
+     * Отображаемый лейбл
+     */
+    label: string;
+    /**
+     * Поддержка множественного выбора
+     */
+    isMulti: Multi;
+    /**
+     * Пометить поле как не валидное
+     */
+    invalid?: boolean;
     /**
      * Свойство управляющее поиском
      */
     isSearchable?: boolean;
     /**
-     * Функция для управления возвращаемым значением
+     * Список отображаемых значений
      */
-    returnValue?: (option: SelectItemOption) => string;
+    options: SelectItemOption[];
+    /**
+     * Дополнительные стили каждого внутреннего элемента
+     */
+    classes?: SelectClasses;
     /**
      * Функция для управления отображаемым значением
      */
     displayValue?: (option: SelectItemOption) => string;
     /**
-     * Дополнительные стили каждого внутреннего элемента
+     * Функция для изменения значения
      */
-    classes?: SelectClasses;
+    onChange?: (value: SelectItemOption | SelectItemOption[] | null) => void;
     /**
-     * Список отображаемых значений
+     * Свойства дополнительной иконки
      */
-    options: SelectItemOption[];
+    attachmentProps?: DeepPartial<FieldAttachmentProps>;
+};
+export declare const SelectBase: import('react').ForwardRefExoticComponent<Omit<ComboboxProps<SelectItemOption, boolean, "li">, "onChange" | "className" | "multiple" | "by" | "virtual"> & {
     /**
-     * Свойство для выключения фильтрации элементов по поиску
+     * Отображаемый лейбл
      */
-    filterOptionDisabled?: boolean;
-};
-export declare const SelectBase: import('react').ForwardRefExoticComponent<Omit<Props<SelectItemOption, boolean>, "options" | "defaultValue" | "placeholder" | "isSearchable"> & Pick<InputBaseProps, "invalid" | "label" | "attachmentProps"> & {
+    label: string;
     /**
-     * Свойство управляющее поиском
+     * Поддержка множественного выбора
      */
-    isSearchable?: boolean;
+    isMulti: boolean;
     /**
-     * Функция для управления возвращаемым значением
+     * Пометить поле как не валидное
      */
-    returnValue?: (option: SelectItemOption) => string;
+    invalid?: boolean;
     /**
-     * Функция для управления отображаемым значением
+     * Свойство управляющее поиском
      */
-    displayValue?: (option: SelectItemOption) => string;
+    isSearchable?: boolean;
+    /**
+     * Список отображаемых значений
+     */
+    options: SelectItemOption[];
     /**
      * Дополнительные стили каждого внутреннего элемента
      */
     classes?: SelectClasses;
     /**
-     * Список отображаемых значений
+     * Функция для управления отображаемым значением
      */
-    options: SelectItemOption[];
+    displayValue?: (option: SelectItemOption) => string;
+    /**
+     * Функция для изменения значения
+     */
+    onChange?: (value: SelectItemOption | SelectItemOption[] | null) => void;
     /**
-     * Свойство для выключения фильтрации элементов по поиску
+     * Свойства дополнительной иконки
      */
-    filterOptionDisabled?: boolean;
-} & import('react').RefAttributes<import('node_modules/react-select/dist/declarations/src/Select').default<SelectItemOption, boolean, import('react-select').GroupBase<SelectItemOption>>>>;
+    attachmentProps?: DeepPartial<FieldAttachmentProps>;
+} & import('react').RefAttributes<HTMLElement>>;
 export {};

package/dist/shared/ui/formElements/uncontrolled/select/hooks/useSelectController.d.ts

@@ -0,0 +1,17 @@
+import { SelectItemOption } from '../model';
+type UseSelectControllerProps = {
+    options: SelectItemOption[];
+    isMulti?: boolean;
+    isSearchable?: boolean;
+    displayValue?: (option: SelectItemOption) => string;
+    onChange?: (value: SelectItemOption | SelectItemOption[] | null) => void;
+};
+export declare const useSelectController: ({ options: initialOptions, displayValue, isSearchable, onChange }: UseSelectControllerProps) => {
+    options: SelectItemOption[];
+    inputValue: string;
+    onInputValueChange: import('react').ChangeEventHandler<HTMLInputElement>;
+    onValueChange: (value: SelectItemOption | SelectItemOption[] | null) => void;
+    onDeleteItem: (values: SelectItemOption | SelectItemOption[], option: SelectItemOption) => void;
+    selectDisplayValue: (value: SelectItemOption | SelectItemOption[] | null) => string | undefined;
+};
+export {};

package/dist/shared/ui/formElements/uncontrolled/select/index.d.ts

@@ -1,2 +1,2 @@
 export { SelectBase, type SelectBaseProps } from './Select';
-export type { SelectItemOption } from './ui';
+export type { SelectItemOption } from './model';

package/dist/shared/ui/formElements/uncontrolled/select/model/index.d.ts

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

package/dist/shared/ui/formElements/uncontrolled/select/model/types.d.ts

@@ -0,0 +1,14 @@
+import { DeepPartial } from '../../../../../types';
+import { FieldAttachment } from '../../../ui';
+type FieldAttachmentProps = React.ComponentPropsWithoutRef<typeof FieldAttachment>;
+export type SelectItemOption = {
+    value: string;
+    label: string;
+    helperText?: string;
+    disabled?: boolean;
+    attachment?: {
+        left?: DeepPartial<FieldAttachmentProps>;
+        right?: DeepPartial<FieldAttachmentProps>;
+    };
+};
+export {};

package/dist/shared/ui/formElements/uncontrolled/select/ui/{control/ui/Chip.d.ts → Chip.d.ts}

@@ -1,4 +1,4 @@
-import { SelectItemOption } from '../../../../../..';
+import { SelectItemOption } from '../model';
 type ControlChipClasses = {
     chip?: string;
 };

package/dist/shared/ui/formElements/uncontrolled/select/ui/ChipList.d.ts

@@ -0,0 +1,11 @@
+import { ChangeEvent } from 'react';
+import { SelectItemOption } from '../model';
+import { ControlChipProps } from './Chip';
+type ControlChipListProps = Omit<ControlChipProps, 'data'> & {
+    values: SelectItemOption | SelectItemOption[];
+    inputValue: string;
+    onInputValueChange: (event: ChangeEvent<HTMLInputElement>) => void;
+    onDeleteItem: (option: SelectItemOption) => void;
+};
+export declare const ChipList: ({ values, onDeleteItem, inputValue, onInputValueChange, ...props }: ControlChipListProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/shared/ui/formElements/uncontrolled/select/ui/SelectItem.d.ts

@@ -1,24 +1,16 @@
-import { OptionProps } from 'react-select';
-import { DeepPartial } from '../../../../../types';
-import { FieldAttachment } from '../../../ui';
-type FieldAttachmentProps = React.ComponentPropsWithoutRef<typeof FieldAttachment>;
-export type SelectItemOption = {
-    id: string | number;
-    value: string;
-    label: string;
-    additionalText?: string;
-    disabled?: boolean;
-    attachment?: {
-        left?: DeepPartial<FieldAttachmentProps>;
-        right?: DeepPartial<FieldAttachmentProps>;
-    };
+import { ComboboxOptionProps } from '@headlessui/react';
+import { motion } from 'framer-motion';
+import { SelectItemOption } from '../model';
+type SelectItemClasses = {
+    item?: string;
+    helperText?: string;
 };
-export type SelectItemClasses = {
-    container?: string;
-    additionalText?: string;
-};
-type SelectItemProps = OptionProps<SelectItemOption> & {
+export type SelectItemProps = Omit<ComboboxOptionProps, 'className' | 'value'> & {
+    option: SelectItemOption;
+    isMulti?: boolean;
     classes?: SelectItemClasses;
+    displayValue?: (option: SelectItemOption) => string;
+    motionProps?: React.ComponentPropsWithoutRef<typeof motion.li>;
 };
-export declare const SelectItem: ({ isSelected, label, data, innerProps, innerRef, selectProps, isFocused, classes, isMulti, ...props }: SelectItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const SelectItem: ({ option, classes, displayValue, isMulti, motionProps, ...props }: SelectItemProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/shared/ui/formElements/uncontrolled/select/ui/index.d.ts

@@ -1,3 +1,2 @@
-export * from './control';
-export * from './SelectItem';
-export * from './SelectList';
+export { SelectItem, type SelectItemProps } from './SelectItem';
+export { ChipList } from './ChipList';