x-ui-design 0.6.45 → 0.6.47

package/dist/esm/types/components/Select/Select.d.ts

@@ -1,10 +1,10 @@
 import React, { ReactElement } from 'react';
 import { SelectProps } from '../../types/select';
 import './style.css';
-declare const Select: {
+declare const _default: React.MemoExoticComponent<{
     ({ prefixCls, id, searchValue, autoClearSearchValue, filterOption, optionFilterProp, children, options, listHeight, menuItemSelectedIcon, mode, value, defaultValue, maxCount, disabled, loading, placeholder, allowClear, filterable, defaultOpen, size, error, dropdownClassName, className, suffixIcon, searchIcon, style, showSearch, open, closeFromParent, showArrow, notFoundContent, noStyle, feedbackIcons, placement, removeIcon, maxTagCount, onSearch, onSelect, onDeselect, onClear, onChange, onClose, tagRender, getPopupContainer, dropdownRender, onDropdownVisibleChange, ref }: SelectProps): ReactElement;
     displayName: string;
 } & {
     Option: React.FC<import("../../types/select").OptionProps>;
-};
-export default Select;
+}>;
+export default _default;

package/dist/esm/types/index.d.ts

@@ -14,7 +14,56 @@ declare const Textarea: import("react").ComponentType<import("@/types/input").Te
 declare const Radio: import("react").ComponentType<import("@/types/radio").RadioProps>;
 declare const RadioButton: import("react").ComponentType<import("@/types/radio").RadioButtonProps>;
 declare const RadioGroup: import("react").ComponentType<import("@/types/radio").RadioGroupProps>;
-declare const Select: import("react").ComponentType<import("@/types/select").SelectProps>;
+declare const Select: import("react").ComponentType<import("@/types").DefaultProps & {
+    id?: string;
+    searchValue?: string;
+    onSearch?: (value: string) => void;
+    autoClearSearchValue?: boolean;
+    onSelect?: (value: import("@/types").RuleTypes, option?: import("@/types/select").OptionType) => void;
+    onDeselect?: (value: string, option?: import("@/types/select").OptionType) => void;
+    filterOption?: boolean | ((input: string, option: import("@/types/select").OptionType) => boolean);
+    optionFilterProp?: string;
+    options?: import("@/types/select").OptionType[];
+    children?: import("react").ReactNode;
+    defaultActiveFirstOption?: boolean;
+    listHeight?: number;
+    menuItemSelectedIcon?: import("react").ReactNode;
+    mode?: "default" | "multiple" | "tags";
+    value?: import("@/types").RuleTypes;
+    defaultValue?: import("@/types").RuleTypes;
+    maxCount?: number;
+    onChange?: (e: import("@/types").RuleTypes, option?: import("@/types/select").OptionType) => void;
+    onClose?: () => void;
+    disabled?: boolean;
+    loading?: boolean;
+    placeholder?: string;
+    allowClear?: boolean;
+    filterable?: boolean;
+    defaultOpen?: boolean;
+    size?: "small" | "middle" | "large";
+    onClear?: () => void;
+    error?: boolean;
+    showSearch?: boolean;
+    tagRender?: ((props: import("@/types/select").CustomTagProps) => import("react").ReactElement) | undefined;
+    maxTagPlaceholder?: import("react").ReactNode | ((omittedValues: import("@/types/select").DisplayValueType[]) => import("react").ReactNode);
+    dropdownClassName?: string;
+    showArrow?: boolean;
+    onBlur?: import("react").FocusEventHandler<HTMLElement> | undefined;
+    onDropdownVisibleChange?: ((open: boolean, selected: import("@/types").RuleType) => void) | undefined;
+    showAction?: ("click" | "focus")[] | undefined;
+    suffixIcon?: import("react").ReactNode;
+    searchIcon?: import("react").ReactNode;
+    open?: boolean;
+    notFoundContent?: import("react").ReactNode;
+    getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
+    dropdownRender?: (menu: import("react").ReactNode) => import("react").ReactNode;
+    feedbackIcons?: boolean;
+    placement?: "bottomLeft" | "bottomRight" | "topLeft" | "topRight";
+    removeIcon?: import("react").ReactNode;
+    maxTagCount?: number | "responsive";
+    ref?: import("react").ForwardedRef<HTMLDivElement>;
+    closeFromParent?: boolean;
+}>;
 declare const Option: import("react").ComponentType<import("@/types/select").OptionProps>;
 declare const Tag: import("react").ComponentType<import("@/types/select").CustomTagProps>;
 declare const Skeleton: import("react").ComponentType<import("./types/skeleton").SkeletonProps>;

