@bothub-chat/ui 2.61.1-feat-generics-in-select-b6b6cf11-a2ed-403a-b1b1-247607966754 → 2.61.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,8 +1,8 @@
1
1
  import { SelectFieldChangeEventHandler, SelectFieldDataItem, SelectFieldSize, SelectFieldValueChangeEventHandler, UseSelectFieldProps } from '../select-field';
2
2
  import { Variant } from './types';
3
- export type BadgeSelectDropdownProps<DataItem extends SelectFieldDataItem<any>> = {
4
- options: DataItem[];
5
- value?: DataItem | null;
3
+ export type BadgeSelectDropdownProps = {
4
+ options: SelectFieldDataItem[];
5
+ value?: SelectFieldDataItem | null;
6
6
  variant?: Variant;
7
7
  colorButtonOpened?: string;
8
8
  className?: string;
@@ -13,8 +13,8 @@ export type BadgeSelectDropdownProps<DataItem extends SelectFieldDataItem<any>>
13
13
  contentWidth?: number;
14
14
  searchPlaceholder?: string;
15
15
  openedModel?: string;
16
- onChange?: SelectFieldChangeEventHandler<DataItem>;
17
- onValueChange?: SelectFieldValueChangeEventHandler<DataItem>;
18
- } & Omit<UseSelectFieldProps<DataItem>, 'onChange' | 'multiple' | 'onValueChange' | 'value'>;
19
- export declare const BadgeSelectDropdown: <DataItem extends SelectFieldDataItem<any>>(props: BadgeSelectDropdownProps<DataItem>) => React.ReactNode;
16
+ onChange?: SelectFieldChangeEventHandler;
17
+ onValueChange?: SelectFieldValueChangeEventHandler;
18
+ } & Omit<UseSelectFieldProps, 'onChange' | 'multiple' | 'onValueChange' | 'value'>;
19
+ export declare const BadgeSelectDropdown: import("react").MemoExoticComponent<({ options, value: initialValue, variant, colorButtonOpened, className, compactWidth, modalStyles, size, search, contentWidth, searchPlaceholder, openedModel, ...useSelectFieldProps }: BadgeSelectDropdownProps) => import("react/jsx-runtime").JSX.Element>;
20
20
  export * from './styled';
@@ -1,5 +1,5 @@
1
1
  import { SelectFieldDataItemComplex } from '../select-field';
2
- export type LangSwitcherProps<DataItem extends SelectFieldDataItemComplex<any>> = {
2
+ export type LangSwitcherProps = {
3
3
  region: {
4
4
  value: string;
5
5
  label: string;
@@ -8,11 +8,11 @@ export type LangSwitcherProps<DataItem extends SelectFieldDataItemComplex<any>>
8
8
  value: string;
9
9
  label: string;
10
10
  };
11
- dataRegions: DataItem[];
12
- dataLanguages: DataItem[];
11
+ dataRegions: SelectFieldDataItemComplex[];
12
+ dataLanguages: SelectFieldDataItemComplex[];
13
13
  onChange: ({ lang, region }: {
14
14
  lang: string;
15
15
  region: string;
16
16
  }) => void;
17
17
  };
18
- export declare const LangSwitcher: <DataItem extends SelectFieldDataItemComplex<any>>({ lang, region, dataRegions, dataLanguages, onChange, }: LangSwitcherProps<DataItem>) => import("react/jsx-runtime").JSX.Element;
18
+ export declare const LangSwitcher: React.FC<LangSwitcherProps>;
@@ -1995,7 +1995,7 @@ export declare const LangSwitcherLabel: import("styled-components").IStyledCompo
1995
1995
  onTransitionStartCapture?: import("react").TransitionEventHandler<HTMLSpanElement> | undefined;
1996
1996
  ref?: import("react").Ref<HTMLSpanElement> | undefined;
1997
1997
  }>;
