1
This commit is contained in:
+98
@@ -0,0 +1,98 @@
|
||||
import type { BuildInPlacements } from '@rc-component/trigger/lib/interface';
|
||||
import type { BaseSelectPropsWithoutPrivate, BaseSelectRef } from '@rc-component/select';
|
||||
import type { Placement } from '@rc-component/select/lib/BaseSelect';
|
||||
import * as React from 'react';
|
||||
import Panel from './Panel';
|
||||
import { SHOW_CHILD, SHOW_PARENT } from './utils/commonUtil';
|
||||
export interface BaseOptionType {
|
||||
disabled?: boolean;
|
||||
disableCheckbox?: boolean;
|
||||
label?: React.ReactNode;
|
||||
value?: string | number | null;
|
||||
children?: DefaultOptionType[];
|
||||
}
|
||||
export type DefaultOptionType = BaseOptionType & Record<string, any>;
|
||||
export interface SearchConfig<OptionType extends DefaultOptionType = DefaultOptionType, ValueField extends keyof OptionType = keyof OptionType> {
|
||||
filter?: (inputValue: string, options: OptionType[], fieldNames: FieldNames<OptionType, ValueField>) => boolean;
|
||||
render?: (inputValue: string, path: OptionType[], prefixCls: string, fieldNames: FieldNames<OptionType, ValueField>) => React.ReactNode;
|
||||
sort?: (a: OptionType[], b: OptionType[], inputValue: string, fieldNames: FieldNames<OptionType, ValueField>) => number;
|
||||
matchInputWidth?: boolean;
|
||||
limit?: number | false;
|
||||
searchValue?: string;
|
||||
onSearch?: (value: string) => void;
|
||||
autoClearSearchValue?: boolean;
|
||||
}
|
||||
export type ShowCheckedStrategy = typeof SHOW_PARENT | typeof SHOW_CHILD;
|
||||
interface BaseCascaderProps<OptionType extends DefaultOptionType = DefaultOptionType, ValueField extends keyof OptionType = keyof OptionType> extends Omit<BaseSelectPropsWithoutPrivate, 'tokenSeparators' | 'labelInValue' | 'mode' | 'showSearch'> {
|
||||
id?: string;
|
||||
prefixCls?: string;
|
||||
fieldNames?: FieldNames<OptionType, ValueField>;
|
||||
optionRender?: (option: OptionType) => React.ReactNode;
|
||||
children?: React.ReactElement;
|
||||
changeOnSelect?: boolean;
|
||||
displayRender?: (label: string[], selectedOptions?: OptionType[]) => React.ReactNode;
|
||||
checkable?: boolean | React.ReactNode;
|
||||
showCheckedStrategy?: ShowCheckedStrategy;
|
||||
/** @deprecated please use showSearch.autoClearSearchValue */
|
||||
autoClearSearchValue?: boolean;
|
||||
showSearch?: boolean | SearchConfig<OptionType>;
|
||||
/** @deprecated please use showSearch.searchValue */
|
||||
searchValue?: string;
|
||||
/** @deprecated please use showSearch.onSearch */
|
||||
onSearch?: (value: string) => void;
|
||||
expandTrigger?: 'hover' | 'click';
|
||||
options?: OptionType[];
|
||||
/** @private Internal usage. Do not use in your production. */
|
||||
popupPrefixCls?: string;
|
||||
loadData?: (selectOptions: OptionType[]) => void;
|
||||
popupClassName?: string;
|
||||
popupMenuColumnStyle?: React.CSSProperties;
|
||||
placement?: Placement;
|
||||
builtinPlacements?: BuildInPlacements;
|
||||
onPopupVisibleChange?: (open: boolean) => void;
|
||||
expandIcon?: React.ReactNode;
|
||||
loadingIcon?: React.ReactNode;
|
||||
}
|
||||
export interface FieldNames<OptionType extends DefaultOptionType = DefaultOptionType, ValueField extends keyof OptionType = keyof OptionType> {
|
||||
label?: keyof OptionType;
|
||||
value?: keyof OptionType | ValueField;
|
||||
children?: keyof OptionType;
|
||||
}
|
||||
export type ValueType<OptionType extends DefaultOptionType = DefaultOptionType, ValueField extends keyof OptionType = keyof OptionType> = keyof OptionType extends ValueField ? unknown extends OptionType['value'] ? OptionType[ValueField] : OptionType['value'] : OptionType[ValueField];
|
||||
export type GetValueType<OptionType extends DefaultOptionType = DefaultOptionType, ValueField extends keyof OptionType = keyof OptionType, Multiple extends boolean | React.ReactNode = false> = false extends Multiple ? ValueType<Required<OptionType>, ValueField>[] : ValueType<Required<OptionType>, ValueField>[][];
|
||||
export type GetOptionType<OptionType extends DefaultOptionType = DefaultOptionType, Multiple extends boolean | React.ReactNode = false> = false extends Multiple ? OptionType[] : OptionType[][];
|
||||
type SemanticName = 'input' | 'prefix' | 'suffix' | 'placeholder' | 'content' | 'item' | 'itemContent' | 'itemRemove';
|
||||
type PopupSemantic = 'list' | 'listItem';
|
||||
export interface CascaderProps<OptionType extends DefaultOptionType = DefaultOptionType, ValueField extends keyof OptionType = keyof OptionType, Multiple extends boolean | React.ReactNode = false> extends BaseCascaderProps<OptionType, ValueField> {
|
||||
styles?: Partial<Record<SemanticName, React.CSSProperties>> & {
|
||||
popup?: Partial<Record<PopupSemantic, React.CSSProperties>>;
|
||||
};
|
||||
classNames?: Partial<Record<SemanticName, string>> & {
|
||||
popup?: Partial<Record<PopupSemantic, string>>;
|
||||
};
|
||||
checkable?: Multiple;
|
||||
value?: GetValueType<OptionType, ValueField, Multiple>;
|
||||
defaultValue?: GetValueType<OptionType, ValueField, Multiple>;
|
||||
onChange?: (value: GetValueType<OptionType, ValueField, Multiple>, selectOptions: GetOptionType<OptionType, Multiple>) => void;
|
||||
}
|
||||
export type SingleValueType = (string | number)[];
|
||||
export type LegacyKey = string | number;
|
||||
export type InternalValueType = SingleValueType | SingleValueType[];
|
||||
export interface InternalFieldNames extends Required<FieldNames> {
|
||||
key: string;
|
||||
}
|
||||
export type InternalCascaderProps = Omit<CascaderProps, 'onChange' | 'value' | 'defaultValue'> & {
|
||||
value?: InternalValueType;
|
||||
defaultValue?: InternalValueType;
|
||||
onChange?: (value: InternalValueType, selectOptions: BaseOptionType[] | BaseOptionType[][]) => void;
|
||||
};
|
||||
export type CascaderRef = Omit<BaseSelectRef, 'scrollTo'>;
|
||||
declare const Cascader: (<OptionType extends DefaultOptionType = DefaultOptionType, ValueField extends keyof OptionType = keyof OptionType, Multiple extends React.ReactNode = false>(props: React.PropsWithChildren<CascaderProps<OptionType, ValueField, Multiple>> & {
|
||||
ref?: React.Ref<CascaderRef>;
|
||||
}) => React.ReactElement) & {
|
||||
displayName?: string | undefined;
|
||||
SHOW_PARENT: typeof SHOW_PARENT;
|
||||
SHOW_CHILD: typeof SHOW_CHILD;
|
||||
Panel: typeof Panel;
|
||||
};
|
||||
export default Cascader;
|
||||
+235
@@ -0,0 +1,235 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _select = require("@rc-component/select");
|
||||
var _useId = _interopRequireDefault(require("@rc-component/util/lib/hooks/useId"));
|
||||
var _useEvent = _interopRequireDefault(require("@rc-component/util/lib/hooks/useEvent"));
|
||||
var _useControlledState = _interopRequireDefault(require("@rc-component/util/lib/hooks/useControlledState"));
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _context = _interopRequireDefault(require("./context"));
|
||||
var _useDisplayValues = _interopRequireDefault(require("./hooks/useDisplayValues"));
|
||||
var _useMissingValues = _interopRequireDefault(require("./hooks/useMissingValues"));
|
||||
var _useOptions = _interopRequireDefault(require("./hooks/useOptions"));
|
||||
var _useSearchConfig = _interopRequireDefault(require("./hooks/useSearchConfig"));
|
||||
var _useSearchOptions = _interopRequireDefault(require("./hooks/useSearchOptions"));
|
||||
var _useSelect = _interopRequireDefault(require("./hooks/useSelect"));
|
||||
var _useValues = _interopRequireDefault(require("./hooks/useValues"));
|
||||
var _OptionList = _interopRequireDefault(require("./OptionList"));
|
||||
var _Panel = _interopRequireDefault(require("./Panel"));
|
||||
var _commonUtil = require("./utils/commonUtil");
|
||||
var _treeUtil = require("./utils/treeUtil");
|
||||
var _warningPropsUtil = require("./utils/warningPropsUtil");
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
const Cascader = /*#__PURE__*/React.forwardRef((props, ref) => {
|
||||
const {
|
||||
// MISC
|
||||
id,
|
||||
prefixCls = 'rc-cascader',
|
||||
fieldNames,
|
||||
// Value
|
||||
defaultValue,
|
||||
value,
|
||||
changeOnSelect,
|
||||
onChange,
|
||||
displayRender,
|
||||
checkable,
|
||||
// Search
|
||||
showSearch,
|
||||
// Trigger
|
||||
expandTrigger,
|
||||
// Options
|
||||
options,
|
||||
popupPrefixCls,
|
||||
loadData,
|
||||
open,
|
||||
popupClassName,
|
||||
popupMenuColumnStyle,
|
||||
popupStyle: customPopupStyle,
|
||||
classNames,
|
||||
styles,
|
||||
placement,
|
||||
onPopupVisibleChange,
|
||||
// Icon
|
||||
expandIcon = '>',
|
||||
loadingIcon,
|
||||
// Children
|
||||
children,
|
||||
popupMatchSelectWidth = false,
|
||||
showCheckedStrategy = _commonUtil.SHOW_PARENT,
|
||||
optionRender,
|
||||
...restProps
|
||||
} = props;
|
||||
const mergedId = (0, _useId.default)(id);
|
||||
const multiple = !!checkable;
|
||||
|
||||
// =========================== Values ===========================
|
||||
const [interanlRawValues, setRawValues] = (0, _useControlledState.default)(defaultValue, value);
|
||||
const rawValues = (0, _commonUtil.toRawValues)(interanlRawValues);
|
||||
|
||||
// ========================= FieldNames =========================
|
||||
const mergedFieldNames = React.useMemo(() => (0, _commonUtil.fillFieldNames)(fieldNames), /* eslint-disable react-hooks/exhaustive-deps */
|
||||
[JSON.stringify(fieldNames)]
|
||||
/* eslint-enable react-hooks/exhaustive-deps */);
|
||||
|
||||
// =========================== Option ===========================
|
||||
const [mergedOptions, getPathKeyEntities, getValueByKeyPath] = (0, _useOptions.default)(mergedFieldNames, options);
|
||||
|
||||
// =========================== Search ===========================
|
||||
const [mergedShowSearch, searchConfig] = (0, _useSearchConfig.default)(showSearch, props);
|
||||
const {
|
||||
autoClearSearchValue = true,
|
||||
searchValue,
|
||||
onSearch
|
||||
} = searchConfig;
|
||||
const [internalSearchValue, setSearchValue] = (0, _useControlledState.default)('', searchValue);
|
||||
const mergedSearchValue = internalSearchValue || '';
|
||||
const onInternalSearch = (searchText, info) => {
|
||||
setSearchValue(searchText);
|
||||
if (info.source !== 'blur' && onSearch) {
|
||||
onSearch(searchText);
|
||||
}
|
||||
};
|
||||
const searchOptions = (0, _useSearchOptions.default)(mergedSearchValue, mergedOptions, mergedFieldNames, popupPrefixCls || prefixCls, searchConfig, changeOnSelect || multiple);
|
||||
|
||||
// =========================== Values ===========================
|
||||
const getMissingValues = (0, _useMissingValues.default)(mergedOptions, mergedFieldNames);
|
||||
|
||||
// Fill `rawValues` with checked conduction values
|
||||
const [checkedValues, halfCheckedValues, missingCheckedValues] = (0, _useValues.default)(multiple, rawValues, getPathKeyEntities, getValueByKeyPath, getMissingValues);
|
||||
const deDuplicatedValues = React.useMemo(() => {
|
||||
const checkedKeys = (0, _commonUtil.toPathKeys)(checkedValues);
|
||||
const deduplicateKeys = (0, _treeUtil.formatStrategyValues)(checkedKeys, getPathKeyEntities, showCheckedStrategy);
|
||||
return [...missingCheckedValues, ...getValueByKeyPath(deduplicateKeys)];
|
||||
}, [checkedValues, getPathKeyEntities, getValueByKeyPath, missingCheckedValues, showCheckedStrategy]);
|
||||
const displayValues = (0, _useDisplayValues.default)(deDuplicatedValues, mergedOptions, mergedFieldNames, multiple, displayRender);
|
||||
|
||||
// =========================== Change ===========================
|
||||
const triggerChange = (0, _useEvent.default)(nextValues => {
|
||||
setRawValues(nextValues);
|
||||
|
||||
// Save perf if no need trigger event
|
||||
if (onChange) {
|
||||
const nextRawValues = (0, _commonUtil.toRawValues)(nextValues);
|
||||
const valueOptions = nextRawValues.map(valueCells => (0, _treeUtil.toPathOptions)(valueCells, mergedOptions, mergedFieldNames).map(valueOpt => valueOpt.option));
|
||||
const triggerValues = multiple ? nextRawValues : nextRawValues[0];
|
||||
const triggerOptions = multiple ? valueOptions : valueOptions[0];
|
||||
onChange(triggerValues, triggerOptions);
|
||||
}
|
||||
});
|
||||
|
||||
// =========================== Select ===========================
|
||||
const handleSelection = (0, _useSelect.default)(multiple, triggerChange, checkedValues, halfCheckedValues, missingCheckedValues, getPathKeyEntities, getValueByKeyPath, showCheckedStrategy);
|
||||
const onInternalSelect = (0, _useEvent.default)(valuePath => {
|
||||
if (!multiple || autoClearSearchValue) {
|
||||
setSearchValue('');
|
||||
}
|
||||
handleSelection(valuePath);
|
||||
});
|
||||
|
||||
// Display Value change logic
|
||||
const onDisplayValuesChange = (_, info) => {
|
||||
if (info.type === 'clear') {
|
||||
triggerChange([]);
|
||||
return;
|
||||
}
|
||||
|
||||
// Cascader do not support `add` type. Only support `remove`
|
||||
const {
|
||||
valueCells
|
||||
} = info.values[0];
|
||||
onInternalSelect(valueCells);
|
||||
};
|
||||
const onInternalPopupVisibleChange = nextVisible => {
|
||||
onPopupVisibleChange?.(nextVisible);
|
||||
};
|
||||
|
||||
// ========================== Warning ===========================
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
(0, _warningPropsUtil.warningNullOptions)(mergedOptions, mergedFieldNames);
|
||||
}
|
||||
|
||||
// ========================== Context ===========================
|
||||
const cascaderContext = React.useMemo(() => ({
|
||||
classNames,
|
||||
styles,
|
||||
options: mergedOptions,
|
||||
fieldNames: mergedFieldNames,
|
||||
values: checkedValues,
|
||||
halfValues: halfCheckedValues,
|
||||
changeOnSelect,
|
||||
onSelect: onInternalSelect,
|
||||
checkable,
|
||||
searchOptions,
|
||||
popupPrefixCls,
|
||||
loadData,
|
||||
expandTrigger,
|
||||
expandIcon,
|
||||
loadingIcon,
|
||||
popupMenuColumnStyle,
|
||||
optionRender
|
||||
}), [classNames, styles, mergedOptions, mergedFieldNames, checkedValues, halfCheckedValues, changeOnSelect, onInternalSelect, checkable, searchOptions, popupPrefixCls, loadData, expandTrigger, expandIcon, loadingIcon, popupMenuColumnStyle, optionRender]);
|
||||
|
||||
// ==============================================================
|
||||
// == Render ==
|
||||
// ==============================================================
|
||||
const emptyOptions = !(mergedSearchValue ? searchOptions : mergedOptions).length;
|
||||
const popupStyle =
|
||||
// Search to match width
|
||||
mergedSearchValue && searchConfig.matchInputWidth ||
|
||||
// Empty keep the width
|
||||
emptyOptions ? {} : {
|
||||
minWidth: 'auto'
|
||||
};
|
||||
return /*#__PURE__*/React.createElement(_context.default.Provider, {
|
||||
value: cascaderContext
|
||||
}, /*#__PURE__*/React.createElement(_select.BaseSelect, _extends({}, restProps, {
|
||||
// MISC
|
||||
ref: ref,
|
||||
id: mergedId,
|
||||
prefixCls: prefixCls,
|
||||
autoClearSearchValue: autoClearSearchValue,
|
||||
popupMatchSelectWidth: popupMatchSelectWidth,
|
||||
classNames: classNames,
|
||||
styles: styles,
|
||||
popupStyle: {
|
||||
...popupStyle,
|
||||
...customPopupStyle
|
||||
}
|
||||
// Value
|
||||
,
|
||||
displayValues: displayValues,
|
||||
onDisplayValuesChange: onDisplayValuesChange,
|
||||
mode: multiple ? 'multiple' : undefined
|
||||
// Search
|
||||
,
|
||||
searchValue: mergedSearchValue,
|
||||
onSearch: onInternalSearch,
|
||||
showSearch: mergedShowSearch
|
||||
// Options
|
||||
,
|
||||
OptionList: _OptionList.default,
|
||||
emptyOptions: emptyOptions
|
||||
// Open
|
||||
,
|
||||
open: open,
|
||||
popupClassName: popupClassName,
|
||||
placement: placement,
|
||||
onPopupVisibleChange: onInternalPopupVisibleChange
|
||||
// Children
|
||||
,
|
||||
getRawInputElement: () => children
|
||||
})));
|
||||
});
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
Cascader.displayName = 'Cascader';
|
||||
}
|
||||
Cascader.SHOW_PARENT = _commonUtil.SHOW_PARENT;
|
||||
Cascader.SHOW_CHILD = _commonUtil.SHOW_CHILD;
|
||||
Cascader.Panel = _Panel.default;
|
||||
var _default = exports.default = Cascader;
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
import * as React from 'react';
|
||||
export interface CheckboxProps {
|
||||
prefixCls: string;
|
||||
checked?: boolean;
|
||||
halfChecked?: boolean;
|
||||
disabled?: boolean;
|
||||
onClick?: React.MouseEventHandler;
|
||||
disableCheckbox?: boolean;
|
||||
}
|
||||
export default function Checkbox({ prefixCls, checked, halfChecked, disabled, onClick, disableCheckbox, }: CheckboxProps): React.JSX.Element;
|
||||
+33
@@ -0,0 +1,33 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = Checkbox;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _clsx = require("clsx");
|
||||
var _context = _interopRequireDefault(require("../context"));
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function Checkbox({
|
||||
prefixCls,
|
||||
checked,
|
||||
halfChecked,
|
||||
disabled,
|
||||
onClick,
|
||||
disableCheckbox
|
||||
}) {
|
||||
const {
|
||||
checkable
|
||||
} = React.useContext(_context.default);
|
||||
const customCheckbox = typeof checkable !== 'boolean' ? checkable : null;
|
||||
return /*#__PURE__*/React.createElement("span", {
|
||||
className: (0, _clsx.clsx)(`${prefixCls}`, {
|
||||
[`${prefixCls}-checked`]: checked,
|
||||
[`${prefixCls}-indeterminate`]: !checked && halfChecked,
|
||||
[`${prefixCls}-disabled`]: disabled || disableCheckbox
|
||||
}),
|
||||
onClick: onClick
|
||||
}, customCheckbox);
|
||||
}
|
||||
+21
@@ -0,0 +1,21 @@
|
||||
import * as React from 'react';
|
||||
import type { DefaultOptionType, SingleValueType } from '../Cascader';
|
||||
export declare const FIX_LABEL = "__cascader_fix_label__";
|
||||
export interface ColumnProps<OptionType extends DefaultOptionType = DefaultOptionType> {
|
||||
prefixCls: string;
|
||||
multiple?: boolean;
|
||||
options: OptionType[];
|
||||
/** Current Column opened item key */
|
||||
activeValue?: React.Key;
|
||||
/** The value path before current column */
|
||||
prevValuePath: React.Key[];
|
||||
onToggleOpen: (open: boolean) => void;
|
||||
onSelect: (valuePath: SingleValueType, leaf: boolean) => void;
|
||||
onActive: (valuePath: SingleValueType) => void;
|
||||
checkedSet: Set<React.Key>;
|
||||
halfCheckedSet: Set<React.Key>;
|
||||
loadingKeys: React.Key[];
|
||||
isSelectable: (option: DefaultOptionType) => boolean;
|
||||
disabled?: boolean;
|
||||
}
|
||||
export default function Column<OptionType extends DefaultOptionType = DefaultOptionType>({ prefixCls, multiple, options, activeValue, prevValuePath, onToggleOpen, onSelect, onActive, checkedSet, halfCheckedSet, loadingKeys, isSelectable, disabled: propsDisabled, }: ColumnProps<OptionType>): React.JSX.Element;
|
||||
+209
@@ -0,0 +1,209 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.FIX_LABEL = void 0;
|
||||
exports.default = Column;
|
||||
var _clsx = require("clsx");
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _pickAttrs = _interopRequireDefault(require("@rc-component/util/lib/pickAttrs"));
|
||||
var _context = _interopRequireDefault(require("../context"));
|
||||
var _useSearchOptions = require("../hooks/useSearchOptions");
|
||||
var _commonUtil = require("../utils/commonUtil");
|
||||
var _Checkbox = _interopRequireDefault(require("./Checkbox"));
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
const FIX_LABEL = exports.FIX_LABEL = '__cascader_fix_label__';
|
||||
function Column({
|
||||
prefixCls,
|
||||
multiple,
|
||||
options,
|
||||
activeValue,
|
||||
prevValuePath,
|
||||
onToggleOpen,
|
||||
onSelect,
|
||||
onActive,
|
||||
checkedSet,
|
||||
halfCheckedSet,
|
||||
loadingKeys,
|
||||
isSelectable,
|
||||
disabled: propsDisabled
|
||||
}) {
|
||||
const menuPrefixCls = `${prefixCls}-menu`;
|
||||
const menuItemPrefixCls = `${prefixCls}-menu-item`;
|
||||
const menuRef = React.useRef(null);
|
||||
const {
|
||||
fieldNames,
|
||||
changeOnSelect,
|
||||
expandTrigger,
|
||||
expandIcon,
|
||||
loadingIcon,
|
||||
popupMenuColumnStyle,
|
||||
optionRender,
|
||||
classNames,
|
||||
styles
|
||||
} = React.useContext(_context.default);
|
||||
const hoverOpen = expandTrigger === 'hover';
|
||||
const isOptionDisabled = disabled => propsDisabled || disabled;
|
||||
|
||||
// ============================ Option ============================
|
||||
const optionInfoList = React.useMemo(() => options.map(option => {
|
||||
const {
|
||||
disabled,
|
||||
disableCheckbox
|
||||
} = option;
|
||||
const searchOptions = option[_useSearchOptions.SEARCH_MARK];
|
||||
const label = option[FIX_LABEL] ?? option[fieldNames.label];
|
||||
const value = option[fieldNames.value];
|
||||
const isMergedLeaf = (0, _commonUtil.isLeaf)(option, fieldNames);
|
||||
|
||||
// Get real value of option. Search option is different way.
|
||||
const fullPath = searchOptions ? searchOptions.map(opt => opt[fieldNames.value]) : [...prevValuePath, value];
|
||||
const fullPathKey = (0, _commonUtil.toPathKey)(fullPath);
|
||||
const isLoading = loadingKeys.includes(fullPathKey);
|
||||
|
||||
// >>>>> checked
|
||||
const checked = checkedSet.has(fullPathKey);
|
||||
|
||||
// >>>>> halfChecked
|
||||
const halfChecked = halfCheckedSet.has(fullPathKey);
|
||||
return {
|
||||
disabled,
|
||||
label,
|
||||
value,
|
||||
isLeaf: isMergedLeaf,
|
||||
isLoading,
|
||||
checked,
|
||||
halfChecked,
|
||||
option,
|
||||
disableCheckbox,
|
||||
fullPath,
|
||||
fullPathKey
|
||||
};
|
||||
}), [options, checkedSet, fieldNames, halfCheckedSet, loadingKeys, prevValuePath]);
|
||||
React.useEffect(() => {
|
||||
if (menuRef.current) {
|
||||
const selector = `.${menuItemPrefixCls}-active`;
|
||||
const activeElement = menuRef.current.querySelector(selector);
|
||||
if (activeElement) {
|
||||
(0, _commonUtil.scrollIntoParentView)(activeElement);
|
||||
}
|
||||
}
|
||||
}, [activeValue, menuItemPrefixCls]);
|
||||
|
||||
// ============================ Render ============================
|
||||
return /*#__PURE__*/React.createElement("ul", {
|
||||
className: (0, _clsx.clsx)(menuPrefixCls, classNames?.popup?.list),
|
||||
style: styles?.popup?.list,
|
||||
ref: menuRef,
|
||||
role: "menu"
|
||||
}, optionInfoList.map(({
|
||||
disabled,
|
||||
label,
|
||||
value,
|
||||
isLeaf: isMergedLeaf,
|
||||
isLoading,
|
||||
checked,
|
||||
halfChecked,
|
||||
option,
|
||||
fullPath,
|
||||
fullPathKey,
|
||||
disableCheckbox
|
||||
}) => {
|
||||
const ariaProps = (0, _pickAttrs.default)(option, {
|
||||
aria: true,
|
||||
data: true
|
||||
});
|
||||
// >>>>> Open
|
||||
const triggerOpenPath = () => {
|
||||
if (isOptionDisabled(disabled)) {
|
||||
return;
|
||||
}
|
||||
const nextValueCells = [...fullPath];
|
||||
if (hoverOpen && isMergedLeaf) {
|
||||
nextValueCells.pop();
|
||||
}
|
||||
onActive(nextValueCells);
|
||||
};
|
||||
|
||||
// >>>>> Selection
|
||||
const triggerSelect = () => {
|
||||
if (isSelectable(option) && !isOptionDisabled(disabled)) {
|
||||
onSelect(fullPath, isMergedLeaf);
|
||||
}
|
||||
};
|
||||
|
||||
// >>>>> Title
|
||||
let title;
|
||||
if (typeof option.title === 'string') {
|
||||
title = option.title;
|
||||
} else if (typeof label === 'string') {
|
||||
title = label;
|
||||
}
|
||||
|
||||
// >>>>> Render
|
||||
return /*#__PURE__*/React.createElement("li", _extends({
|
||||
key: fullPathKey
|
||||
}, ariaProps, {
|
||||
className: (0, _clsx.clsx)(menuItemPrefixCls, classNames?.popup?.listItem, {
|
||||
[`${menuItemPrefixCls}-expand`]: !isMergedLeaf,
|
||||
[`${menuItemPrefixCls}-active`]: activeValue === value || activeValue === fullPathKey,
|
||||
[`${menuItemPrefixCls}-disabled`]: isOptionDisabled(disabled),
|
||||
[`${menuItemPrefixCls}-loading`]: isLoading
|
||||
}),
|
||||
style: {
|
||||
...popupMenuColumnStyle,
|
||||
...styles?.popup?.listItem
|
||||
},
|
||||
role: "menuitemcheckbox",
|
||||
title: title,
|
||||
"aria-checked": checked,
|
||||
"data-path-key": fullPathKey,
|
||||
onClick: () => {
|
||||
triggerOpenPath();
|
||||
if (disableCheckbox) {
|
||||
return;
|
||||
}
|
||||
if (!multiple || isMergedLeaf) {
|
||||
triggerSelect();
|
||||
}
|
||||
},
|
||||
onDoubleClick: () => {
|
||||
if (changeOnSelect) {
|
||||
onToggleOpen(false);
|
||||
}
|
||||
},
|
||||
onMouseEnter: () => {
|
||||
if (hoverOpen) {
|
||||
triggerOpenPath();
|
||||
}
|
||||
},
|
||||
onMouseDown: e => {
|
||||
// Prevent selector from blurring
|
||||
e.preventDefault();
|
||||
}
|
||||
}), multiple && /*#__PURE__*/React.createElement(_Checkbox.default, {
|
||||
prefixCls: `${prefixCls}-checkbox`,
|
||||
checked: checked,
|
||||
halfChecked: halfChecked,
|
||||
disabled: isOptionDisabled(disabled) || disableCheckbox,
|
||||
disableCheckbox: disableCheckbox,
|
||||
onClick: e => {
|
||||
if (disableCheckbox) {
|
||||
return;
|
||||
}
|
||||
e.stopPropagation();
|
||||
triggerSelect();
|
||||
}
|
||||
}), /*#__PURE__*/React.createElement("div", {
|
||||
className: `${menuItemPrefixCls}-content`
|
||||
}, optionRender && value !== '__EMPTY__' ? optionRender(option) : label), !isLoading && expandIcon && !isMergedLeaf && /*#__PURE__*/React.createElement("div", {
|
||||
className: `${menuItemPrefixCls}-expand-icon`
|
||||
}, expandIcon), isLoading && loadingIcon && /*#__PURE__*/React.createElement("div", {
|
||||
className: `${menuItemPrefixCls}-loading-icon`
|
||||
}, loadingIcon));
|
||||
}));
|
||||
}
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
import type { useBaseProps } from '@rc-component/select';
|
||||
import type { RefOptionListProps } from '@rc-component/select/lib/OptionList';
|
||||
import * as React from 'react';
|
||||
export type RawOptionListProps = Pick<ReturnType<typeof useBaseProps>, 'prefixCls' | 'multiple' | 'searchValue' | 'toggleOpen' | 'notFoundContent' | 'direction' | 'open' | 'disabled'> & {
|
||||
lockOptions?: boolean;
|
||||
};
|
||||
declare const RawOptionList: React.ForwardRefExoticComponent<Pick<import("@rc-component/select/lib/hooks/useBaseProps").BaseSelectContextProps, "disabled" | "prefixCls" | "multiple" | "searchValue" | "direction" | "notFoundContent" | "open" | "toggleOpen"> & {
|
||||
lockOptions?: boolean | undefined;
|
||||
} & React.RefAttributes<RefOptionListProps>>;
|
||||
export default RawOptionList;
|
||||
+225
@@ -0,0 +1,225 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _clsx = require("clsx");
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _useMemo = _interopRequireDefault(require("@rc-component/util/lib/hooks/useMemo"));
|
||||
var _context = _interopRequireDefault(require("../context"));
|
||||
var _commonUtil = require("../utils/commonUtil");
|
||||
var _treeUtil = require("../utils/treeUtil");
|
||||
var _Column = _interopRequireWildcard(require("./Column"));
|
||||
var _useActive = _interopRequireDefault(require("./useActive"));
|
||||
var _useKeyboard = _interopRequireDefault(require("./useKeyboard"));
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); } /* eslint-disable default-case */
|
||||
const RawOptionList = /*#__PURE__*/React.forwardRef((props, ref) => {
|
||||
const {
|
||||
prefixCls,
|
||||
multiple,
|
||||
searchValue,
|
||||
toggleOpen,
|
||||
notFoundContent,
|
||||
direction,
|
||||
open,
|
||||
disabled,
|
||||
lockOptions = false
|
||||
} = props;
|
||||
const containerRef = React.useRef(null);
|
||||
const rtl = direction === 'rtl';
|
||||
const {
|
||||
options,
|
||||
values,
|
||||
halfValues,
|
||||
fieldNames,
|
||||
changeOnSelect,
|
||||
onSelect,
|
||||
searchOptions,
|
||||
popupPrefixCls,
|
||||
loadData,
|
||||
expandTrigger
|
||||
} = React.useContext(_context.default);
|
||||
const mergedPrefixCls = popupPrefixCls || prefixCls;
|
||||
|
||||
// ========================= loadData =========================
|
||||
const [loadingKeys, setLoadingKeys] = React.useState([]);
|
||||
const internalLoadData = valueCells => {
|
||||
// Do not load when search
|
||||
if (!loadData || searchValue) {
|
||||
return;
|
||||
}
|
||||
const optionList = (0, _treeUtil.toPathOptions)(valueCells, options, fieldNames);
|
||||
const rawOptions = optionList.map(({
|
||||
option
|
||||
}) => option);
|
||||
const lastOption = rawOptions[rawOptions.length - 1];
|
||||
if (lastOption && !(0, _commonUtil.isLeaf)(lastOption, fieldNames)) {
|
||||
const pathKey = (0, _commonUtil.toPathKey)(valueCells);
|
||||
setLoadingKeys(keys => [...keys, pathKey]);
|
||||
loadData(rawOptions);
|
||||
}
|
||||
};
|
||||
|
||||
// zombieJ: This is bad. We should make this same as `rc-tree` to use Promise instead.
|
||||
React.useEffect(() => {
|
||||
if (loadingKeys.length) {
|
||||
loadingKeys.forEach(loadingKey => {
|
||||
const valueStrCells = (0, _commonUtil.toPathValueStr)(loadingKey);
|
||||
const optionList = (0, _treeUtil.toPathOptions)(valueStrCells, options, fieldNames, true).map(({
|
||||
option
|
||||
}) => option);
|
||||
const lastOption = optionList[optionList.length - 1];
|
||||
if (!lastOption || lastOption[fieldNames.children] || (0, _commonUtil.isLeaf)(lastOption, fieldNames)) {
|
||||
setLoadingKeys(keys => keys.filter(key => key !== loadingKey));
|
||||
}
|
||||
});
|
||||
}
|
||||
}, [options, loadingKeys, fieldNames]);
|
||||
|
||||
// ========================== Values ==========================
|
||||
const checkedSet = React.useMemo(() => new Set((0, _commonUtil.toPathKeys)(values)), [values]);
|
||||
const halfCheckedSet = React.useMemo(() => new Set((0, _commonUtil.toPathKeys)(halfValues)), [halfValues]);
|
||||
|
||||
// ====================== Accessibility =======================
|
||||
const [activeValueCells, setActiveValueCells] = (0, _useActive.default)(multiple, open);
|
||||
|
||||
// =========================== Path ===========================
|
||||
const onPathOpen = nextValueCells => {
|
||||
setActiveValueCells(nextValueCells);
|
||||
|
||||
// Trigger loadData
|
||||
internalLoadData(nextValueCells);
|
||||
};
|
||||
const isSelectable = option => {
|
||||
if (disabled) {
|
||||
return false;
|
||||
}
|
||||
const {
|
||||
disabled: optionDisabled
|
||||
} = option;
|
||||
const isMergedLeaf = (0, _commonUtil.isLeaf)(option, fieldNames);
|
||||
return !optionDisabled && (isMergedLeaf || changeOnSelect || multiple);
|
||||
};
|
||||
const onPathSelect = (valuePath, leaf, fromKeyboard = false) => {
|
||||
onSelect(valuePath);
|
||||
if (!multiple && (leaf || changeOnSelect && (expandTrigger === 'hover' || fromKeyboard))) {
|
||||
toggleOpen(false);
|
||||
}
|
||||
};
|
||||
|
||||
// ========================== Option ==========================
|
||||
const filteredOptions = React.useMemo(() => {
|
||||
if (searchValue) {
|
||||
return searchOptions;
|
||||
}
|
||||
return options;
|
||||
}, [searchValue, searchOptions, options]);
|
||||
|
||||
// Update only when open or lockOptions
|
||||
const mergedOptions = (0, _useMemo.default)(() => filteredOptions, [open, lockOptions], (prev, next) => !!next[0] && !next[1]);
|
||||
|
||||
// ========================== Column ==========================
|
||||
const optionColumns = React.useMemo(() => {
|
||||
const optionList = [{
|
||||
options: mergedOptions
|
||||
}];
|
||||
let currentList = mergedOptions;
|
||||
const fullPathKeys = (0, _commonUtil.getFullPathKeys)(currentList, fieldNames);
|
||||
for (let i = 0; i < activeValueCells.length; i += 1) {
|
||||
const activeValueCell = activeValueCells[i];
|
||||
const currentOption = currentList.find((option, index) => (fullPathKeys[index] ? (0, _commonUtil.toPathKey)(fullPathKeys[index]) : option[fieldNames.value]) === activeValueCell);
|
||||
const subOptions = currentOption?.[fieldNames.children];
|
||||
if (!subOptions?.length) {
|
||||
break;
|
||||
}
|
||||
currentList = subOptions;
|
||||
optionList.push({
|
||||
options: subOptions
|
||||
});
|
||||
}
|
||||
return optionList;
|
||||
}, [mergedOptions, activeValueCells, fieldNames]);
|
||||
|
||||
// ========================= Keyboard =========================
|
||||
const onKeyboardSelect = (selectValueCells, option) => {
|
||||
if (isSelectable(option)) {
|
||||
onPathSelect(selectValueCells, (0, _commonUtil.isLeaf)(option, fieldNames), true);
|
||||
}
|
||||
};
|
||||
(0, _useKeyboard.default)(ref, mergedOptions, fieldNames, activeValueCells, onPathOpen, onKeyboardSelect, {
|
||||
direction,
|
||||
searchValue,
|
||||
toggleOpen,
|
||||
open
|
||||
});
|
||||
|
||||
// >>>>> Active Scroll
|
||||
React.useEffect(() => {
|
||||
if (searchValue) {
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < activeValueCells.length; i += 1) {
|
||||
const cellPath = activeValueCells.slice(0, i + 1);
|
||||
const cellKeyPath = (0, _commonUtil.toPathKey)(cellPath);
|
||||
const ele = containerRef.current?.querySelector(`li[data-path-key="${cellKeyPath.replace(/\\{0,2}"/g, '\\"')}"]` // matches unescaped double quotes
|
||||
);
|
||||
if (ele) {
|
||||
(0, _commonUtil.scrollIntoParentView)(ele);
|
||||
}
|
||||
}
|
||||
}, [activeValueCells, searchValue]);
|
||||
|
||||
// ========================== Render ==========================
|
||||
// >>>>> Empty
|
||||
const isEmpty = !optionColumns[0]?.options?.length;
|
||||
const emptyList = [{
|
||||
[fieldNames.value]: '__EMPTY__',
|
||||
[_Column.FIX_LABEL]: notFoundContent,
|
||||
disabled: true
|
||||
}];
|
||||
const columnProps = {
|
||||
...props,
|
||||
multiple: !isEmpty && multiple,
|
||||
onSelect: onPathSelect,
|
||||
onActive: onPathOpen,
|
||||
onToggleOpen: toggleOpen,
|
||||
checkedSet,
|
||||
halfCheckedSet,
|
||||
loadingKeys,
|
||||
isSelectable
|
||||
};
|
||||
|
||||
// >>>>> Columns
|
||||
const mergedOptionColumns = isEmpty ? [{
|
||||
options: emptyList
|
||||
}] : optionColumns;
|
||||
const columnNodes = mergedOptionColumns.map((col, index) => {
|
||||
const prevValuePath = activeValueCells.slice(0, index);
|
||||
const activeValue = activeValueCells[index];
|
||||
return /*#__PURE__*/React.createElement(_Column.default, _extends({
|
||||
key: index
|
||||
}, columnProps, {
|
||||
prefixCls: mergedPrefixCls,
|
||||
options: col.options,
|
||||
prevValuePath: prevValuePath,
|
||||
activeValue: activeValue
|
||||
}));
|
||||
});
|
||||
|
||||
// >>>>> Render
|
||||
return /*#__PURE__*/React.createElement("div", {
|
||||
className: (0, _clsx.clsx)(`${mergedPrefixCls}-menus`, {
|
||||
[`${mergedPrefixCls}-menu-empty`]: isEmpty,
|
||||
[`${mergedPrefixCls}-rtl`]: rtl
|
||||
}),
|
||||
ref: containerRef
|
||||
}, columnNodes);
|
||||
});
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
RawOptionList.displayName = 'RawOptionList';
|
||||
}
|
||||
var _default = exports.default = RawOptionList;
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
import type { RefOptionListProps } from '@rc-component/select/lib/OptionList';
|
||||
import * as React from 'react';
|
||||
declare const RefOptionList: React.ForwardRefExoticComponent<React.RefAttributes<RefOptionListProps>>;
|
||||
export default RefOptionList;
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _select = require("@rc-component/select");
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _List = _interopRequireDefault(require("./List"));
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
const RefOptionList = /*#__PURE__*/React.forwardRef((props, ref) => {
|
||||
const {
|
||||
lockOptions,
|
||||
...baseProps
|
||||
} = (0, _select.useBaseProps)();
|
||||
|
||||
// >>>>> Render
|
||||
return /*#__PURE__*/React.createElement(_List.default, _extends({}, props, baseProps, {
|
||||
lockOptions: lockOptions,
|
||||
ref: ref
|
||||
}));
|
||||
});
|
||||
var _default = exports.default = RefOptionList;
|
||||
Generated
Vendored
+6
@@ -0,0 +1,6 @@
|
||||
import type { LegacyKey } from '../Cascader';
|
||||
/**
|
||||
* Control the active open options path.
|
||||
*/
|
||||
declare const useActive: (multiple?: boolean, open?: boolean) => [LegacyKey[], (activeValueCells: LegacyKey[]) => void];
|
||||
export default useActive;
|
||||
+33
@@ -0,0 +1,33 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _context = _interopRequireDefault(require("../context"));
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
/**
|
||||
* Control the active open options path.
|
||||
*/
|
||||
const useActive = (multiple, open) => {
|
||||
const {
|
||||
values
|
||||
} = React.useContext(_context.default);
|
||||
const firstValueCells = values[0];
|
||||
|
||||
// Record current dropdown active options
|
||||
// This also control the open status
|
||||
const [activeValueCells, setActiveValueCells] = React.useState([]);
|
||||
React.useEffect(() => {
|
||||
if (!multiple) {
|
||||
setActiveValueCells(firstValueCells || []);
|
||||
}
|
||||
}, /* eslint-disable react-hooks/exhaustive-deps */
|
||||
[open, firstValueCells]
|
||||
/* eslint-enable react-hooks/exhaustive-deps */);
|
||||
return [activeValueCells, setActiveValueCells];
|
||||
};
|
||||
var _default = exports.default = useActive;
|
||||
Generated
Vendored
+10
@@ -0,0 +1,10 @@
|
||||
import type { RefOptionListProps } from '@rc-component/select/lib/OptionList';
|
||||
import * as React from 'react';
|
||||
import type { DefaultOptionType, InternalFieldNames, LegacyKey, SingleValueType } from '../Cascader';
|
||||
declare const _default: (ref: React.Ref<RefOptionListProps>, options: DefaultOptionType[], fieldNames: InternalFieldNames, activeValueCells: LegacyKey[], setActiveValueCells: (activeValueCells: LegacyKey[]) => void, onKeyBoardSelect: (valueCells: SingleValueType, option: DefaultOptionType) => void, contextProps: {
|
||||
direction?: "ltr" | "rtl" | undefined;
|
||||
searchValue: string;
|
||||
toggleOpen: (open?: boolean) => void;
|
||||
open?: boolean | undefined;
|
||||
}) => void;
|
||||
export default _default;
|
||||
Generated
Vendored
+175
@@ -0,0 +1,175 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _KeyCode = _interopRequireDefault(require("@rc-component/util/lib/KeyCode"));
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _useSearchOptions = require("../hooks/useSearchOptions");
|
||||
var _commonUtil = require("../utils/commonUtil");
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
var _default = (ref, options, fieldNames, activeValueCells, setActiveValueCells, onKeyBoardSelect, contextProps) => {
|
||||
const {
|
||||
direction,
|
||||
searchValue,
|
||||
toggleOpen,
|
||||
open
|
||||
} = contextProps;
|
||||
const rtl = direction === 'rtl';
|
||||
const [validActiveValueCells, lastActiveIndex, lastActiveOptions, fullPathKeys] = React.useMemo(() => {
|
||||
let activeIndex = -1;
|
||||
let currentOptions = options;
|
||||
const mergedActiveIndexes = [];
|
||||
const mergedActiveValueCells = [];
|
||||
const len = activeValueCells.length;
|
||||
const pathKeys = (0, _commonUtil.getFullPathKeys)(options, fieldNames);
|
||||
|
||||
// Fill validate active value cells and index
|
||||
for (let i = 0; i < len && currentOptions; i += 1) {
|
||||
// Mark the active index for current options
|
||||
const nextActiveIndex = currentOptions.findIndex((option, index) => (pathKeys[index] ? (0, _commonUtil.toPathKey)(pathKeys[index]) : option[fieldNames.value]) === activeValueCells[i]);
|
||||
if (nextActiveIndex === -1) {
|
||||
break;
|
||||
}
|
||||
activeIndex = nextActiveIndex;
|
||||
mergedActiveIndexes.push(activeIndex);
|
||||
mergedActiveValueCells.push(activeValueCells[i]);
|
||||
currentOptions = currentOptions[activeIndex][fieldNames.children];
|
||||
}
|
||||
|
||||
// Fill last active options
|
||||
let activeOptions = options;
|
||||
for (let i = 0; i < mergedActiveIndexes.length - 1; i += 1) {
|
||||
activeOptions = activeOptions[mergedActiveIndexes[i]][fieldNames.children];
|
||||
}
|
||||
return [mergedActiveValueCells, activeIndex, activeOptions, pathKeys];
|
||||
}, [activeValueCells, fieldNames, options]);
|
||||
|
||||
// Update active value cells and scroll to target element
|
||||
const internalSetActiveValueCells = next => {
|
||||
setActiveValueCells(next);
|
||||
};
|
||||
|
||||
// Same options offset
|
||||
const offsetActiveOption = offset => {
|
||||
const len = lastActiveOptions.length;
|
||||
let currentIndex = lastActiveIndex;
|
||||
if (currentIndex === -1 && offset < 0) {
|
||||
currentIndex = len;
|
||||
}
|
||||
for (let i = 0; i < len; i += 1) {
|
||||
currentIndex = (currentIndex + offset + len) % len;
|
||||
const option = lastActiveOptions[currentIndex];
|
||||
if (option && !option.disabled) {
|
||||
const nextActiveCells = validActiveValueCells.slice(0, -1).concat(fullPathKeys[currentIndex] ? (0, _commonUtil.toPathKey)(fullPathKeys[currentIndex]) : option[fieldNames.value]);
|
||||
internalSetActiveValueCells(nextActiveCells);
|
||||
return;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// Different options offset
|
||||
const prevColumn = () => {
|
||||
if (validActiveValueCells.length > 1) {
|
||||
const nextActiveCells = validActiveValueCells.slice(0, -1);
|
||||
internalSetActiveValueCells(nextActiveCells);
|
||||
} else {
|
||||
toggleOpen(false);
|
||||
}
|
||||
};
|
||||
const nextColumn = () => {
|
||||
const nextOptions = lastActiveOptions[lastActiveIndex]?.[fieldNames.children] || [];
|
||||
const nextOption = nextOptions.find(option => !option.disabled);
|
||||
if (nextOption) {
|
||||
const nextActiveCells = [...validActiveValueCells, nextOption[fieldNames.value]];
|
||||
internalSetActiveValueCells(nextActiveCells);
|
||||
}
|
||||
};
|
||||
React.useImperativeHandle(ref, () => ({
|
||||
// scrollTo: treeRef.current?.scrollTo,
|
||||
onKeyDown: event => {
|
||||
const {
|
||||
which
|
||||
} = event;
|
||||
switch (which) {
|
||||
// >>> Arrow keys
|
||||
case _KeyCode.default.UP:
|
||||
case _KeyCode.default.DOWN:
|
||||
{
|
||||
let offset = 0;
|
||||
if (which === _KeyCode.default.UP) {
|
||||
offset = -1;
|
||||
} else if (which === _KeyCode.default.DOWN) {
|
||||
offset = 1;
|
||||
}
|
||||
if (offset !== 0) {
|
||||
offsetActiveOption(offset);
|
||||
}
|
||||
break;
|
||||
}
|
||||
case _KeyCode.default.LEFT:
|
||||
{
|
||||
if (searchValue) {
|
||||
break;
|
||||
}
|
||||
if (rtl) {
|
||||
nextColumn();
|
||||
} else {
|
||||
prevColumn();
|
||||
}
|
||||
break;
|
||||
}
|
||||
case _KeyCode.default.RIGHT:
|
||||
{
|
||||
if (searchValue) {
|
||||
break;
|
||||
}
|
||||
if (rtl) {
|
||||
prevColumn();
|
||||
} else {
|
||||
nextColumn();
|
||||
}
|
||||
break;
|
||||
}
|
||||
case _KeyCode.default.BACKSPACE:
|
||||
{
|
||||
if (!searchValue) {
|
||||
prevColumn();
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
// >>> Select
|
||||
case _KeyCode.default.ENTER:
|
||||
{
|
||||
if (validActiveValueCells.length) {
|
||||
const option = lastActiveOptions[lastActiveIndex];
|
||||
|
||||
// Search option should revert back of origin options
|
||||
const originOptions = option?.[_useSearchOptions.SEARCH_MARK] || [];
|
||||
if (originOptions.length) {
|
||||
onKeyBoardSelect(originOptions.map(opt => opt[fieldNames.value]), originOptions[originOptions.length - 1]);
|
||||
} else {
|
||||
onKeyBoardSelect(validActiveValueCells, lastActiveOptions[lastActiveIndex]);
|
||||
}
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
||||
// >>> Close
|
||||
case _KeyCode.default.ESC:
|
||||
{
|
||||
toggleOpen(false);
|
||||
if (open) {
|
||||
event.stopPropagation();
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
onKeyUp: () => {}
|
||||
}));
|
||||
};
|
||||
exports.default = _default;
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
import * as React from 'react';
|
||||
import type { CascaderProps, DefaultOptionType } from './Cascader';
|
||||
export type PickType = 'value' | 'defaultValue' | 'changeOnSelect' | 'onChange' | 'options' | 'prefixCls' | 'checkable' | 'fieldNames' | 'showCheckedStrategy' | 'loadData' | 'expandTrigger' | 'expandIcon' | 'loadingIcon' | 'className' | 'style' | 'direction' | 'notFoundContent' | 'disabled' | 'optionRender';
|
||||
export type PanelProps<OptionType extends DefaultOptionType = DefaultOptionType, ValueField extends keyof OptionType = keyof OptionType, Multiple extends boolean | React.ReactNode = false> = Pick<CascaderProps<OptionType, ValueField, Multiple>, PickType>;
|
||||
export default function Panel<OptionType extends DefaultOptionType = DefaultOptionType, ValueField extends keyof OptionType = keyof OptionType, Multiple extends boolean | React.ReactNode = false>(props: PanelProps<OptionType, ValueField, Multiple>): React.JSX.Element;
|
||||
+125
@@ -0,0 +1,125 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = Panel;
|
||||
var _clsx = require("clsx");
|
||||
var _util = require("@rc-component/util");
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _context = _interopRequireDefault(require("./context"));
|
||||
var _useMissingValues = _interopRequireDefault(require("./hooks/useMissingValues"));
|
||||
var _useOptions = _interopRequireDefault(require("./hooks/useOptions"));
|
||||
var _useSelect = _interopRequireDefault(require("./hooks/useSelect"));
|
||||
var _useValues = _interopRequireDefault(require("./hooks/useValues"));
|
||||
var _List = _interopRequireDefault(require("./OptionList/List"));
|
||||
var _commonUtil = require("./utils/commonUtil");
|
||||
var _treeUtil = require("./utils/treeUtil");
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function noop() {}
|
||||
function Panel(props) {
|
||||
const {
|
||||
prefixCls = 'rc-cascader',
|
||||
style,
|
||||
className,
|
||||
options,
|
||||
checkable,
|
||||
defaultValue,
|
||||
value,
|
||||
fieldNames,
|
||||
changeOnSelect,
|
||||
onChange,
|
||||
showCheckedStrategy,
|
||||
loadData,
|
||||
expandTrigger,
|
||||
expandIcon = '>',
|
||||
loadingIcon,
|
||||
direction,
|
||||
notFoundContent = 'Not Found',
|
||||
disabled,
|
||||
optionRender
|
||||
} = props;
|
||||
|
||||
// ======================== Multiple ========================
|
||||
const multiple = !!checkable;
|
||||
|
||||
// ========================= Values =========================
|
||||
const [interanlRawValues, setRawValues] = (0, _util.useControlledState)(defaultValue, value);
|
||||
const rawValues = (0, _commonUtil.toRawValues)(interanlRawValues);
|
||||
|
||||
// ========================= FieldNames =========================
|
||||
const mergedFieldNames = React.useMemo(() => (0, _commonUtil.fillFieldNames)(fieldNames), /* eslint-disable react-hooks/exhaustive-deps */
|
||||
[JSON.stringify(fieldNames)]
|
||||
/* eslint-enable react-hooks/exhaustive-deps */);
|
||||
|
||||
// =========================== Option ===========================
|
||||
const [mergedOptions, getPathKeyEntities, getValueByKeyPath] = (0, _useOptions.default)(mergedFieldNames, options);
|
||||
|
||||
// ========================= Values =========================
|
||||
const getMissingValues = (0, _useMissingValues.default)(mergedOptions, mergedFieldNames);
|
||||
|
||||
// Fill `rawValues` with checked conduction values
|
||||
const [checkedValues, halfCheckedValues, missingCheckedValues] = (0, _useValues.default)(multiple, rawValues, getPathKeyEntities, getValueByKeyPath, getMissingValues);
|
||||
|
||||
// =========================== Change ===========================
|
||||
const triggerChange = (0, _util.useEvent)(nextValues => {
|
||||
setRawValues(nextValues);
|
||||
|
||||
// Save perf if no need trigger event
|
||||
if (onChange) {
|
||||
const nextRawValues = (0, _commonUtil.toRawValues)(nextValues);
|
||||
const valueOptions = nextRawValues.map(valueCells => (0, _treeUtil.toPathOptions)(valueCells, mergedOptions, mergedFieldNames).map(valueOpt => valueOpt.option));
|
||||
const triggerValues = multiple ? nextRawValues : nextRawValues[0];
|
||||
const triggerOptions = multiple ? valueOptions : valueOptions[0];
|
||||
onChange(triggerValues, triggerOptions);
|
||||
}
|
||||
});
|
||||
|
||||
// =========================== Select ===========================
|
||||
const handleSelection = (0, _useSelect.default)(multiple, triggerChange, checkedValues, halfCheckedValues, missingCheckedValues, getPathKeyEntities, getValueByKeyPath, showCheckedStrategy);
|
||||
const onInternalSelect = (0, _util.useEvent)(valuePath => {
|
||||
handleSelection(valuePath);
|
||||
});
|
||||
|
||||
// ======================== Context =========================
|
||||
const cascaderContext = React.useMemo(() => ({
|
||||
options: mergedOptions,
|
||||
fieldNames: mergedFieldNames,
|
||||
values: checkedValues,
|
||||
halfValues: halfCheckedValues,
|
||||
changeOnSelect,
|
||||
onSelect: onInternalSelect,
|
||||
checkable,
|
||||
searchOptions: [],
|
||||
popupPrefixCls: undefined,
|
||||
loadData,
|
||||
expandTrigger,
|
||||
expandIcon,
|
||||
loadingIcon,
|
||||
popupMenuColumnStyle: undefined,
|
||||
optionRender
|
||||
}), [mergedOptions, mergedFieldNames, checkedValues, halfCheckedValues, changeOnSelect, onInternalSelect, checkable, loadData, expandTrigger, expandIcon, loadingIcon, optionRender]);
|
||||
|
||||
// ========================= Render =========================
|
||||
const panelPrefixCls = `${prefixCls}-panel`;
|
||||
const isEmpty = !mergedOptions.length;
|
||||
return /*#__PURE__*/React.createElement(_context.default.Provider, {
|
||||
value: cascaderContext
|
||||
}, /*#__PURE__*/React.createElement("div", {
|
||||
className: (0, _clsx.clsx)(panelPrefixCls, {
|
||||
[`${panelPrefixCls}-rtl`]: direction === 'rtl',
|
||||
[`${panelPrefixCls}-empty`]: isEmpty
|
||||
}, className),
|
||||
style: style
|
||||
}, isEmpty ? notFoundContent : /*#__PURE__*/React.createElement(_List.default, {
|
||||
prefixCls: prefixCls,
|
||||
searchValue: "",
|
||||
multiple: multiple,
|
||||
toggleOpen: noop,
|
||||
open: true,
|
||||
direction: direction,
|
||||
disabled: disabled
|
||||
})));
|
||||
}
|
||||
+23
@@ -0,0 +1,23 @@
|
||||
import * as React from 'react';
|
||||
import type { CascaderProps, InternalFieldNames, DefaultOptionType, SingleValueType } from './Cascader';
|
||||
export interface CascaderContextProps {
|
||||
options: NonNullable<CascaderProps['options']>;
|
||||
fieldNames: InternalFieldNames;
|
||||
values: SingleValueType[];
|
||||
halfValues: SingleValueType[];
|
||||
changeOnSelect?: boolean;
|
||||
onSelect: (valuePath: SingleValueType) => void;
|
||||
checkable?: boolean | React.ReactNode;
|
||||
searchOptions: DefaultOptionType[];
|
||||
popupPrefixCls?: string;
|
||||
loadData?: (selectOptions: DefaultOptionType[]) => void;
|
||||
expandTrigger?: 'hover' | 'click';
|
||||
expandIcon?: React.ReactNode;
|
||||
loadingIcon?: React.ReactNode;
|
||||
popupMenuColumnStyle?: React.CSSProperties;
|
||||
optionRender?: CascaderProps['optionRender'];
|
||||
classNames?: CascaderProps['classNames'];
|
||||
styles?: CascaderProps['styles'];
|
||||
}
|
||||
declare const CascaderContext: React.Context<CascaderContextProps>;
|
||||
export default CascaderContext;
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
const CascaderContext = /*#__PURE__*/React.createContext({});
|
||||
var _default = exports.default = CascaderContext;
|
||||
Generated
Vendored
+10
@@ -0,0 +1,10 @@
|
||||
import * as React from 'react';
|
||||
import type { DefaultOptionType, SingleValueType, CascaderProps, InternalFieldNames } from '../Cascader';
|
||||
declare const _default: (rawValues: SingleValueType[], options: DefaultOptionType[], fieldNames: InternalFieldNames, multiple: boolean, displayRender: CascaderProps['displayRender']) => {
|
||||
label: React.ReactNode;
|
||||
value: string;
|
||||
key: string;
|
||||
valueCells: SingleValueType;
|
||||
disabled: boolean | undefined;
|
||||
}[];
|
||||
export default _default;
|
||||
Generated
Vendored
+53
@@ -0,0 +1,53 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _treeUtil = require("../utils/treeUtil");
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _commonUtil = require("../utils/commonUtil");
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
var _default = (rawValues, options, fieldNames, multiple, displayRender) => {
|
||||
return React.useMemo(() => {
|
||||
const mergedDisplayRender = displayRender || (
|
||||
// Default displayRender
|
||||
labels => {
|
||||
const mergedLabels = multiple ? labels.slice(-1) : labels;
|
||||
const SPLIT = ' / ';
|
||||
if (mergedLabels.every(label => ['string', 'number'].includes(typeof label))) {
|
||||
return mergedLabels.join(SPLIT);
|
||||
}
|
||||
|
||||
// If exist non-string value, use ReactNode instead
|
||||
return mergedLabels.reduce((list, label, index) => {
|
||||
const keyedLabel = /*#__PURE__*/React.isValidElement(label) ? /*#__PURE__*/React.cloneElement(label, {
|
||||
key: index
|
||||
}) : label;
|
||||
if (index === 0) {
|
||||
return [keyedLabel];
|
||||
}
|
||||
return [...list, SPLIT, keyedLabel];
|
||||
}, []);
|
||||
});
|
||||
return rawValues.map(valueCells => {
|
||||
const valueOptions = (0, _treeUtil.toPathOptions)(valueCells, options, fieldNames);
|
||||
const label = mergedDisplayRender(valueOptions.map(({
|
||||
option,
|
||||
value
|
||||
}) => option?.[fieldNames.label] ?? value), valueOptions.map(({
|
||||
option
|
||||
}) => option));
|
||||
const value = (0, _commonUtil.toPathKey)(valueCells);
|
||||
return {
|
||||
label,
|
||||
value,
|
||||
key: value,
|
||||
valueCells,
|
||||
disabled: valueOptions[valueOptions.length - 1]?.option?.disabled
|
||||
};
|
||||
});
|
||||
}, [rawValues, options, fieldNames, displayRender, multiple]);
|
||||
};
|
||||
exports.default = _default;
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
import type { DefaultOptionType, InternalFieldNames } from '../Cascader';
|
||||
import type { DataEntity } from '@rc-component/tree/lib/interface';
|
||||
export interface OptionsInfo {
|
||||
keyEntities: Record<string, DataEntity>;
|
||||
pathKeyEntities: Record<string, DataEntity>;
|
||||
}
|
||||
export type GetEntities = () => OptionsInfo['pathKeyEntities'];
|
||||
/** Lazy parse options data into conduct-able info to avoid perf issue in single mode */
|
||||
declare const _default: (options: DefaultOptionType[], fieldNames: InternalFieldNames) => GetEntities;
|
||||
export default _default;
|
||||
+44
@@ -0,0 +1,44 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _treeUtil = require("@rc-component/tree/lib/utils/treeUtil");
|
||||
var _commonUtil = require("../utils/commonUtil");
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
/** Lazy parse options data into conduct-able info to avoid perf issue in single mode */
|
||||
var _default = (options, fieldNames) => {
|
||||
const cacheRef = React.useRef({
|
||||
options: [],
|
||||
info: {
|
||||
keyEntities: {},
|
||||
pathKeyEntities: {}
|
||||
}
|
||||
});
|
||||
const getEntities = React.useCallback(() => {
|
||||
if (cacheRef.current.options !== options) {
|
||||
cacheRef.current.options = options;
|
||||
cacheRef.current.info = (0, _treeUtil.convertDataToEntities)(options, {
|
||||
fieldNames: fieldNames,
|
||||
initWrapper: wrapper => ({
|
||||
...wrapper,
|
||||
pathKeyEntities: {}
|
||||
}),
|
||||
processEntity: (entity, wrapper) => {
|
||||
const pathKey = entity.nodes.map(node => node[fieldNames.value]).join(_commonUtil.VALUE_SPLIT);
|
||||
wrapper.pathKeyEntities[pathKey] = entity;
|
||||
|
||||
// Overwrite origin key.
|
||||
// this is very hack but we need let conduct logic work with connect path
|
||||
entity.key = pathKey;
|
||||
}
|
||||
});
|
||||
}
|
||||
return cacheRef.current.info.pathKeyEntities;
|
||||
}, [fieldNames, options]);
|
||||
return getEntities;
|
||||
};
|
||||
exports.default = _default;
|
||||
Generated
Vendored
+3
@@ -0,0 +1,3 @@
|
||||
import type { DefaultOptionType, InternalFieldNames, SingleValueType } from '../Cascader';
|
||||
export type GetMissValues = ReturnType<typeof useMissingValues>;
|
||||
export default function useMissingValues(options: DefaultOptionType[], fieldNames: InternalFieldNames): (rawValues: SingleValueType[]) => [SingleValueType[], SingleValueType[]];
|
||||
Generated
Vendored
+25
@@ -0,0 +1,25 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useMissingValues;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _treeUtil = require("../utils/treeUtil");
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function useMissingValues(options, fieldNames) {
|
||||
return React.useCallback(rawValues => {
|
||||
const missingValues = [];
|
||||
const existsValues = [];
|
||||
rawValues.forEach(valueCell => {
|
||||
const pathOptions = (0, _treeUtil.toPathOptions)(valueCell, options, fieldNames);
|
||||
if (pathOptions.every(opt => opt.option)) {
|
||||
existsValues.push(valueCell);
|
||||
} else {
|
||||
missingValues.push(valueCell);
|
||||
}
|
||||
});
|
||||
return [existsValues, missingValues];
|
||||
}, [options, fieldNames]);
|
||||
}
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
import type { DefaultOptionType } from '..';
|
||||
import type { InternalFieldNames, SingleValueType, LegacyKey } from '../Cascader';
|
||||
import { type GetEntities } from './useEntities';
|
||||
export default function useOptions(mergedFieldNames: InternalFieldNames, options?: DefaultOptionType[]): [
|
||||
mergedOptions: DefaultOptionType[],
|
||||
getPathKeyEntities: GetEntities,
|
||||
getValueByKeyPath: (pathKeys: LegacyKey[]) => SingleValueType[]
|
||||
];
|
||||
+29
@@ -0,0 +1,29 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useOptions;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _useEntities = _interopRequireDefault(require("./useEntities"));
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function useOptions(mergedFieldNames, options) {
|
||||
const mergedOptions = React.useMemo(() => options || [], [options]);
|
||||
|
||||
// Only used in multiple mode, this fn will not call in single mode
|
||||
const getPathKeyEntities = (0, _useEntities.default)(mergedOptions, mergedFieldNames);
|
||||
|
||||
/** Convert path key back to value format */
|
||||
const getValueByKeyPath = React.useCallback(pathKeys => {
|
||||
const keyPathEntities = getPathKeyEntities();
|
||||
return pathKeys.map(pathKey => {
|
||||
const {
|
||||
nodes
|
||||
} = keyPathEntities[pathKey];
|
||||
return nodes.map(node => node[mergedFieldNames.value]);
|
||||
});
|
||||
}, [getPathKeyEntities, mergedFieldNames]);
|
||||
return [mergedOptions, getPathKeyEntities, getValueByKeyPath];
|
||||
}
|
||||
Generated
Vendored
+2
@@ -0,0 +1,2 @@
|
||||
import type { CascaderProps, SearchConfig } from '../Cascader';
|
||||
export default function useSearchConfig(showSearch?: CascaderProps['showSearch'], props?: any): [boolean, SearchConfig<import("../Cascader").DefaultOptionType, string>];
|
||||
+44
@@ -0,0 +1,44 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useSearchConfig;
|
||||
var _warning = _interopRequireDefault(require("@rc-component/util/lib/warning"));
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
// Convert `showSearch` to unique config
|
||||
function useSearchConfig(showSearch, props) {
|
||||
const {
|
||||
autoClearSearchValue,
|
||||
searchValue,
|
||||
onSearch
|
||||
} = props;
|
||||
return React.useMemo(() => {
|
||||
if (!showSearch) {
|
||||
return [false, {}];
|
||||
}
|
||||
let searchConfig = {
|
||||
matchInputWidth: true,
|
||||
limit: 50,
|
||||
autoClearSearchValue,
|
||||
searchValue,
|
||||
onSearch
|
||||
};
|
||||
if (showSearch && typeof showSearch === 'object') {
|
||||
searchConfig = {
|
||||
...searchConfig,
|
||||
...showSearch
|
||||
};
|
||||
}
|
||||
if (searchConfig.limit <= 0) {
|
||||
searchConfig.limit = false;
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
(0, _warning.default)(false, "'limit' of showSearch should be positive number or false.");
|
||||
}
|
||||
}
|
||||
return [true, searchConfig];
|
||||
}, [showSearch, autoClearSearchValue, searchValue, onSearch]);
|
||||
}
|
||||
Generated
Vendored
+4
@@ -0,0 +1,4 @@
|
||||
import type { DefaultOptionType, InternalFieldNames, SearchConfig } from '../Cascader';
|
||||
export declare const SEARCH_MARK = "__rc_cascader_search_mark__";
|
||||
declare const useSearchOptions: (search: string, options: DefaultOptionType[], fieldNames: InternalFieldNames, prefixCls: string, config: SearchConfig, enableHalfPath?: boolean) => DefaultOptionType[];
|
||||
export default useSearchOptions;
|
||||
Generated
Vendored
+71
@@ -0,0 +1,71 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = exports.SEARCH_MARK = void 0;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
const SEARCH_MARK = exports.SEARCH_MARK = '__rc_cascader_search_mark__';
|
||||
const defaultFilter = (search, options, {
|
||||
label = ''
|
||||
}) => options.some(opt => String(opt[label]).toLowerCase().includes(search.toLowerCase()));
|
||||
const defaultRender = (inputValue, path, prefixCls, fieldNames) => path.map(opt => opt[fieldNames.label]).join(' / ');
|
||||
const useSearchOptions = (search, options, fieldNames, prefixCls, config, enableHalfPath) => {
|
||||
const {
|
||||
filter = defaultFilter,
|
||||
render = defaultRender,
|
||||
limit = 50,
|
||||
sort
|
||||
} = config;
|
||||
return React.useMemo(() => {
|
||||
const filteredOptions = [];
|
||||
if (!search) {
|
||||
return [];
|
||||
}
|
||||
function dig(list, pathOptions, parentDisabled = false) {
|
||||
list.forEach(option => {
|
||||
// Perf saving when `sort` is disabled and `limit` is provided
|
||||
if (!sort && limit !== false && limit > 0 && filteredOptions.length >= limit) {
|
||||
return;
|
||||
}
|
||||
const connectedPathOptions = [...pathOptions, option];
|
||||
const children = option[fieldNames.children];
|
||||
const mergedDisabled = parentDisabled || option.disabled;
|
||||
|
||||
// If current option is filterable
|
||||
if (
|
||||
// If is leaf option
|
||||
!children || children.length === 0 ||
|
||||
// If is changeOnSelect or multiple
|
||||
enableHalfPath) {
|
||||
if (filter(search, connectedPathOptions, {
|
||||
label: fieldNames.label
|
||||
})) {
|
||||
filteredOptions.push({
|
||||
...option,
|
||||
disabled: mergedDisabled,
|
||||
[fieldNames.label]: render(search, connectedPathOptions, prefixCls, fieldNames),
|
||||
[SEARCH_MARK]: connectedPathOptions,
|
||||
[fieldNames.children]: undefined
|
||||
});
|
||||
}
|
||||
}
|
||||
if (children) {
|
||||
dig(option[fieldNames.children], connectedPathOptions, mergedDisabled);
|
||||
}
|
||||
});
|
||||
}
|
||||
dig(options, []);
|
||||
|
||||
// Do sort
|
||||
if (sort) {
|
||||
filteredOptions.sort((a, b) => {
|
||||
return sort(a[SEARCH_MARK], b[SEARCH_MARK], search, fieldNames);
|
||||
});
|
||||
}
|
||||
return limit !== false && limit > 0 ? filteredOptions.slice(0, limit) : filteredOptions;
|
||||
}, [search, options, fieldNames, prefixCls, render, enableHalfPath, filter, sort, limit]);
|
||||
};
|
||||
var _default = exports.default = useSearchOptions;
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
import type { InternalValueType, LegacyKey, ShowCheckedStrategy, SingleValueType } from '../Cascader';
|
||||
import type { GetEntities } from './useEntities';
|
||||
export default function useSelect(multiple: boolean, triggerChange: (nextValues: InternalValueType) => void, checkedValues: SingleValueType[], halfCheckedValues: SingleValueType[], missingCheckedValues: SingleValueType[], getPathKeyEntities: GetEntities, getValueByKeyPath: (pathKeys: LegacyKey[]) => SingleValueType[], showCheckedStrategy?: ShowCheckedStrategy): (valuePath: SingleValueType) => void;
|
||||
+55
@@ -0,0 +1,55 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useSelect;
|
||||
var _conductUtil = require("@rc-component/tree/lib/utils/conductUtil");
|
||||
var _commonUtil = require("../utils/commonUtil");
|
||||
var _treeUtil = require("../utils/treeUtil");
|
||||
function useSelect(multiple, triggerChange, checkedValues, halfCheckedValues, missingCheckedValues, getPathKeyEntities, getValueByKeyPath, showCheckedStrategy) {
|
||||
return valuePath => {
|
||||
if (!multiple) {
|
||||
triggerChange(valuePath);
|
||||
} else {
|
||||
// Prepare conduct required info
|
||||
const pathKey = (0, _commonUtil.toPathKey)(valuePath);
|
||||
const checkedPathKeys = (0, _commonUtil.toPathKeys)(checkedValues);
|
||||
const halfCheckedPathKeys = (0, _commonUtil.toPathKeys)(halfCheckedValues);
|
||||
const existInChecked = checkedPathKeys.includes(pathKey);
|
||||
const existInMissing = missingCheckedValues.some(valueCells => (0, _commonUtil.toPathKey)(valueCells) === pathKey);
|
||||
|
||||
// Do update
|
||||
let nextCheckedValues = checkedValues;
|
||||
let nextMissingValues = missingCheckedValues;
|
||||
if (existInMissing && !existInChecked) {
|
||||
// Missing value only do filter
|
||||
nextMissingValues = missingCheckedValues.filter(valueCells => (0, _commonUtil.toPathKey)(valueCells) !== pathKey);
|
||||
} else {
|
||||
// Update checked key first
|
||||
const nextRawCheckedKeys = existInChecked ? checkedPathKeys.filter(key => key !== pathKey) : [...checkedPathKeys, pathKey];
|
||||
const pathKeyEntities = getPathKeyEntities();
|
||||
|
||||
// Conduction by selected or not
|
||||
let checkedKeys;
|
||||
if (existInChecked) {
|
||||
({
|
||||
checkedKeys
|
||||
} = (0, _conductUtil.conductCheck)(nextRawCheckedKeys, {
|
||||
checked: false,
|
||||
halfCheckedKeys: halfCheckedPathKeys
|
||||
}, pathKeyEntities));
|
||||
} else {
|
||||
({
|
||||
checkedKeys
|
||||
} = (0, _conductUtil.conductCheck)(nextRawCheckedKeys, true, pathKeyEntities));
|
||||
}
|
||||
|
||||
// Roll up to parent level keys
|
||||
const deDuplicatedKeys = (0, _treeUtil.formatStrategyValues)(checkedKeys, getPathKeyEntities, showCheckedStrategy);
|
||||
nextCheckedValues = getValueByKeyPath(deDuplicatedKeys);
|
||||
}
|
||||
triggerChange([...nextMissingValues, ...nextCheckedValues]);
|
||||
}
|
||||
};
|
||||
}
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
import type { DataEntity } from '@rc-component/tree/lib/interface';
|
||||
import type { LegacyKey, SingleValueType } from '../Cascader';
|
||||
import type { GetMissValues } from './useMissingValues';
|
||||
export default function useValues(multiple: boolean, rawValues: SingleValueType[], getPathKeyEntities: () => Record<string, DataEntity>, getValueByKeyPath: (pathKeys: LegacyKey[]) => SingleValueType[], getMissingValues: GetMissValues): [
|
||||
checkedValues: SingleValueType[],
|
||||
halfCheckedValues: SingleValueType[],
|
||||
missingCheckedValues: SingleValueType[]
|
||||
];
|
||||
+29
@@ -0,0 +1,29 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useValues;
|
||||
var _conductUtil = require("@rc-component/tree/lib/utils/conductUtil");
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _commonUtil = require("../utils/commonUtil");
|
||||
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
||||
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
||||
function useValues(multiple, rawValues, getPathKeyEntities, getValueByKeyPath, getMissingValues) {
|
||||
// Fill `rawValues` with checked conduction values
|
||||
return React.useMemo(() => {
|
||||
const [existValues, missingValues] = getMissingValues(rawValues);
|
||||
if (!multiple || !rawValues.length) {
|
||||
return [existValues, [], missingValues];
|
||||
}
|
||||
const keyPathValues = (0, _commonUtil.toPathKeys)(existValues);
|
||||
const keyPathEntities = getPathKeyEntities();
|
||||
const {
|
||||
checkedKeys,
|
||||
halfCheckedKeys
|
||||
} = (0, _conductUtil.conductCheck)(keyPathValues, true, keyPathEntities);
|
||||
|
||||
// Convert key back to value cells
|
||||
return [getValueByKeyPath(checkedKeys), getValueByKeyPath(halfCheckedKeys), missingValues];
|
||||
}, [multiple, rawValues, getPathKeyEntities, getValueByKeyPath, getMissingValues]);
|
||||
}
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
import Cascader from './Cascader';
|
||||
import Panel from './Panel';
|
||||
export type { BaseOptionType, DefaultOptionType, CascaderProps, FieldNames, SearchConfig, CascaderRef, } from './Cascader';
|
||||
export { Panel };
|
||||
export default Cascader;
|
||||
+16
@@ -0,0 +1,16 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
Object.defineProperty(exports, "Panel", {
|
||||
enumerable: true,
|
||||
get: function () {
|
||||
return _Panel.default;
|
||||
}
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _Cascader = _interopRequireDefault(require("./Cascader"));
|
||||
var _Panel = _interopRequireDefault(require("./Panel"));
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
var _default = exports.default = _Cascader.default;
|
||||
+18
@@ -0,0 +1,18 @@
|
||||
import type { DefaultOptionType, FieldNames, InternalFieldNames, InternalValueType, SingleValueType } from '../Cascader';
|
||||
export declare const VALUE_SPLIT = "__RC_CASCADER_SPLIT__";
|
||||
export declare const SHOW_PARENT = "SHOW_PARENT";
|
||||
export declare const SHOW_CHILD = "SHOW_CHILD";
|
||||
/**
|
||||
* Will convert value to string, and join with `VALUE_SPLIT`
|
||||
*/
|
||||
export declare function toPathKey(value: SingleValueType): string;
|
||||
/**
|
||||
* Batch convert value to string, and join with `VALUE_SPLIT`
|
||||
*/
|
||||
export declare function toPathKeys(value: SingleValueType[]): string[];
|
||||
export declare function toPathValueStr(pathKey: string): string[];
|
||||
export declare function fillFieldNames(fieldNames?: FieldNames): InternalFieldNames;
|
||||
export declare function isLeaf(option: DefaultOptionType, fieldNames: FieldNames): any;
|
||||
export declare function scrollIntoParentView(element: HTMLElement): void;
|
||||
export declare function getFullPathKeys(options: DefaultOptionType[], fieldNames: FieldNames): any[];
|
||||
export declare function toRawValues(value?: InternalValueType): SingleValueType[];
|
||||
+83
@@ -0,0 +1,83 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.VALUE_SPLIT = exports.SHOW_PARENT = exports.SHOW_CHILD = void 0;
|
||||
exports.fillFieldNames = fillFieldNames;
|
||||
exports.getFullPathKeys = getFullPathKeys;
|
||||
exports.isLeaf = isLeaf;
|
||||
exports.scrollIntoParentView = scrollIntoParentView;
|
||||
exports.toPathKey = toPathKey;
|
||||
exports.toPathKeys = toPathKeys;
|
||||
exports.toPathValueStr = toPathValueStr;
|
||||
exports.toRawValues = toRawValues;
|
||||
var _useSearchOptions = require("../hooks/useSearchOptions");
|
||||
const VALUE_SPLIT = exports.VALUE_SPLIT = '__RC_CASCADER_SPLIT__';
|
||||
const SHOW_PARENT = exports.SHOW_PARENT = 'SHOW_PARENT';
|
||||
const SHOW_CHILD = exports.SHOW_CHILD = 'SHOW_CHILD';
|
||||
|
||||
/**
|
||||
* Will convert value to string, and join with `VALUE_SPLIT`
|
||||
*/
|
||||
function toPathKey(value) {
|
||||
return value.join(VALUE_SPLIT);
|
||||
}
|
||||
|
||||
/**
|
||||
* Batch convert value to string, and join with `VALUE_SPLIT`
|
||||
*/
|
||||
function toPathKeys(value) {
|
||||
return value.map(toPathKey);
|
||||
}
|
||||
function toPathValueStr(pathKey) {
|
||||
return pathKey.split(VALUE_SPLIT);
|
||||
}
|
||||
function fillFieldNames(fieldNames) {
|
||||
const {
|
||||
label,
|
||||
value,
|
||||
children
|
||||
} = fieldNames || {};
|
||||
const val = value || 'value';
|
||||
return {
|
||||
label: label || 'label',
|
||||
value: val,
|
||||
key: val,
|
||||
children: children || 'children'
|
||||
};
|
||||
}
|
||||
function isLeaf(option, fieldNames) {
|
||||
return option.isLeaf ?? !option[fieldNames.children]?.length;
|
||||
}
|
||||
function scrollIntoParentView(element) {
|
||||
const parent = element.parentElement;
|
||||
if (!parent) {
|
||||
return;
|
||||
}
|
||||
const elementToParent = element.offsetTop - parent.offsetTop; // offsetParent may not be parent.
|
||||
if (elementToParent - parent.scrollTop < 0) {
|
||||
parent.scrollTo({
|
||||
top: elementToParent
|
||||
});
|
||||
} else if (elementToParent + element.offsetHeight - parent.scrollTop > parent.offsetHeight) {
|
||||
parent.scrollTo({
|
||||
top: elementToParent + element.offsetHeight - parent.offsetHeight
|
||||
});
|
||||
}
|
||||
}
|
||||
function getFullPathKeys(options, fieldNames) {
|
||||
return options.map(item => item[_useSearchOptions.SEARCH_MARK]?.map(opt => opt[fieldNames.value]));
|
||||
}
|
||||
function isMultipleValue(value) {
|
||||
return Array.isArray(value) && Array.isArray(value[0]);
|
||||
}
|
||||
function toRawValues(value) {
|
||||
if (!value) {
|
||||
return [];
|
||||
}
|
||||
if (isMultipleValue(value)) {
|
||||
return value;
|
||||
}
|
||||
return (value.length === 0 ? [] : [value]).map(val => Array.isArray(val) ? val : [val]);
|
||||
}
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
import type { SingleValueType, DefaultOptionType, InternalFieldNames, ShowCheckedStrategy, LegacyKey } from '../Cascader';
|
||||
import type { GetEntities } from '../hooks/useEntities';
|
||||
export declare function formatStrategyValues(pathKeys: LegacyKey[], getKeyPathEntities: GetEntities, showCheckedStrategy?: ShowCheckedStrategy): LegacyKey[];
|
||||
export declare function toPathOptions(valueCells: SingleValueType, options: DefaultOptionType[], fieldNames: InternalFieldNames, stringMode?: boolean): {
|
||||
value: SingleValueType[number];
|
||||
index: number;
|
||||
option: DefaultOptionType;
|
||||
}[];
|
||||
+42
@@ -0,0 +1,42 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.formatStrategyValues = formatStrategyValues;
|
||||
exports.toPathOptions = toPathOptions;
|
||||
var _commonUtil = require("./commonUtil");
|
||||
function formatStrategyValues(pathKeys, getKeyPathEntities, showCheckedStrategy) {
|
||||
const valueSet = new Set(pathKeys);
|
||||
const keyPathEntities = getKeyPathEntities();
|
||||
return pathKeys.filter(key => {
|
||||
const entity = keyPathEntities[key];
|
||||
const parent = entity ? entity.parent : null;
|
||||
const children = entity ? entity.children : null;
|
||||
if (entity && entity.node.disabled) {
|
||||
return true;
|
||||
}
|
||||
return showCheckedStrategy === _commonUtil.SHOW_CHILD ? !(children && children.some(child => child.key && valueSet.has(child.key))) : !(parent && !parent.node.disabled && valueSet.has(parent.key));
|
||||
});
|
||||
}
|
||||
function toPathOptions(valueCells, options, fieldNames,
|
||||
// Used for loadingKeys which saved loaded keys as string
|
||||
stringMode = false) {
|
||||
let currentList = options;
|
||||
const valueOptions = [];
|
||||
for (let i = 0; i < valueCells.length; i += 1) {
|
||||
const valueCell = valueCells[i];
|
||||
const foundIndex = currentList?.findIndex(option => {
|
||||
const val = option[fieldNames.value];
|
||||
return stringMode ? String(val) === String(valueCell) : val === valueCell;
|
||||
});
|
||||
const foundOption = foundIndex !== -1 ? currentList?.[foundIndex] : null;
|
||||
valueOptions.push({
|
||||
value: foundOption?.[fieldNames.value] ?? valueCell,
|
||||
index: foundIndex,
|
||||
option: foundOption
|
||||
});
|
||||
currentList = foundOption?.[fieldNames.children];
|
||||
}
|
||||
return valueOptions;
|
||||
}
|
||||
Generated
Vendored
+2
@@ -0,0 +1,2 @@
|
||||
import type { DefaultOptionType, FieldNames } from '../Cascader';
|
||||
export declare function warningNullOptions(options: DefaultOptionType[], fieldNames: FieldNames): void;
|
||||
Generated
Vendored
+26
@@ -0,0 +1,26 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.warningNullOptions = warningNullOptions;
|
||||
var _warning = _interopRequireDefault(require("@rc-component/util/lib/warning"));
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
// value in Cascader options should not be null
|
||||
function warningNullOptions(options, fieldNames) {
|
||||
if (options) {
|
||||
const recursiveOptions = optionsList => {
|
||||
for (let i = 0; i < optionsList.length; i++) {
|
||||
const option = optionsList[i];
|
||||
if (option[fieldNames?.value] === null) {
|
||||
(0, _warning.default)(false, '`value` in Cascader options should not be `null`.');
|
||||
return true;
|
||||
}
|
||||
if (Array.isArray(option[fieldNames?.children]) && recursiveOptions(option[fieldNames?.children])) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
};
|
||||
recursiveOptions(options);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user