package/dist/index.d.ts

@@ -2,6 +2,8 @@ import * as react from 'react';
 import { CSSProperties, ReactNode } from 'react';
 import * as __types_select from '@/types/select';
 export { CustomTagProps, DisplayValueType, OptionProps, OptionType, SelectProps, TagProps } from '@/types/select';
+import * as __types from '@/types';
+export { DefaultProps, MouseEventHandlerSelect, RuleType, RuleTypes, SyntheticBaseEvent, TargetProps } from '@/types';
 import * as __types_radio from '@/types/radio';
 export { RadioButtonProps, RadioGroupProps, RadioProps } from '@/types/radio';
 import * as __types_input from '@/types/input';
@@ -19,7 +21,6 @@ export { BaseButtonProps, ButtonProps, ButtonType } from '@/types/button';
 export { ArrowIcon, CalendarIcon, CheckIcon, ClearIcon, DateDistanceIcon, ErrorIcon, LoadingIcon, SearchIcon, SpinerIcon, StampleIcon, SuccessIcon, TimeIcon, TrashIcon } from '@/components/Icons';
 export { useForm } from '@/hooks/useForm';
 export { useWatch } from '@/hooks/useWatch';
-export { DefaultProps, MouseEventHandlerSelect, RuleType, RuleTypes, SyntheticBaseEvent, TargetProps } from '@/types';
 export { FormContext } from '@/components/Form/Form';
 export { clsx, createArray, parseValue } from '@/helpers';
 export { flattenChildren } from '@/helpers/flatten';
@@ -117,7 +118,56 @@ declare const Textarea: react.ComponentType<__types_input.TextareaProps>;
 declare const Radio: react.ComponentType<__types_radio.RadioProps>;
 declare const RadioButton: react.ComponentType<__types_radio.RadioButtonProps>;
 declare const RadioGroup: react.ComponentType<__types_radio.RadioGroupProps>;