1998
- export declare const LangSwitcherInput: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("@/ui/components/select-field").SelectFieldProps<import("@/ui/components/select-field").SelectFieldDataItem<any>>, import("styled-components/dist/types").BaseObject>>;
1998
+ export declare const LangSwitcherInput: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("@/ui/components/select-field").SelectFieldProps, import("styled-components/dist/types").BaseObject>>;
1999
1999
  export declare const LangSwitcherButton: import("styled-components").IStyledComponent<"web", {
2000
2000
  children?: import("react").ReactNode;
2001
2001
  value?: string | number | readonly string[] | undefined;
@@ -1,7 +1,7 @@
1
1
  import { SelectModalGeneralProps } from './select-modal';
2
- import { SelectFieldDataItem, SelectFieldInputChangeEventHandler, SelectFieldInputType } from './types';
2
+ import { SelectFieldInputChangeEventHandler, SelectFieldInputType } from './types';
3
3
  import { UseSelectFieldProps } from './useSelectField';
4
- export type SelectFieldProps<DataItem extends SelectFieldDataItem<any>> = {
4
+ export type SelectFieldProps = {
5
5
  className?: string;
6
6
  label?: string | boolean | React.ReactNode;
7
7
  placeholder?: string;
@@ -17,8 +17,8 @@ export type SelectFieldProps<DataItem extends SelectFieldDataItem<any>> = {
17
17
  dataTest?: string;
18
18
  onInputChange?: SelectFieldInputChangeEventHandler;
19
19
  onPointerLeave?: React.PointerEventHandler<HTMLDivElement>;
20
- } & SelectModalGeneralProps<DataItem> & UseSelectFieldProps<DataItem> & React.PropsWithChildren;
21
- export declare const SelectField: <DataItem extends SelectFieldDataItem<any>>({ className, label, placeholder, data, fullWidth, contentWidth, error, skeleton, blur, size, disableSelect, disableScrollbar, empty, after, loading, searchSampleIcon, enableInput, inputType, inputValue: initialInputValue, clearable, disablePortal, tabs, search, searchPlaceholder, resetStyleState, children, modalWidth, dataTest, selectedColor, compactWidth, modalStyles, openedModel, onSearch, onOptionClick, onGroupCheckboxClick, onInputChange, onPointerLeave, ...useSelectFieldProps }: SelectFieldProps<DataItem>) => import("react/jsx-runtime").JSX.Element;
20
+ } & SelectModalGeneralProps & UseSelectFieldProps & React.PropsWithChildren;
21
+ export declare const SelectField: ({ className, label, placeholder, data, fullWidth, contentWidth, error, skeleton, blur, size, disableSelect, disableScrollbar, empty, after, loading, searchSampleIcon, enableInput, inputType, inputValue: initialInputValue, clearable, disablePortal, tabs, search, searchPlaceholder, resetStyleState, children, modalWidth, dataTest, selectedColor, compactWidth, modalStyles, openedModel, onSearch, onOptionClick, onGroupCheckboxClick, onInputChange, onPointerLeave, ...useSelectFieldProps }: SelectFieldProps) => import("react/jsx-runtime").JSX.Element;
22
22
  export * from './types';
23
23
  export * from './styled';
24
24
  export * from './context';
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { SelectFieldDataItem, ValueType } from '../../types';
3
- export interface SelectFieldInputValueProps<DataItem extends SelectFieldDataItem<any>> {
4
- value: ValueType<DataItem>;
5
- handleValueDelete: (item: DataItem, event: React.MouseEvent) => unknown;
3
+ export interface SelectFieldInputValueProps {
4
+ value: ValueType;
5
+ handleValueDelete: (item: SelectFieldDataItem, event: React.MouseEvent) => unknown;
6
6
  }
7
- export declare const SelectFieldInputValue: <DataItem extends SelectFieldDataItem<any>>({ value, handleValueDelete, }: SelectFieldInputValueProps<DataItem>) => import("react/jsx-runtime").JSX.Element | null;
7
+ export declare const SelectFieldInputValue: React.FC<SelectFieldInputValueProps>;
@@ -1,2 +1,2 @@
1
- import { SelectFieldDataItem } from '../types';
2
- export declare const filterData: <DataItem extends SelectFieldDataItem<any>>(data: DataItem[], searchValue: string) => DataItem[];
1
+ import { SelectFieldData } from '../types';
2
+ export declare const filterData: (data: SelectFieldData, searchValue: string) => SelectFieldData;
@@ -1,16 +1,16 @@
1
1
  import React from 'react';
2
2
  import { ScrollableTabsProps } from '@/ui/components/scrollable-tabs';
3
3
  import { UseSelectFieldReturnType } from '..';
4
- import { ResetStyleStateType, SelectFieldDataItem, SelectFieldGroupCheckboxClickEventHandler, SelectFieldInputChangeEventHandler, SelectFieldOptionClickEventHandler, SelectFieldSize } from '../types';
5
- export type SelectModalGeneralProps<DataItem extends SelectFieldDataItem<any>> = {
6
- data?: DataItem[];
4
+ import { ResetStyleStateType, SelectFieldData, SelectFieldGroupCheckboxClickEventHandler, SelectFieldInputChangeEventHandler, SelectFieldOptionClickEventHandler, SelectFieldSize } from '../types';
5
+ export type SelectModalGeneralProps = {
6
+ data?: SelectFieldData;
7
7
  contentWidth?: number;
8
8
  contentHeight?: number | string;
9
9
  size?: SelectFieldSize;
10
10
  disableSelect?: boolean;
11
11
  disableScrollbar?: boolean;
12
12
  empty?: React.ReactNode;
13
- after?: DataItem[];
13
+ after?: SelectFieldData;
14
14
  tabs?: Omit<ScrollableTabsProps, 'variant' | 'component'>;
15
15
  search?: boolean;
16
16
  searchPlaceholder?: string;
@@ -23,10 +23,10 @@ export type SelectModalGeneralProps<DataItem extends SelectFieldDataItem<any>> =
23
23
  selectedColor?: string;
24
24
  compactWidth?: boolean;
25
25
  modalStyles?: React.CSSProperties;
26
- onOptionClick?: SelectFieldOptionClickEventHandler<DataItem>;
27
- onGroupCheckboxClick?: SelectFieldGroupCheckboxClickEventHandler<DataItem>;
26
+ onOptionClick?: SelectFieldOptionClickEventHandler;
27
+ onGroupCheckboxClick?: SelectFieldGroupCheckboxClickEventHandler;
28
28
  };
29
- export type SelectModalProps<DataItem extends SelectFieldDataItem<any>> = SelectModalGeneralProps<DataItem> & Omit<UseSelectFieldReturnType<DataItem>, 'disabled' | 'handleInputClick' | 'maxHeight' | 'triggerRef'>;
30
- export declare const SelectModal: <DataItem extends SelectFieldDataItem<any>>({ isOpen, data: initialData, contentWidth, contentHeight, size, disableSelect, disableScrollbar, empty, after, tabs, search, searchPlaceholder, resetStyleState, placement, selectModalRef, disablePortal, blur, x, y, width, isKeyboardOpen, value, multiple, modalWidth, openedModel, selectedColor, compactWidth, modalStyles, onSearch, onOptionClick, onGroupCheckboxClick, handleClose, setValue, }: SelectModalProps<DataItem>) => import("react/jsx-runtime").JSX.Element;
29
+ export type SelectModalProps = SelectModalGeneralProps & Omit<UseSelectFieldReturnType, 'disabled' | 'handleInputClick' | 'maxHeight' | 'triggerRef'>;
30
+ export declare const SelectModal: ({ isOpen, data: initialData, contentWidth, contentHeight, size, disableSelect, disableScrollbar, empty, after, tabs, search, searchPlaceholder, resetStyleState, placement, selectModalRef, disablePortal, blur, x, y, width, isKeyboardOpen, value, multiple, modalWidth, openedModel, selectedColor, compactWidth, modalStyles, onSearch, onOptionClick, onGroupCheckboxClick, handleClose, setValue, }: SelectModalProps) => import("react/jsx-runtime").JSX.Element;
31
31
  export * from './styled';
32
32
  export * from './option';
@@ -1 +1 @@
1
- import{jsx as i,jsxs as o}from"react/jsx-runtime";import s,{useState as n,useRef as e,useCallback as t,useEffect as r,useMemo as c}from"react";import{SelectModalStyled as d,SelectModalPositionWrapper as p,SelectModalContent as m,SelectModalGroups as x,SelectModalTabsContainer as j,SelectModalTabs as a,SelectModalSearch as l,SelectModalAfter as g}from"./styled.js";import"../../../icons/arrow-down/index.js";import"../../../icons/arrow-narrow-left/index.js";import"../../../icons/arrow-narrow-right/index.js";import"../../../icons/arrow-up/index.js";import"../../../icons/bitcoin/index.js";import"../../../icons/bot-circle/index.js";import"../../../icons/bothub-agg/index.js";import"../../../icons/business-colored/index.js";import"../../../icons/check-circle/index.js";import"../../../icons/close/index.js";import"../../../icons/email-circle/index.js";import"../../../icons/language/index.js";import"../../../icons/lock-circle/index.js";import"../../../icons/menu/index.js";import"../../../icons/medium-circle/index.js";import"../../../icons/tg-circle/index.js";import"../../../icons/tg-colored/index.js";import"../../../icons/youcassa/index.js";import"../../../icons/dashboard/index.js";import"../../../icons/user-profile/index.js";import"../../../icons/logout/index.js";import"tslib";import"../../../icons/habr-2/index.js";import"../../../icons/arrow-2-down/index.js";import"../../../icons/links/index.js";import"../../../icons/free/index.js";import"../../../icons/hotness/index.js";import"../../../icons/checked/index.js";import"../../../icons/ai/index.js";import"../../../icons/bookmarks/index.js";import"../../../icons/bookmarks-big/index.js";import"../../../icons/chat/index.js";import"../../../icons/chats/index.js";import"../../../icons/coder/index.js";import"../../../icons/copy/index.js";import"../../../icons/edit/index.js";import"../../../icons/presets-big/index.js";import"../../../icons/referal/index.js";import"../../../icons/restore/index.js";import"../../../icons/tariff/index.js";import"../../../icons/trash/index.js";import"../../../icons/update/index.js";import"../../../icons/menu-dot/index.js";import"../../../icons/plus-2/index.js";import"../../../icons/plus-1/index.js";import"../../../icons/send/index.js";import"../../../icons/settings/index.js";import"../../../icons/habr/index.js";import"../../../icons/check-small/index.js";import"../../../icons/stop/index.js";import"../../../icons/thumb-up/index.js";import"../../../icons/thumb-down/index.js";import"../../../icons/star/index.js";import"../../../icons/info-big/index.js";import"../../../icons/warning-big/index.js";import"../../../icons/error-big/index.js";import"../../../icons/success-big/index.js";import"../../../icons/mj/index.js";import"../../../icons/card/index.js";import"../../../icons/arrow-narrow-up/index.js";import"../../../icons/arrow-narrow-down/index.js";import"../../../icons/filters/index.js";import"../../../icons/info/index.js";import"../../../icons/search-circle/index.js";import"../../../icons/save/index.js";import"../../../icons/light/index.js";import"../../../icons/dark/index.js";import"../../../icons/email-colored/index.js";import"../../../icons/action-chat/index.js";import"../../../icons/attach/index.js";import"../../../icons/avatar-add/index.js";import"../../../icons/brush/index.js";import"../../../icons/calendar/index.js";import"../../../icons/claude/index.js";import"../../../icons/cookie/index.js";import"../../../icons/dalle/index.js";import"../../../icons/download-img/index.js";import"../../../icons/error/index.js";import"../../../icons/expand/index.js";import"../../../icons/eye/index.js";import"../../../icons/face/index.js";import"../../../icons/gear/index.js";import"../../../icons/gear-min/index.js";import"../../../icons/generation/index.js";import"../../../icons/gpt-3_5/index.js";import"../../../icons/gpt-4/index.js";import"../../../icons/imagine/index.js";import"../../../icons/imagine-2/index.js";import"../../../icons/loader/index.js";import"../../../icons/loader-circular/index.js";import"../../../icons/loader-circular-gradient/index.js";import"../../../icons/loader-circular-gradient-2/index.js";import"../../../icons/minus/index.js";import"../../../icons/mj-white/index.js";import"../../../icons/prompt/index.js";import"../../../icons/rabbit/index.js";import"../../../icons/ratio-1x1/index.js";import"../../../icons/ratio-2x3/index.js";import"../../../icons/ratio-3x2/index.js";import"../../../icons/ratio-4x5/index.js";import"../../../icons/ratio-4x7/index.js";import"../../../icons/ratio-5x4/index.js";import"../../../icons/ratio-7x4/index.js";import"../../../icons/ratio-16x9/index.js";import"../../../icons/ratio-9x16/index.js";import"../../../icons/ratio-21x9/index.js";import"../../../icons/ratio-9x21/index.js";import"../../../icons/refferal-min/index.js";import"../../../icons/search-data/index.js";import"../../../icons/square/index.js";import"../../../icons/turtle/index.js";import"../../../icons/upscale/index.js";import"../../../icons/withdraw/index.js";import"../../../icons/search-plus/index.js";import"../../../icons/lightning/index.js";import"../../../icons/blog-circle/index.js";import"../../../icons/stripe/index.js";import"../../../icons/corporate/index.js";import"../../../icons/public/index.js";import"../../../icons/private/index.js";import"../../../icons/mistral/index.js";import"../../../icons/gemini/index.js";import{SearchSimpleIcon as b}from"../../../icons/search-simple/index.js";import"../../../icons/sad-robot/index.js";import"../../../icons/model/index.js";import"../../../icons/phone-colored/index.js";import"../../../icons/questions/index.js";import"../../../icons/pdf-big/index.js";import"../../../icons/xls-big/index.js";import"../../../icons/word-big/index.js";import"../../../icons/txt-big/index.js";import"../../../icons/pdf/index.js";import"../../../icons/xls/index.js";import"../../../icons/word/index.js";import"../../../icons/txt/index.js";import"../../../icons/bothub-logo-gradient/index.js";import"../../../icons/telegram-logo-gradient/index.js";import"../../../icons/decline-circle/index.js";import"../../../icons/simple-gear-bg/index.js";import"../../../icons/advanced-filter/index.js";import"../../../icons/big-corporate/index.js";import"../../../icons/big-mj/index.js";import"../../../icons/big-models/index.js";import"../../../icons/big-stats/index.js";import"../../../icons/big-success/index.js";import"../../../icons/big-users/index.js";import"../../../icons/optional-presets/index.js";import"../../../icons/wallet-withdraw/index.js";import"../../../icons/big-presets/index.js";import"../../../icons/big-favorite/index.js";import"../../../icons/big-referal/index.js";import"../../../icons/attach-file/index.js";import"../../../icons/attach-file-big/index.js";import"../../../icons/voice/index.js";import"../../../icons/play-button/index.js";import"../../../icons/pause-button/index.js";import"../../../icons/text-read/index.js";import"../../../icons/text-hide/index.js";import"../../../icons/best-chat-bots/index.js";import"../../../icons/upload/index.js";import"../../../icons/enter/index.js";import"../../../icons/discord/index.js";import"../../../icons/discord-circle/index.js";import"../../../icons/black-forest-labs/index.js";import"../../../icons/flux/index.js";import"../../../icons/stable-diffusion/index.js";import"../../../icons/stability-ai/index.js";import"../../../icons/article-generator/index.js";import"../../../icons/success/index.js";import"../../../icons/google/index.js";import"../../../icons/yandex/index.js";import"../../../icons/vk/index.js";import"../../../icons/resend/index.js";import"../../../icons/big-article/index.js";import"../../../icons/add-chat/index.js";import"../../../icons/add-group/index.js";import"../../../icons/drag-dot/index.js";import"../../../icons/add-folder/index.js";import"../../../icons/temp-chat/index.js";import"../../../icons/delete-chat/index.js";import"../../../icons/sidebar-chat/index.js";import"../../../icons/organization/index.js";import"../../../icons/simple-gear/index.js";import"../../../icons/text-bold/index.js";import"../../../icons/text-italic/index.js";import"../../../icons/text-underline/index.js";import"../../../icons/text-strikethrough/index.js";import"../../../icons/refresh/index.js";import"../../../icons/copy-variants/index.js";import"../../../icons/sort-ascending/index.js";import"../../../icons/sort-descending/index.js";import"../../../icons/quote/index.js";import"../../../icons/url-circle/index.js";import"../../../icons/show-ui/index.js";import"../../../icons/hide-ui/index.js";import"../../../icons/sort-user/index.js";import"../../../icons/happy-robot/index.js";import"../../../icons/happy-robot-gradient/index.js";import"../../../icons/min-window/index.js";import"../../../icons/max-window/index.js";import"../../../icons/manage-chat/index.js";import"../../../icons/analyze-urls/index.js";import"../../../icons/web-search/index.js";import"../../../icons/include-context/index.js";import"../../../icons/queue/index.js";import"../../../icons/sort-alphabet-ascending/index.js";import"../../../icons/sort-alphabet-descending/index.js";import"../../../icons/sort-date-ascending/index.js";import"../../../icons/sort-date-descending/index.js";import"../../../icons/cot-r1/index.js";import"../../../icons/news/index.js";import"../../../icons/volume/index.js";import"../../../icons/flag-ru/index.js";import"../../../icons/flag-kz/index.js";import"../../../icons/print/index.js";import"../../../icons/pc-icon-1/index.js";import"../../../icons/pc-icon-2/index.js";import"../../../icons/pc-icon-3/index.js";import"../../../icons/star-unfilled/index.js";import"../../../icons/image-generation/index.js";import"../../../icons/speech-synthesys/index.js";import"../../../icons/transcription/index.js";import"../../../icons/text-rewrite/index.js";import"../../../icons/code-generation/index.js";import"../../../icons/essay-generation/index.js";import"../../../icons/spelling/index.js";import"../../../icons/text-generation/index.js";import"../../../icons/traffic-analisys/index.js";import"../../../icons/fav-profile/index.js";import"../../../icons/exclamation/index.js";import"../../../icons/article/index.js";import"../../../icons/setchel/index.js";import"../../../icons/assembly/index.js";import"../../../icons/data-visualisation/index.js";import"../../../icons/document-analisys/index.js";import"../../../icons/problem-solvment/index.js";import"../../../icons/setting-analisys/index.js";import"../../../icons/translation/index.js";import"../../../icons/stars/index.js";import"../../../icons/academy/index.js";import"../../../icons/articles/index.js";import"../../../icons/blog-post/index.js";import"../../../icons/book/index.js";import"../../../icons/bow-tie/index.js";import"../../../icons/case-study/index.js";import"../../../icons/comments/index.js";import"../../../icons/guide/index.js";import"../../../icons/marketing/index.js";import"../../../icons/post/index.js";import"../../../icons/report/index.js";import"../../../icons/review/index.js";import"../../../icons/scientific-article/index.js";import"../../../icons/selling-text/index.js";import"../../../icons/textbook/index.js";import"../../../icons/wind/index.js";import"../../../icons/grok/index.js";import"../../../icons/deepseek/index.js";import"../../../icons/grid-horizontal/index.js";import"../../../icons/grid-vertical/index.js";import"../../../icons/star-gradient/index.js";import"../../../icons/qwen/index.js";import"../../../icons/sidebar-toggle-left/index.js";import"../../../icons/sidebar-toggle-right/index.js";import"../../../icons/system/index.js";import"../../../icons/selector/index.js";import"../../../icons/video-camera/index.js";import"../../../icons/music-note/index.js";import"../../../icons/add-profile/index.js";import"../../../icons/token-counter/index.js";import"../../../icons/customer-support/index.js";import"../../../icons/sort-alphabet-top-bottom/index.js";import"../../../icons/sort-alphabet-bottom-top/index.js";import"../../../icons/pause/index.js";import"../../../icons/play/index.js";import"../../../icons/restore-2/index.js";import"../../../icons/video-generation/index.js";import"../../../icons/veo-model/index.js";import"../../../icons/runway/index.js";import"../../../icons/queue-select/index.js";import"../../../icons/apple/index.js";import"../../../icons/mail-colored/index.js";import"../../../icons/shield/index.js";import"../../../icons/stars-gradient/index.js";import"../../../icons/fire/index.js";import"../../../icons/brain/index.js";import"../../../icons/mj-purple/index.js";import"../../../icons/claude-black/index.js";import"../../../icons/vk-filled/index.js";import"../../../icons/tg/index.js";import"../../../icons/gift/index.js";import"../../../icons/exchange/index.js";import"../../../icons/time/index.js";import"../../../icons/folder/index.js";import"../../../icons/history/index.js";import"../../../icons/money-plus/index.js";import"../../../icons/money-stack/index.js";import"../../../icons/sort-numeric-bottom/index.js";import"../../../icons/sort-numeric-top/index.js";import"../../../icons/bulb/index.js";import"../../../icons/prompt-queue/index.js";import"../../../icons/image/index.js";import"../../../icons/text/index.js";import"../../../icons/code/index.js";import"../../../icons/blue-grok/index.js";import"../../../icons/double-image/index.js";import{Portal as u}from"../../portal/index.js";import{SelectFieldGroup as h}from"./select-field-group/index.js";import{SelectFieldOptions as f}from"./option/list/index.js";import"./option/collapse/styled.js";import"../../icon/styled.js";import"@react-spring/web";import"react-markdown";import"../../tooltip/styled.js";import"../../tooltip/arrow/styled.js";import"../../../theme/index.js";import"../../tooltip/context.js";import{filterData as y}from"./filterData.js";const w=({isOpen:w,data:k=[],contentWidth:v,contentHeight:C,size:O="small",disableSelect:$=!1,disableScrollbar:S=!1,empty:z,after:q,tabs:W,search:T,searchPlaceholder:P,resetStyleState:A,placement:G,selectModalRef:H,disablePortal:M,blur:B=!1,x:D,y:F,width:I,isKeyboardOpen:K,value:R,multiple:V,modalWidth:_,openedModel:E,selectedColor:J,compactWidth:L,modalStyles:N,onSearch:Q,onOptionClick:U,onGroupCheckboxClick:X,handleClose:Y,setValue:Z})=>{const[ii,oi]=n([]),[si,ni]=n(""),ei=e(0),ti=t(i=>{const{value:o}=i.currentTarget;null==Q||Q(o),ni(o)},[Q,ni]),ri=t(i=>{var o;if("object"!=typeof i||!i.disabled){if("object"==typeof i&&i.noSelect)return null===(o=null==i?void 0:i.onClick)||void 0===o||o.call(i,i),void Y();null==U||U(i),$||"object"==typeof i&&("checkbox"===i.type||"checkbox-group"===i.type)||(V&&Array.isArray(R)?Z([...new Set([...R,i])]):Z(i)),("object"!=typeof i||"checkbox"!==i.type&&"checkbox-group"!==i.type)&&Y()}},[R,V,$,Z,U,Y]);r(()=>{oi(E?[E]:[]),ei.current=0,ni("")},[A,E]);const ci=t(i=>{ei.current=0,oi([]),W&&W.onClick&&W.onClick(i)},[W]),di=t(i=>oi(o=>o.includes(i)?o.filter(o=>o!==i):[...o,i]),[]),pi=c(()=>M?s.Fragment:u,[M]),mi=c(()=>k.map(i=>{if(i&&"object"==typeof i&&"collapse"===i.type&&i.id&&!i.disabled){const o=()=>{i.onClick&&i.onClick(i),i.id&&di(i.id)},s=ii.includes(i.id);return Object.assign(Object.assign({},i),{open:s,onClick:o})}return i}),[k,ii,di]);return i(pi,{children:i(d,{$isOpen:w,$contentWidth:v,$disablePortal:M,$placement:G,ref:H,style:Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},N),0!==D&&Object.assign(Object.assign({},"top-right"!==G&&{left:D}),"top-right"===G&&Object.assign(Object.assign({},void 0===v&&{left:`calc(${D}px - ${I})`}),"number"==typeof v&&{left:`calc(${D}px - ${v>I?`calc(var(--bothub-scale, 1) * ${v}px)`:`${I}px`})`}))),0!==F&&{top:F}),void 0===v&&{width:I}),"number"==typeof v&&{width:v>I?`calc(var(--bothub-scale, 1) * ${v}px)`:I}),children:i(p,{$blur:B,$placement:G,$width:_,$compactWidth:L,style:Object.assign(Object.assign({},"number"==typeof C&&C>=0&&{height:`calc(var(--bothub-scale, 1) * ${C}px)`}),"string"==typeof C&&{height:C}),children:i(m,{children:o(x,{$size:O,children:[!!W&&i(j,{children:i(a,Object.assign({},W,{onClick:ci}))}),T&&i(l,{startIcon:i(b,{}),placeholder:P,value:si,onChange:ti,onClick:()=>{K.current=!0},onBlur:()=>setTimeout(()=>{K.current=!1},500)}),mi.length>0?i(h,{scrollTop:ei.current,onScrollTopChange:i=>{ei.current=i},$size:O,$disableScrollbar:S,$followContentHeight:!!C,children:i(f,{value:R,data:Q?mi:y(mi,si),size:O,disableSelect:$,onGroupCheckboxClick:X,onOptionClick:ri,selectedColor:J})}):z,q&&i(g,{children:i(f,{value:R,data:q,size:O,disableSelect:$,onOptionClick:ri,selectedColor:J})})]})})})})})};export{f as SelectFieldOptions,w as SelectModal,g as SelectModalAfter,m as SelectModalContent,x as SelectModalGroups,p as SelectModalPositionWrapper,l as SelectModalSearch,d as SelectModalStyled,a as SelectModalTabs,j as SelectModalTabsContainer};
1
+ import{__rest as i}from"tslib";import{jsx as o,jsxs as s}from"react/jsx-runtime";import n,{useState as e,useRef as t,useCallback as r,useEffect as c,useMemo as d}from"react";import{SelectModalStyled as p,SelectModalPositionWrapper as m,SelectModalContent as x,SelectModalGroups as j,SelectModalTabsContainer as a,SelectModalTabs as l,SelectModalSearch as g,SelectModalAfter as b}from"./styled.js";import"../../../icons/arrow-down/index.js";import"../../../icons/arrow-narrow-left/index.js";import"../../../icons/arrow-narrow-right/index.js";import"../../../icons/arrow-up/index.js";import"../../../icons/bitcoin/index.js";import"../../../icons/bot-circle/index.js";import"../../../icons/bothub-agg/index.js";import"../../../icons/business-colored/index.js";import"../../../icons/check-circle/index.js";import"../../../icons/close/index.js";import"../../../icons/email-circle/index.js";import"../../../icons/language/index.js";import"../../../icons/lock-circle/index.js";import"../../../icons/menu/index.js";import"../../../icons/medium-circle/index.js";import"../../../icons/tg-circle/index.js";import"../../../icons/tg-colored/index.js";import"../../../icons/youcassa/index.js";import"../../../icons/dashboard/index.js";import"../../../icons/user-profile/index.js";import"../../../icons/logout/index.js";import"../../../icons/habr-2/index.js";import"../../../icons/arrow-2-down/index.js";import"../../../icons/links/index.js";import"../../../icons/free/index.js";import"../../../icons/hotness/index.js";import"../../../icons/checked/index.js";import"../../../icons/ai/index.js";import"../../../icons/bookmarks/index.js";import"../../../icons/bookmarks-big/index.js";import"../../../icons/chat/index.js";import"../../../icons/chats/index.js";import"../../../icons/coder/index.js";import"../../../icons/copy/index.js";import"../../../icons/edit/index.js";import"../../../icons/presets-big/index.js";import"../../../icons/referal/index.js";import"../../../icons/restore/index.js";import"../../../icons/tariff/index.js";import"../../../icons/trash/index.js";import"../../../icons/update/index.js";import"../../../icons/menu-dot/index.js";import"../../../icons/plus-2/index.js";import"../../../icons/plus-1/index.js";import"../../../icons/send/index.js";import"../../../icons/settings/index.js";import"../../../icons/habr/index.js";import"../../../icons/check-small/index.js";import"../../../icons/stop/index.js";import"../../../icons/thumb-up/index.js";import"../../../icons/thumb-down/index.js";import"../../../icons/star/index.js";import"../../../icons/info-big/index.js";import"../../../icons/warning-big/index.js";import"../../../icons/error-big/index.js";import"../../../icons/success-big/index.js";import"../../../icons/mj/index.js";import"../../../icons/card/index.js";import"../../../icons/arrow-narrow-up/index.js";import"../../../icons/arrow-narrow-down/index.js";import"../../../icons/filters/index.js";import"../../../icons/info/index.js";import"../../../icons/search-circle/index.js";import"../../../icons/save/index.js";import"../../../icons/light/index.js";import"../../../icons/dark/index.js";import"../../../icons/email-colored/index.js";import"../../../icons/action-chat/index.js";import"../../../icons/attach/index.js";import"../../../icons/avatar-add/index.js";import"../../../icons/brush/index.js";import"../../../icons/calendar/index.js";import"../../../icons/claude/index.js";import"../../../icons/cookie/index.js";import"../../../icons/dalle/index.js";import"../../../icons/download-img/index.js";import"../../../icons/error/index.js";import"../../../icons/expand/index.js";import"../../../icons/eye/index.js";import"../../../icons/face/index.js";import"../../../icons/gear/index.js";import"../../../icons/gear-min/index.js";import"../../../icons/generation/index.js";import"../../../icons/gpt-3_5/index.js";import"../../../icons/gpt-4/index.js";import"../../../icons/imagine/index.js";import"../../../icons/imagine-2/index.js";import"../../../icons/loader/index.js";import"../../../icons/loader-circular/index.js";import"../../../icons/loader-circular-gradient/index.js";import"../../../icons/loader-circular-gradient-2/index.js";import"../../../icons/minus/index.js";import"../../../icons/mj-white/index.js";import"../../../icons/prompt/index.js";import"../../../icons/rabbit/index.js";import"../../../icons/ratio-1x1/index.js";import"../../../icons/ratio-2x3/index.js";import"../../../icons/ratio-3x2/index.js";import"../../../icons/ratio-4x5/index.js";import"../../../icons/ratio-4x7/index.js";import"../../../icons/ratio-5x4/index.js";import"../../../icons/ratio-7x4/index.js";import"../../../icons/ratio-16x9/index.js";import"../../../icons/ratio-9x16/index.js";import"../../../icons/ratio-21x9/index.js";import"../../../icons/ratio-9x21/index.js";import"../../../icons/refferal-min/index.js";import"../../../icons/search-data/index.js";import"../../../icons/square/index.js";import"../../../icons/turtle/index.js";import"../../../icons/upscale/index.js";import"../../../icons/withdraw/index.js";import"../../../icons/search-plus/index.js";import"../../../icons/lightning/index.js";import"../../../icons/blog-circle/index.js";import"../../../icons/stripe/index.js";import"../../../icons/corporate/index.js";import"../../../icons/public/index.js";import"../../../icons/private/index.js";import"../../../icons/mistral/index.js";import"../../../icons/gemini/index.js";import{SearchSimpleIcon as u}from"../../../icons/search-simple/index.js";import"../../../icons/sad-robot/index.js";import"../../../icons/model/index.js";import"../../../icons/phone-colored/index.js";import"../../../icons/questions/index.js";import"../../../icons/pdf-big/index.js";import"../../../icons/xls-big/index.js";import"../../../icons/word-big/index.js";import"../../../icons/txt-big/index.js";import"../../../icons/pdf/index.js";import"../../../icons/xls/index.js";import"../../../icons/word/index.js";import"../../../icons/txt/index.js";import"../../../icons/bothub-logo-gradient/index.js";import"../../../icons/telegram-logo-gradient/index.js";import"../../../icons/decline-circle/index.js";import"../../../icons/simple-gear-bg/index.js";import"../../../icons/advanced-filter/index.js";import"../../../icons/big-corporate/index.js";import"../../../icons/big-mj/index.js";import"../../../icons/big-models/index.js";import"../../../icons/big-stats/index.js";import"../../../icons/big-success/index.js";import"../../../icons/big-users/index.js";import"../../../icons/optional-presets/index.js";import"../../../icons/wallet-withdraw/index.js";import"../../../icons/big-presets/index.js";import"../../../icons/big-favorite/index.js";import"../../../icons/big-referal/index.js";import"../../../icons/attach-file/index.js";import"../../../icons/attach-file-big/index.js";import"../../../icons/voice/index.js";import"../../../icons/play-button/index.js";import"../../../icons/pause-button/index.js";import"../../../icons/text-read/index.js";import"../../../icons/text-hide/index.js";import"../../../icons/best-chat-bots/index.js";import"../../../icons/upload/index.js";import"../../../icons/enter/index.js";import"../../../icons/discord/index.js";import"../../../icons/discord-circle/index.js";import"../../../icons/black-forest-labs/index.js";import"../../../icons/flux/index.js";import"../../../icons/stable-diffusion/index.js";import"../../../icons/stability-ai/index.js";import"../../../icons/article-generator/index.js";import"../../../icons/success/index.js";import"../../../icons/google/index.js";import"../../../icons/yandex/index.js";import"../../../icons/vk/index.js";import"../../../icons/resend/index.js";import"../../../icons/big-article/index.js";import"../../../icons/add-chat/index.js";import"../../../icons/add-group/index.js";import"../../../icons/drag-dot/index.js";import"../../../icons/add-folder/index.js";import"../../../icons/temp-chat/index.js";import"../../../icons/delete-chat/index.js";import"../../../icons/sidebar-chat/index.js";import"../../../icons/organization/index.js";import"../../../icons/simple-gear/index.js";import"../../../icons/text-bold/index.js";import"../../../icons/text-italic/index.js";import"../../../icons/text-underline/index.js";import"../../../icons/text-strikethrough/index.js";import"../../../icons/refresh/index.js";import"../../../icons/copy-variants/index.js";import"../../../icons/sort-ascending/index.js";import"../../../icons/sort-descending/index.js";import"../../../icons/quote/index.js";import"../../../icons/url-circle/index.js";import"../../../icons/show-ui/index.js";import"../../../icons/hide-ui/index.js";import"../../../icons/sort-user/index.js";import"../../../icons/happy-robot/index.js";import"../../../icons/happy-robot-gradient/index.js";import"../../../icons/min-window/index.js";import"../../../icons/max-window/index.js";import"../../../icons/manage-chat/index.js";import"../../../icons/analyze-urls/index.js";import"../../../icons/web-search/index.js";import"../../../icons/include-context/index.js";import"../../../icons/queue/index.js";import"../../../icons/sort-alphabet-ascending/index.js";import"../../../icons/sort-alphabet-descending/index.js";import"../../../icons/sort-date-ascending/index.js";import"../../../icons/sort-date-descending/index.js";import"../../../icons/cot-r1/index.js";import"../../../icons/news/index.js";import"../../../icons/volume/index.js";import"../../../icons/flag-ru/index.js";import"../../../icons/flag-kz/index.js";import"../../../icons/print/index.js";import"../../../icons/pc-icon-1/index.js";import"../../../icons/pc-icon-2/index.js";import"../../../icons/pc-icon-3/index.js";import"../../../icons/star-unfilled/index.js";import"../../../icons/image-generation/index.js";import"../../../icons/speech-synthesys/index.js";import"../../../icons/transcription/index.js";import"../../../icons/text-rewrite/index.js";import"../../../icons/code-generation/index.js";import"../../../icons/essay-generation/index.js";import"../../../icons/spelling/index.js";import"../../../icons/text-generation/index.js";import"../../../icons/traffic-analisys/index.js";import"../../../icons/fav-profile/index.js";import"../../../icons/exclamation/index.js";import"../../../icons/article/index.js";import"../../../icons/setchel/index.js";import"../../../icons/assembly/index.js";import"../../../icons/data-visualisation/index.js";import"../../../icons/document-analisys/index.js";import"../../../icons/problem-solvment/index.js";import"../../../icons/setting-analisys/index.js";import"../../../icons/translation/index.js";import"../../../icons/stars/index.js";import"../../../icons/academy/index.js";import"../../../icons/articles/index.js";import"../../../icons/blog-post/index.js";import"../../../icons/book/index.js";import"../../../icons/bow-tie/index.js";import"../../../icons/case-study/index.js";import"../../../icons/comments/index.js";import"../../../icons/guide/index.js";import"../../../icons/marketing/index.js";import"../../../icons/post/index.js";import"../../../icons/report/index.js";import"../../../icons/review/index.js";import"../../../icons/scientific-article/index.js";import"../../../icons/selling-text/index.js";import"../../../icons/textbook/index.js";import"../../../icons/wind/index.js";import"../../../icons/grok/index.js";import"../../../icons/deepseek/index.js";import"../../../icons/grid-horizontal/index.js";import"../../../icons/grid-vertical/index.js";import"../../../icons/star-gradient/index.js";import"../../../icons/qwen/index.js";import"../../../icons/sidebar-toggle-left/index.js";import"../../../icons/sidebar-toggle-right/index.js";import"../../../icons/system/index.js";import"../../../icons/selector/index.js";import"../../../icons/video-camera/index.js";import"../../../icons/music-note/index.js";import"../../../icons/add-profile/index.js";import"../../../icons/token-counter/index.js";import"../../../icons/customer-support/index.js";import"../../../icons/sort-alphabet-top-bottom/index.js";import"../../../icons/sort-alphabet-bottom-top/index.js";import"../../../icons/pause/index.js";import"../../../icons/play/index.js";import"../../../icons/restore-2/index.js";import"../../../icons/video-generation/index.js";import"../../../icons/veo-model/index.js";import"../../../icons/runway/index.js";import"../../../icons/queue-select/index.js";import"../../../icons/apple/index.js";import"../../../icons/mail-colored/index.js";import"../../../icons/shield/index.js";import"../../../icons/stars-gradient/index.js";import"../../../icons/fire/index.js";import"../../../icons/brain/index.js";import"../../../icons/mj-purple/index.js";import"../../../icons/claude-black/index.js";import"../../../icons/vk-filled/index.js";import"../../../icons/tg/index.js";import"../../../icons/gift/index.js";import"../../../icons/exchange/index.js";import"../../../icons/time/index.js";import"../../../icons/folder/index.js";import"../../../icons/history/index.js";import"../../../icons/money-plus/index.js";import"../../../icons/money-stack/index.js";import"../../../icons/sort-numeric-bottom/index.js";import"../../../icons/sort-numeric-top/index.js";import"../../../icons/bulb/index.js";import"../../../icons/prompt-queue/index.js";import"../../../icons/image/index.js";import"../../../icons/text/index.js";import"../../../icons/code/index.js";import"../../../icons/blue-grok/index.js";import"../../../icons/double-image/index.js";import{Portal as h}from"../../portal/index.js";import{SelectFieldGroup as f}from"./select-field-group/index.js";import{SelectFieldOptions as y}from"./option/list/index.js";import"./option/collapse/styled.js";import"../../icon/styled.js";import"@react-spring/web";import"react-markdown";import"../../tooltip/styled.js";import"../../tooltip/arrow/styled.js";import"../../../theme/index.js";import"../../tooltip/context.js";import{filterData as w}from"./filterData.js";const k=({isOpen:k,data:v=[],contentWidth:C,contentHeight:O,size:$="small",disableSelect:S=!1,disableScrollbar:z=!1,empty:q,after:W,tabs:T,search:P,searchPlaceholder:A,resetStyleState:G,placement:H,selectModalRef:M,disablePortal:B,blur:D=!1,x:F,y:I,width:K,isKeyboardOpen:R,value:V,multiple:_,modalWidth:E,openedModel:J,selectedColor:L,compactWidth:N,modalStyles:Q,onSearch:U,onOptionClick:X,onGroupCheckboxClick:Y,handleClose:Z,setValue:ii})=>{const[oi,si]=e([]),[ni,ei]=e(""),ti=t(0),ri=r(i=>{const{value:o}=i.currentTarget;null==U||U(o),ei(o)},[U,ei]),ci=r(i=>{var o;if("object"!=typeof i||!i.disabled){if("object"==typeof i&&i.noSelect)return null===(o=null==i?void 0:i.onClick)||void 0===o||o.call(i,i),void Z();null==X||X(i),S||"object"==typeof i&&("checkbox"===i.type||"checkbox-group"===i.type)||(_&&Array.isArray(V)?ii([...new Set([...V,i])]):ii(i)),("object"!=typeof i||"checkbox"!==i.type&&"checkbox-group"!==i.type)&&Z()}},[V,_,S,ii,X,Z]);c(()=>{si(J?[J]:[]),ti.current=0,ei("")},[G,J]);const di=r(i=>{ti.current=0,si([]),T&&T.onClick&&T.onClick(i)},[T]),pi=r(i=>si(o=>o.includes(i)?o.filter(o=>o!==i):[...o,i]),[]),mi=d(()=>B?n.Fragment:h,[B]),xi=d(()=>v.map(o=>{if(o&&"object"==typeof o&&"collapse"===o.type&&o.id&&!o.disabled){const{onClick:s}=o,n=i(o,["onClick"]),e=()=>{s&&s(o),o.id&&pi(o.id)},t=oi.includes(o.id);return Object.assign(Object.assign({},n),{open:t,onClick:e})}return o}),[v,oi,pi]);return o(mi,{children:o(p,{$isOpen:k,$contentWidth:C,$disablePortal:B,$placement:H,ref:M,style:Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({},Q),0!==F&&Object.assign(Object.assign({},"top-right"!==H&&{left:F}),"top-right"===H&&Object.assign(Object.assign({},void 0===C&&{left:`calc(${F}px - ${K})`}),"number"==typeof C&&{left:`calc(${F}px - ${C>K?`calc(var(--bothub-scale, 1) * ${C}px)`:`${K}px`})`}))),0!==I&&{top:I}),void 0===C&&{width:K}),"number"==typeof C&&{width:C>K?`calc(var(--bothub-scale, 1) * ${C}px)`:K}),children:o(m,{$blur:D,$placement:H,$width:E,$compactWidth:N,style:Object.assign(Object.assign({},"number"==typeof O&&O>=0&&{height:`calc(var(--bothub-scale, 1) * ${O}px)`}),"string"==typeof O&&{height:O}),children:o(x,{children:s(j,{$size:$,children:[!!T&&o(a,{children:o(l,Object.assign({},T,{onClick:di}))}),P&&o(g,{startIcon:o(u,{}),placeholder:A,value:ni,onChange:ri,onClick:()=>{R.current=!0},onBlur:()=>setTimeout(()=>{R.current=!1},500)}),xi.length>0?o(f,{scrollTop:ti.current,onScrollTopChange:i=>{ti.current=i},$size:$,$disableScrollbar:z,$followContentHeight:!!O,children:o(y,{value:V,data:U?xi:w(xi,ni),size:$,disableSelect:S,onGroupCheckboxClick:Y,onOptionClick:ci,selectedColor:L})}):q,W&&o(b,{children:o(y,{value:V,data:W,size:$,disableSelect:S,onOptionClick:ci,selectedColor:L})})]})})})})})};export{y as SelectFieldOptions,k as SelectModal,b as SelectModalAfter,x as SelectModalContent,j as SelectModalGroups,m as SelectModalPositionWrapper,g as SelectModalSearch,p as SelectModalStyled,l as SelectModalTabs,a as SelectModalTabsContainer};
@@ -1,14 +1,14 @@
1
1
  import React from 'react';