-declare const Select: react.ComponentType<__types_select.SelectProps>;
+declare const Select: react.ComponentType<__types.DefaultProps & {
+    id?: string;
+    searchValue?: string;
+    onSearch?: (value: string) => void;
+    autoClearSearchValue?: boolean;
+    onSelect?: (value: __types.RuleTypes, option?: __types_select.OptionType) => void;
+    onDeselect?: (value: string, option?: __types_select.OptionType) => void;
+    filterOption?: boolean | ((input: string, option: __types_select.OptionType) => boolean);
+    optionFilterProp?: string;
+    options?: __types_select.OptionType[];
+    children?: react.ReactNode;
+    defaultActiveFirstOption?: boolean;
+    listHeight?: number;
+    menuItemSelectedIcon?: react.ReactNode;
+    mode?: "default" | "multiple" | "tags";
+    value?: __types.RuleTypes;
+    defaultValue?: __types.RuleTypes;
+    maxCount?: number;
+    onChange?: (e: __types.RuleTypes, option?: __types_select.OptionType) => void;
+    onClose?: () => void;
+    disabled?: boolean;
+    loading?: boolean;
+    placeholder?: string;
+    allowClear?: boolean;
+    filterable?: boolean;
+    defaultOpen?: boolean;
+    size?: "small" | "middle" | "large";
+    onClear?: () => void;
+    error?: boolean;
+    showSearch?: boolean;
+    tagRender?: ((props: __types_select.CustomTagProps) => react.ReactElement) | undefined;
+    maxTagPlaceholder?: react.ReactNode | ((omittedValues: __types_select.DisplayValueType[]) => react.ReactNode);
+    dropdownClassName?: string;
+    showArrow?: boolean;
+    onBlur?: react.FocusEventHandler<HTMLElement> | undefined;
+    onDropdownVisibleChange?: ((open: boolean, selected: __types.RuleType) => void) | undefined;
+    showAction?: ("click" | "focus")[] | undefined;
+    suffixIcon?: react.ReactNode;
+    searchIcon?: react.ReactNode;
+    open?: boolean;
+    notFoundContent?: react.ReactNode;
+    getPopupContainer?: (triggerNode: HTMLElement) => HTMLElement;
+    dropdownRender?: (menu: react.ReactNode) => react.ReactNode;
+    feedbackIcons?: boolean;
+    placement?: "bottomLeft" | "bottomRight" | "topLeft" | "topRight";
+    removeIcon?: react.ReactNode;
+    maxTagCount?: number | "responsive";
+    ref?: react.ForwardedRef<HTMLDivElement>;
+    closeFromParent?: boolean;
+}>;
 declare const Option: react.ComponentType<__types_select.OptionProps>;
 declare const Tag: react.ComponentType<__types_select.CustomTagProps>;
 declare const Skeleton: react.ComponentType<SkeletonProps>;

package/dist/index.esm.js

@@ -1,5 +1,5 @@
 import require$$1 from 'react/jsx-runtime';
-import React, { useRef, useState, Children, isValidElement, Fragment, Suspense, useContext, useMemo, useEffect, createContext, useImperativeHandle, useCallback, useLayoutEffect } from 'react';
+import React, { useRef, useState, Children, isValidElement, Fragment, Suspense, useContext, useMemo, useEffect, createContext, useImperativeHandle, memo, useCallback, useLayoutEffect } from 'react';
 import { createPortal } from 'react-dom';
 import ReactDOMServer from 'react-dom/server';
 
@@ -1340,7 +1340,7 @@ const RadioButton$1 = dynamic$1(() => Promise.resolve().then(function () { retur
 const RadioGroup$1 = dynamic$1(() => Promise.resolve().then(function () { return Group; }), {
   ssr: false
 });
-const Select$2 = dynamic$1(() => Promise.resolve().then(function () { return Select$1; }), {
+const Select$3 = dynamic$1(() => Promise.resolve().then(function () { return Select$2; }), {
   ssr: false
 });
 const Option$2 = dynamic$1(() => Promise.resolve().then(function () { return Option$1; }), {
@@ -3647,13 +3647,7 @@ const SelectComponent = ({
       isOpen: isOpen
     }));
   }, [showArrow, showSearch, isOpen, suffixIcon, searchIcon]);
-  const extractedOptions = useMemo(() => {
-    return children ? extractOptions(children) : Array.isArray(options) ? options : [];
-  }, [children, children]);
-  const triggerNode = useMemo(() => {
-    return selectRef.current?.querySelector(`.${prefixCls}-trigger`);
-  }, [prefixCls]);
-  function extractOptions(children, options) {
+  const extractOptions = useCallback((children, options) => {
     const result = [];
     const flatten = nodes => {
       try {
@@ -3677,7 +3671,13 @@ const SelectComponent = ({
       return result;
     }
     return options || [];
-  }
+  }, []);
+  const extractedOptions = useMemo(() => {
+    return children ? extractOptions(children) : Array.isArray(options) ? options : [];
+  }, [children, children]);
+  const triggerNode = useMemo(() => {
+    return selectRef.current?.querySelector(`.${prefixCls}-trigger`);
+  }, [prefixCls]);
   const filteredOptions = extractedOptions.filter(option => {
     if (typeof filterOption === 'function') {
       return filterOption(searchQuery, option);
@@ -3915,10 +3915,11 @@ SelectComponent.displayName = 'Select';
 const Select = Object.assign(SelectComponent, {
   Option
 });
+var Select$1 = /*#__PURE__*/memo(Select);
 
-var Select$1 = /*#__PURE__*/Object.freeze({
+var Select$2 = /*#__PURE__*/Object.freeze({
 	__proto__: null,
-	default: Select
+	default: Select$1
 });
 
 var css_248z$4 = "@keyframes xUi-skeleton-loading{0%{background-position:100% 50%}to{background-position:0 50%}}.xUi-skeleton-element{display:inline-block!important;width:auto!important}.xUi-skeleton-button{background:hsla(0,0%,75%,.2);border-radius:4px;display:inline-block;height:32px;line-height:32px;min-width:64px;vertical-align:top;width:64px}.xUi-skeleton-button-sm{height:24px;line-height:24px;min-width:48px;width:48px}.xUi-skeleton-button-lg{height:44px;line-height:44px;min-width:80px;width:80px}.xUi-skeleton-active .xUi-skeleton-button{animation:xUi-skeleton-loading 1.4s ease infinite;background:linear-gradient(90deg,hsla(0,0%,75%,.2) 25%,hsla(0,0%,51%,.24) 37%,hsla(0,0%,75%,.2) 63%);background-size:400% 100%}";
@@ -4142,5 +4143,5 @@ var Skeleton$1 = /*#__PURE__*/Object.freeze({
 	default: Skeleton
 });
 
-export { ArrowIcon, Button$3 as Button, CalendarIcon, CheckIcon, Checkbox$2 as Checkbox, ClearIcon, DateDistanceIcon, DatePicker$2 as DatePicker, Empty$1 as Empty, ErrorIcon, Form, FormContext, FormItem, Input$3 as Input, LoadingIcon, Option$2 as Option, Radio$2 as Radio, RadioButton$1 as RadioButton, RadioGroup$1 as RadioGroup, RangePicker$2 as RangePicker, SearchIcon, Select$2 as Select, Skeleton$2 as Skeleton, SkeletonAvatar$1 as SkeletonAvatar, SkeletonButton$1 as SkeletonButton, SkeletonImage$1 as SkeletonImage, SkeletonInput$1 as SkeletonInput, SpinerIcon, StampleIcon, SuccessIcon, Switch$2 as Switch, Tag$2 as Tag, Textarea$2 as Textarea, TimeIcon, TimePicker$2 as TimePicker, TrashIcon, Upload$2 as Upload, clsx, createArray, flattenChildren, parseValue, useForm, useWatch };
+export { ArrowIcon, Button$3 as Button, CalendarIcon, CheckIcon, Checkbox$2 as Checkbox, ClearIcon, DateDistanceIcon, DatePicker$2 as DatePicker, Empty$1 as Empty, ErrorIcon, Form, FormContext, FormItem, Input$3 as Input, LoadingIcon, Option$2 as Option, Radio$2 as Radio, RadioButton$1 as RadioButton, RadioGroup$1 as RadioGroup, RangePicker$2 as RangePicker, SearchIcon, Select$3 as Select, Skeleton$2 as Skeleton, SkeletonAvatar$1 as SkeletonAvatar, SkeletonButton$1 as SkeletonButton, SkeletonImage$1 as SkeletonImage, SkeletonInput$1 as SkeletonInput, SpinerIcon, StampleIcon, SuccessIcon, Switch$2 as Switch, Tag$2 as Tag, Textarea$2 as Textarea, TimeIcon, TimePicker$2 as TimePicker, TrashIcon, Upload$2 as Upload, clsx, createArray, flattenChildren, parseValue, useForm, useWatch };
 //# sourceMappingURL=index.esm.js.map