2
- import { SelectFieldDataItemComplex, SelectFieldGroupCheckboxClickEventHandler, SelectFieldSize } from '@/ui/components/select-field';
2
+ import { SelectFieldDataItem, SelectFieldGroupCheckboxClickEventHandler, SelectFieldSize } from '@/ui/components/select-field';
3
3
  import { SelectFieldOptionClickEventHandler, SelectFieldOptionsProps } from '../types';
4
- export type SelectFieldCheckboxGroupOptionProps<DataItem extends SelectFieldDataItemComplex<any>> = {
5
- value: DataItem | DataItem[] | null;
4
+ export type SelectFieldCheckboxGroupOptionProps = {
5
+ value: SelectFieldDataItem | SelectFieldDataItem[] | null;
6
6
  size: SelectFieldSize;
7
- item: DataItem;
8
- data: DataItem[];
9
- onGroupCheckboxClick?: SelectFieldGroupCheckboxClickEventHandler<DataItem>;
10
- onOptionClick: SelectFieldOptionClickEventHandler<DataItem> | undefined;
7
+ item: SelectFieldDataItem;
8
+ data: SelectFieldDataItem[];
9
+ onGroupCheckboxClick?: SelectFieldGroupCheckboxClickEventHandler;
10
+ onOptionClick: SelectFieldOptionClickEventHandler | undefined;
11
11
  icon?: React.ReactNode;
12
- SelectFieldOptions: React.FC<SelectFieldOptionsProps<DataItem>>;
12
+ SelectFieldOptions: React.FC<SelectFieldOptionsProps>;
13
13
  };
14
- export declare const SelectFieldCheckboxGroupOption: <DataItem extends SelectFieldDataItemComplex<any>>({ item, value, size, data, onOptionClick, onGroupCheckboxClick, icon, SelectFieldOptions, }: SelectFieldCheckboxGroupOptionProps<DataItem>) => import("react/jsx-runtime").JSX.Element;
14
+ export declare const SelectFieldCheckboxGroupOption: ({ item, value, size, data, onOptionClick, onGroupCheckboxClick, icon, SelectFieldOptions, }: SelectFieldCheckboxGroupOptionProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,10 +1,10 @@
1
1
  import React from 'react';
2
2
  import { SelectFieldDataItem, SelectFieldSize } from '@/ui/components/select-field';
3
3
  import { SelectFieldOptionClickEventHandler } from '../types';
4
- export interface SelectFieldCollapseOptionProps<DataItem extends SelectFieldDataItem<any>> extends React.PropsWithChildren, Pick<React.ComponentProps<'div'>, 'onMouseEnter' | 'onMouseLeave' | 'onPointerDown' | 'onPointerUp' | 'onPointerLeave'> {
4
+ export interface SelectFieldCollapseOptionProps extends React.PropsWithChildren, Pick<React.ComponentProps<'div'>, 'onMouseEnter' | 'onMouseLeave' | 'onPointerDown' | 'onPointerUp' | 'onPointerLeave'> {
5
5
  size: SelectFieldSize;
6
- item: DataItem;
7
- onClick?: SelectFieldOptionClickEventHandler<DataItem>;
6
+ item: SelectFieldDataItem;
7
+ onClick?: SelectFieldOptionClickEventHandler;
8
8
  icon?: React.ReactNode;
9
9
  }
10
- export declare const SelectFieldCollapseOption: <DataItem extends SelectFieldDataItem<any>>({ size, item, children, onClick, icon, ...props }: SelectFieldCollapseOptionProps<DataItem>) => import("react/jsx-runtime").JSX.Element;
10
+ export declare const SelectFieldCollapseOption: ({ size, item, children, onClick, icon, ...props }: SelectFieldCollapseOptionProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,3 +1,3 @@
1
- import { SelectFieldDataItem } from '@/ui/components/select-field/types';
1
+ import React from 'react';
2
2
  import { SelectFieldOptionsProps } from '../types';
3
- export declare const SelectFieldOptions: <DataItem extends SelectFieldDataItem<any>>({ value, data, size, disableSelect, selectedColor, onGroupCheckboxClick, onOptionClick, ...props }: SelectFieldOptionsProps<DataItem>) => import("react/jsx-runtime").JSX.Element;
3
+ export declare const SelectFieldOptions: React.FC<SelectFieldOptionsProps>;
@@ -1,10 +1,10 @@
1
1
  import { ComponentProps } from 'react';
2
2
  import { SelectFieldDataItemComplex, SelectFieldSize } from '../../types';
3
- export type SelectFieldOptionProps<DataItem extends SelectFieldDataItemComplex<any>> = {
4
- item: DataItem;
3
+ export type SelectFieldOptionProps = {
4
+ item: SelectFieldDataItemComplex;
5
5
  selected: boolean;
6
6
  disabled: boolean;
7
7
  size: SelectFieldSize;
8
8
  selectedColor?: string;
9
9
  } & ComponentProps<'div'>;
10
- export declare const SelectFieldOption: <DataItem extends SelectFieldDataItemComplex<any>>({ item, selected, disabled, size, selectedColor, ...rest }: SelectFieldOptionProps<DataItem>) => import("react/jsx-runtime").JSX.Element;
10
+ export declare const SelectFieldOption: ({ item, selected, disabled, size, selectedColor, ...rest }: SelectFieldOptionProps) => import("react/jsx-runtime").JSX.Element;
@@ -1,13 +1,13 @@
1
1
  import React from 'react';
2
- import { SelectFieldDataItem, SelectFieldSize } from '@/ui/components/select-field/types';
3
- export type SelectFieldOptionClickEventHandler<DataItem extends SelectFieldDataItem<any>> = (item: DataItem) => unknown;
4
- export type SelectFieldGroupCheckboxClickEventHandler<DataItem extends SelectFieldDataItem<any>> = (item: DataItem) => unknown;
5
- export interface SelectFieldOptionsProps<DataItem extends SelectFieldDataItem<any>> extends React.ComponentProps<'div'> {
6
- value: DataItem | DataItem[] | null;
7
- data: DataItem[];
2
+ import { SelectFieldData, SelectFieldDataItem, SelectFieldSize } from '@/ui/components/select-field/types';
3
+ export type SelectFieldOptionClickEventHandler = (item: SelectFieldDataItem) => unknown;
4
+ export type SelectFieldGroupCheckboxClickEventHandler = (item: SelectFieldDataItem) => unknown;
5
+ export interface SelectFieldOptionsProps extends React.ComponentProps<'div'> {
6
+ value: SelectFieldDataItem | SelectFieldDataItem[] | null;
7
+ data: SelectFieldData;
8
8
  size: SelectFieldSize;
9
9
  disableSelect?: boolean;
10
10
  selectedColor?: string;
11
- onGroupCheckboxClick?: SelectFieldGroupCheckboxClickEventHandler<DataItem>;
12
- onOptionClick?: SelectFieldOptionClickEventHandler<DataItem>;
11
+ onGroupCheckboxClick?: SelectFieldGroupCheckboxClickEventHandler;
12
+ onOptionClick?: SelectFieldOptionClickEventHandler;
13
13
  }
@@ -1,15 +1,15 @@
1
1
  import React from 'react';
2
2
  import { TooltipProps } from '@/ui/components/tooltip';
3
- export type SelectFieldChangeEventHandler<DataItem extends SelectFieldDataItem<any>> = (item: DataItem | null) => unknown;
4
- export type SelectFieldValueChangeEventHandler<DataItem extends SelectFieldDataItem<any>, ValueType = DataItem extends string ? DataItem : DataItem extends SelectFieldDataItemComplex<DataItem> ? DataItem['value'] : never> = (value: ValueType | null) => unknown;
5
- export type SelectFieldMultiChangeEventHandler<DataItem extends SelectFieldDataItem<any>> = (items: DataItem[]) => unknown;
6
- export type SelectFieldMultiValueChangeEventHandler<DataItem extends SelectFieldDataItem<any>, ValueType = DataItem extends string ? DataItem : DataItem extends SelectFieldDataItemComplex<DataItem> ? DataItem['value'] : never> = (value: ValueType[]) => unknown;
7
- export type SelectFieldOptionClickEventHandler<DataItem extends SelectFieldDataItem<any>> = (item: DataItem) => unknown;
8
- export type SelectFieldGroupCheckboxClickEventHandler<DataItem extends SelectFieldDataItem<any>> = (item: DataItem) => unknown;
3
+ export type SelectFieldChangeEventHandler = (item: SelectFieldDataItem | null) => unknown;
4
+ export type SelectFieldValueChangeEventHandler = (value: string | null) => unknown;
5
+ export type SelectFieldMultiChangeEventHandler = (items: SelectFieldDataItem[]) => unknown;
6
+ export type SelectFieldMultiValueChangeEventHandler = (value: string[]) => unknown;
7
+ export type SelectFieldOptionClickEventHandler = (item: SelectFieldDataItem) => unknown;
8
+ export type SelectFieldGroupCheckboxClickEventHandler = (item: SelectFieldDataItem) => unknown;
9
9
  export type SelectFieldInputChangeEventHandler = (value: string) => unknown;
10
10
  export type SelectFieldItemType = 'item' | 'divider' | 'collapse' | 'empty' | 'label' | 'radio' | 'checkbox' | 'checkbox-group';
11
11
  export type SelectFieldDataItemSimple = string;
12
- export type SelectFieldDataItemComplex<DataItem extends SelectFieldDataItem<any>> = {
12
+ export type SelectFieldDataItemComplex = {
13
13
  id?: number | string;
14
14
  type?: SelectFieldItemType;
15
15
  color?: string;
@@ -23,22 +23,22 @@ export type SelectFieldDataItemComplex<DataItem extends SelectFieldDataItem<any>
23
23
  tooltip?: TooltipProps;
24
24
  open?: boolean;
25
25
  backgroundHoverColor?: 'gradient' | 'primary';
26
- data?: DataItem[];
26
+ data?: SelectFieldDataItem[];
27
27
  best_model?: boolean;
28
28
  noSelect?: boolean;
29
29
  description?: string;
30
30
  selected?: boolean;
31
31
  checkedIcon?: React.ReactNode;
32
32
  radioName?: string;
33
- onClick?: SelectFieldOptionClickEventHandler<DataItem>;
34
- onGroupCheckboxClick?: SelectFieldGroupCheckboxClickEventHandler<DataItem>;
33
+ onClick?: SelectFieldOptionClickEventHandler;
34
+ onGroupCheckboxClick?: SelectFieldGroupCheckboxClickEventHandler;
35
35
  };
36
- export type SelectFieldDataItem<DataItem extends SelectFieldDataItem<any>> = string | SelectFieldDataItemComplex<DataItem>;
37
- export type SelectFieldData<DataItem extends SelectFieldDataItem<any>> = SelectFieldDataItem<DataItem>[];
36
+ export type SelectFieldDataItem = string | SelectFieldDataItemComplex;
37
+ export type SelectFieldData = SelectFieldDataItem[];
38
38
  export type SelectFieldSize = 'small' | 'md' | 'large';
39
39
  export type SelectFieldPlacement = 'bottom-left' | 'bottom-center' | 'top-left' | 'top-right';
40
40
  export type SelectFieldInputType = 'text' | 'search';
41
41
  export type ResetStyleStateType = string | number | boolean | null;
42
- export type SelectedItem<DataItem extends SelectFieldDataItem<any>> = DataItem | null;
43
- export type ValueType<DataItem extends SelectFieldDataItem<any>> = DataItem | DataItem[] | null;
44
- export type ValueSetter<DataItem extends SelectFieldDataItem<any>> = (value: ValueType<DataItem>) => void;
42
+ export type SelectedItem = SelectFieldDataItem | null;
43
+ export type ValueType = SelectFieldDataItem | SelectFieldDataItem[] | null;
44
+ export type ValueSetter = (value: ValueType) => void;
@@ -1,43 +1,27 @@
1
1
  import { SelectFieldChangeEventHandler, SelectFieldDataItem, SelectFieldMultiChangeEventHandler, SelectFieldMultiValueChangeEventHandler, SelectFieldPlacement, SelectFieldValueChangeEventHandler } from './types';
2
- export interface UseSelectFieldDefaultProps<DataItem extends SelectFieldDataItem<any>> {
2
+ import { ValueType } from '.';
3
+ export interface UseSelectFieldDefaultProps {
3
4
  multiple?: false;
4
- value?: DataItem | null;
5
- onChange?: SelectFieldChangeEventHandler<DataItem>;
6
- onValueChange?: SelectFieldValueChangeEventHandler<DataItem>;
5
+ value?: SelectFieldDataItem | null;
6
+ onChange?: SelectFieldChangeEventHandler;
7
+ onValueChange?: SelectFieldValueChangeEventHandler;
7
8
  }
8
- export interface UseSelectFieldMultiProps<DataItem extends SelectFieldDataItem<any>> {
9
+ export interface UseSelectFieldMultiProps {
9
10
  multiple: true;
10
- value?: DataItem[];
11
- onChange?: SelectFieldMultiChangeEventHandler<DataItem>;
12
- onValueChange?: SelectFieldMultiValueChangeEventHandler<DataItem>;
11
+ value?: SelectFieldDataItem[];
12
+ onChange?: SelectFieldMultiChangeEventHandler;
13
+ onValueChange?: SelectFieldMultiValueChangeEventHandler;
13
14
  }
14
- export type UseSelectFieldUnionProps<DataItem extends SelectFieldDataItem<any>> = UseSelectFieldDefaultProps<DataItem> | UseSelectFieldMultiProps<DataItem>;
15
- export type UseSelectFieldProps<DataItem extends SelectFieldDataItem<any>> = {
15
+ export type UseSelectFieldUnionProps = UseSelectFieldDefaultProps | UseSelectFieldMultiProps;
16
+ export type UseSelectFieldProps = {
16
17
  disabled?: boolean;
17
18
  placement?: SelectFieldPlacement;
18
19
  contentHeight?: number | string;
19
20
  onClose?: () => void;
20
21
  onSelectClick?: () => void;
21
- } & UseSelectFieldUnionProps<DataItem>;
22
- export type UseSelectFieldHook<DataItem extends SelectFieldDataItem<any>, TriggerType extends HTMLElement = HTMLDivElement> = (params: UseSelectFieldProps<DataItem>) => {
23
- x: number;
24
- y: number;
25
- width: number;
26
- isOpen: boolean;
27
- triggerRef: React.RefObject<TriggerType | null>;
28
- selectModalRef: React.RefObject<HTMLDivElement | null>;
29
- placement: SelectFieldPlacement;
30
- isKeyboardOpen: React.RefObject<boolean>;
31
- value: DataItem | DataItem[] | null;
32
- disabled: boolean;
33
- multiple: boolean;
34
- contentHeight?: number | string;
35
- handleInputClick: (native: boolean, event: React.MouseEvent<HTMLElement>) => void;
36
- handleClose: () => void;
37
- setValue: (value: DataItem | DataItem[] | null) => void;
38
- };
39
- export type UseSelectFieldReturnType<DataItem extends SelectFieldDataItem<any>, TriggerType extends HTMLElement = HTMLDivElement> = ReturnType<UseSelectFieldHook<DataItem, TriggerType>>;
40
- export declare const useSelectField: <DataItem extends SelectFieldDataItem<any>, TriggerType extends HTMLElement = HTMLDivElement>({ value: initialValue, multiple, disabled, placement: initialPlacement, contentHeight, onClose, onSelectClick, onChange, onValueChange, }: UseSelectFieldProps<DataItem>) => {
22
+ } & UseSelectFieldUnionProps;
23
+ export type UseSelectFieldReturnType = ReturnType<typeof useSelectField>;
24
+ export declare const useSelectField: <TriggerType extends HTMLElement = HTMLDivElement>({ value: initialValue, multiple, disabled, placement: initialPlacement, contentHeight, onClose, onSelectClick, onChange, onValueChange, }: UseSelectFieldProps) => {
41
25
  x: number;
42
26
  y: number;
43
27
  width: number;
@@ -46,11 +30,11 @@ export declare const useSelectField: <DataItem extends SelectFieldDataItem<any>,
46
30
  selectModalRef: import("react").RefObject<HTMLDivElement | null>;
47
31
  placement: "top-left" | "top-right" | "bottom-left" | "bottom-center";
48
32
  isKeyboardOpen: import("react").RefObject<boolean>;
49
- value: DataItem | DataItem[] | null;
33
+ value: ValueType;
50
34
  disabled: boolean;
51
35
  multiple: boolean;
52
36
  contentHeight: string | number | undefined;
53
37
  handleInputClick: (native: boolean, event: React.MouseEvent<HTMLElement>) => void;
54
38
  handleClose: () => void;
55
- setValue: (value: DataItem | DataItem[] | null) => void;
39
+ setValue: (value: ValueType) => void;
56
40
  };
@@ -1 +1 @@
1
- import{useState as e,useCallback as t,useRef as n,useEffect as o}from"react";import"unified";import"remark-parse";import"remark-gfm";import"mdast-util-to-markdown";import"../../utils/colors/calculateGrayScale.js";import"../../utils/colors/calculateAccentColors.js";import{findNearestScrollableParent as r}from"../../utils/findNearestScrollableParent.js";import"tslib";const i=({value:i,multiple:l=!1,disabled:s=!1,placement:c="bottom-left",contentHeight:u,onClose:a,onSelectClick:d,onChange:m,onValueChange:w})=>{const[p,f]=e(!1),[g,v]=e(0),[h,b]=e(0),[y,E]=e(0),[L,C]=e(u),[k,A]=e(c),H=t(e=>{if(l&&Array.isArray(e)){const t=m,n=w,o=e;null==t||t(e),null==n||n(o.map(e=>"string"==typeof e?e:"string"==typeof e.value?e.value:"").filter(e=>!!e))}if(!l&&!Array.isArray(e)){const t=m,n=w;null==t||t(e),e?"string"==typeof e?null==n||n(e):"string"==typeof e.value&&(null==n||n(e.value)):null==n||n(null)}},[l,m,w]);let[R,z]=e(l?[]:null);void 0!==i&&([R,z]=[i,H]);const X=n(!1),Y=n(null),j=n(null);o(()=>{const e=()=>{const e=Y.current;if(!e||!L||!u)return;let t=u;const{top:n,bottom:o}=e.getBoundingClientRect();t=k.includes("top")?n-20:window.innerHeight-o-20,"string"!=typeof u&&C(t<u?t:u)};return e(),window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[Y.current,L,k,u,p]);const B=t(()=>{f(!1),null==a||a()},[]);o(()=>{if(!p||!Y.current)return;const e=r(Y.current);return e?(e.addEventListener("scroll",B),()=>e.removeEventListener("scroll",B)):void 0},[p]),o(()=>{if(!p)return;const e=e=>{if(!X.current||"orientationchange"===e.type){if("mousedown"===e.type){const t=Y.current,n=j.current;if(null===t||null===n)return;if(t.contains(e.target)||n.contains(e.target))return}B()}};return document.addEventListener("mousedown",e),document.addEventListener("scroll",e),window.addEventListener("resize",e),window.addEventListener("orientationchange",e),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("scroll",e),window.removeEventListener("resize",e),window.removeEventListener("orientationchange",e)}},[p]);const S=t((e,t)=>{null==d||d();const n=Y.current,o=j.current;if(!n||!o||s)return;e&&t.stopPropagation();const r=window.innerHeight||document.documentElement.clientHeight,{width:i,height:l,top:a,bottom:m,left:w,right:g}=n.getBoundingClientRect(),{width:h}=o.getBoundingClientRect();let y=k;y=a-186<0||"number"==typeof u&&u>a&&r-m>a?"bottom-center"===y?"bottom-center":"bottom-left":m+186>r||"number"==typeof u&&u>r-m&&r-m<a?"top-right"===c?"top-right":"top-left":c;let L=0,C=0;switch(y){case"bottom-left":L=w+window.scrollX,C=a+window.scrollY+l;break;case"bottom-center":L=Math.floor((w+g)/2+window.scrollX-h/2),C=a+window.scrollY+l;break;case"top-left":L=w+window.scrollX,C=a+window.scrollY;break;case"top-right":L=w+window.scrollX+i,C=a+window.scrollY}v(L),b(C),E(i),A(y),f(!!e||!p)},[s,p,k,c,d]);return{x:g,y:h,width:y,isOpen:p,triggerRef:Y,selectModalRef:j,placement:k,isKeyboardOpen:X,value:R,disabled:s,multiple:l,contentHeight:L,handleInputClick:S,handleClose:B,setValue:e=>{z===H?z(e):(z(e),H(e))}}};export{i as useSelectField};
1
+ import{useState as e,useCallback as t,useRef as n,useEffect as o}from"react";import"unified";import"remark-parse";import"remark-gfm";import"mdast-util-to-markdown";import"../../utils/colors/calculateGrayScale.js";import"../../utils/colors/calculateAccentColors.js";import{findNearestScrollableParent as r}from"../../utils/findNearestScrollableParent.js";import"tslib";const i=({value:i,multiple:l=!1,disabled:s=!1,placement:c="bottom-left",contentHeight:u,onClose:a,onSelectClick:d,onChange:m,onValueChange:w})=>{const[p,f]=e(!1),[g,v]=e(0),[h,b]=e(0),[y,E]=e(0),[L,C]=e(u),[k,A]=e(c),H=t(e=>{if(l&&Array.isArray(e)){const t=w,n=e;null==m||m(e),null==t||t(n.map(e=>"string"==typeof e?e:"string"==typeof e.value?e.value:"").filter(e=>!!e))}if(!l&&!Array.isArray(e)){null==m||m(e);const t=w;e?"string"==typeof e?null==t||t(e):"string"==typeof e.value&&(null==t||t(e.value)):null==t||t(null)}},[l,m,w]);let[R,z]=e(l?[]:null);void 0!==i&&([R,z]=[i,H]);const X=n(!1),Y=n(null),j=n(null);o(()=>{const e=()=>{const e=Y.current;if(!e||!L||!u)return;let t=u;const{top:n,bottom:o}=e.getBoundingClientRect();t=k.includes("top")?n-20:window.innerHeight-o-20,"string"!=typeof u&&C(t<u?t:u)};return e(),window.addEventListener("resize",e),()=>window.removeEventListener("resize",e)},[Y.current,L,k,u,p]);const B=t(()=>{f(!1),null==a||a()},[]);o(()=>{if(!p||!Y.current)return;const e=r(Y.current);return e?(e.addEventListener("scroll",B),()=>e.removeEventListener("scroll",B)):void 0},[p]),o(()=>{if(!p)return;const e=e=>{if(!X.current||"orientationchange"===e.type){if("mousedown"===e.type){const t=Y.current,n=j.current;if(null===t||null===n)return;if(t.contains(e.target)||n.contains(e.target))return}B()}};return document.addEventListener("mousedown",e),document.addEventListener("scroll",e),window.addEventListener("resize",e),window.addEventListener("orientationchange",e),()=>{document.removeEventListener("mousedown",e),document.removeEventListener("scroll",e),window.removeEventListener("resize",e),window.removeEventListener("orientationchange",e)}},[p]);const S=t((e,t)=>{null==d||d();const n=Y.current,o=j.current;if(!n||!o||s)return;e&&t.stopPropagation();const r=window.innerHeight||document.documentElement.clientHeight,{width:i,height:l,top:a,bottom:m,left:w,right:g}=n.getBoundingClientRect(),{width:h}=o.getBoundingClientRect();let y=k;y=a-186<0||"number"==typeof u&&u>a&&r-m>a?"bottom-center"===y?"bottom-center":"bottom-left":m+186>r||"number"==typeof u&&u>r-m&&r-m<a?"top-right"===c?"top-right":"top-left":c;let L=0,C=0;switch(y){case"bottom-left":L=w+window.scrollX,C=a+window.scrollY+l;break;case"bottom-center":L=Math.floor((w+g)/2+window.scrollX-h/2),C=a+window.scrollY+l;break;case"top-left":L=w+window.scrollX,C=a+window.scrollY;break;case"top-right":L=w+window.scrollX+i,C=a+window.scrollY}v(L),b(C),E(i),A(y),f(!!e||!p)},[s,p,k,c,d]);return{x:g,y:h,width:y,isOpen:p,triggerRef:Y,selectModalRef:j,placement:k,isKeyboardOpen:X,value:R,disabled:s,multiple:l,contentHeight:L,handleInputClick:S,handleClose:B,setValue:e=>{z===H?z(e):(z(e),H(e))}}};export{i as useSelectField};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bothub-chat/ui",
3
- "version": "2.61.1-feat-generics-in-select-b6b6cf11-a2ed-403a-b1b1-247607966754",
3
+ "version": "2.61.1",
4
4
  "description": "Bothub UI Components",
5
5
  "keywords": [
6
6
  "bot",