@aloudata/aloudata-design 0.2.7 → 0.3.1

package/es/Select/index.js

@@ -1,8 +1,156 @@
-import BaseSelect from './BaseSelect';
-import Options from './OptionsList/Options';
-import OptGroup from './OptionsList/OptGroup';
-var Select = BaseSelect;
-Select.Option = Options;
-Select.Group = OptGroup;
-export { Options as Option, OptGroup as Group };
+var _excluded = ["prefixCls", "bordered", "className", "getPopupContainer", "dropdownClassName", "listHeight", "placement", "listItemHeight", "size", "disabled", "notFoundContent", "status", "showArrow"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+// @ts-nocheck
+// TODO: 4.0 - codemod should help to change `filterOption` to support node props.
+import classNames from 'classnames';
+import RcSelect, { OptGroup, Option } from './rc-select';
+import omit from 'rc-util/lib/omit';
+import * as React from 'react';
+import { useContext } from 'react';
+import { ConfigContext } from 'antd/lib/config-provider';
+import SizeContext from 'antd/lib/config-provider/SizeContext';
+import DisabledContext from 'antd/lib/config-provider/DisabledContext';
+import { FormItemInputContext } from 'antd/lib/form/context';
+import { getTransitionDirection, getTransitionName } from 'antd/lib/_util/motion';
+import { getMergedStatus, getStatusClassNames } from 'antd/lib/_util/statusUtils';
+import defaultRenderEmpty from 'antd/lib/config-provider/defaultRenderEmpty';
+import getIcons from './utils/iconUtil';
+var SECRET_COMBOBOX_MODE_DO_NOT_USE = 'SECRET_COMBOBOX_MODE_DO_NOT_USE';
+
+var InternalSelect = function InternalSelect(_ref, ref) {
+  var _classNames2;
+
+  var customizePrefixCls = _ref.prefixCls,
+      _ref$bordered = _ref.bordered,
+      bordered = _ref$bordered === void 0 ? true : _ref$bordered,
+      className = _ref.className,
+      getPopupContainer = _ref.getPopupContainer,
+      dropdownClassName = _ref.dropdownClassName,
+      _ref$listHeight = _ref.listHeight,
+      listHeight = _ref$listHeight === void 0 ? 256 : _ref$listHeight,
+      placement = _ref.placement,
+      _ref$listItemHeight = _ref.listItemHeight,
+      listItemHeight = _ref$listItemHeight === void 0 ? 24 : _ref$listItemHeight,
+      customizeSize = _ref.size,
+      customDisabled = _ref.disabled,
+      notFoundContent = _ref.notFoundContent,
+      customStatus = _ref.status,
+      _ref$showArrow = _ref.showArrow,
+      showArrow = _ref$showArrow === void 0 ? true : _ref$showArrow,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  var _React$useContext = React.useContext(ConfigContext),
+      getContextPopupContainer = _React$useContext.getPopupContainer,
+      getPrefixCls = _React$useContext.getPrefixCls,
+      renderEmpty = _React$useContext.renderEmpty,
+      direction = _React$useContext.direction,
+      virtual = _React$useContext.virtual,
+      dropdownMatchSelectWidth = _React$useContext.dropdownMatchSelectWidth;
+
+  var size = React.useContext(SizeContext);
+  var prefixCls = getPrefixCls('select', customizePrefixCls);
+  var rootPrefixCls = getPrefixCls();
+  var mode = React.useMemo(function () {
+    var m = props.mode;
+
+    if (m === 'combobox') {
+      return undefined;
+    }
+
+    if (m === SECRET_COMBOBOX_MODE_DO_NOT_USE) {
+      return 'combobox';
+    }
+
+    return m;
+  }, [props.mode]);
+  var isMultiple = mode === 'multiple' || mode === 'tags';
+  var mergedShowArrow = showArrow !== undefined ? showArrow : props.loading || !(isMultiple || mode === 'combobox'); // ===================== Form Status =====================
+
+  var _useContext = useContext(FormItemInputContext),
+      contextStatus = _useContext.status,
+      hasFeedback = _useContext.hasFeedback,
+      isFormItemInput = _useContext.isFormItemInput,
+      feedbackIcon = _useContext.feedbackIcon;
+
+  var mergedStatus = getMergedStatus(contextStatus, customStatus); // ===================== Empty =====================
+
+  var mergedNotFound;
+
+  if (notFoundContent !== undefined) {
+    mergedNotFound = notFoundContent;
+  } else if (mode === 'combobox') {
+    mergedNotFound = null;
+  } else {
+    mergedNotFound = (renderEmpty || defaultRenderEmpty)('Select');
+  } // ===================== Icons =====================
+
+
+  var _getIcons = getIcons(_objectSpread(_objectSpread({}, props), {}, {
+    multiple: isMultiple,
+    hasFeedback: hasFeedback,
+    feedbackIcon: feedbackIcon,
+    showArrow: mergedShowArrow,
+    prefixCls: prefixCls
+  })),
+      suffixIcon = _getIcons.suffixIcon,
+      itemIcon = _getIcons.itemIcon,
+      removeIcon = _getIcons.removeIcon,
+      clearIcon = _getIcons.clearIcon;
+
+  var selectProps = omit(props, ['suffixIcon', 'itemIcon']);
+  var rcSelectRtlDropdownClassName = classNames(dropdownClassName, _defineProperty({}, "".concat(prefixCls, "-dropdown-").concat(direction), direction === 'rtl'));
+  var mergedSize = customizeSize || size; // ===================== Disabled =====================
+
+  var disabled = React.useContext(DisabledContext);
+  var mergedDisabled = customDisabled || disabled;
+  var mergedClassName = classNames('ald-select', (_classNames2 = {}, _defineProperty(_classNames2, "ald-select-large", mergedSize === 'large'), _defineProperty(_classNames2, "ald-select-small", mergedSize === 'small'), _defineProperty(_classNames2, 'ald-select-mini', mergedSize === 'mini'), _defineProperty(_classNames2, 'ald-select-middle', !['large', 'small', 'mini'].includes(mergedSize)), _defineProperty(_classNames2, "".concat(prefixCls, "-rtl"), direction === 'rtl'), _defineProperty(_classNames2, "".concat(prefixCls, "-borderless"), !bordered), _defineProperty(_classNames2, "".concat(prefixCls, "-in-form-item"), isFormItemInput), _classNames2), getStatusClassNames(prefixCls, mergedStatus, hasFeedback), className); // ===================== Placement =====================
+
+  var getPlacement = function getPlacement() {
+    if (placement !== undefined) {
+      return placement;
+    }
+
+    return direction === 'rtl' ? 'bottomRight' : 'bottomLeft';
+  };
+
+  return /*#__PURE__*/React.createElement(RcSelect, Object.assign({
+    ref: ref,
+    virtual: virtual,
+    dropdownMatchSelectWidth: dropdownMatchSelectWidth
+  }, selectProps, {
+    transitionName: getTransitionName(rootPrefixCls, getTransitionDirection(placement), props.transitionName),
+    listHeight: listHeight,
+    listItemHeight: listItemHeight,
+    mode: mode,
+    prefixCls: prefixCls,
+    size: mergedSize,
+    placement: getPlacement(),
+    direction: direction,
+    inputIcon: suffixIcon,
+    menuItemSelectedIcon: itemIcon,
+    removeIcon: removeIcon,
+    clearIcon: clearIcon,
+    notFoundContent: mergedNotFound,
+    className: mergedClassName,
+    getPopupContainer: getPopupContainer || getContextPopupContainer,
+    dropdownClassName: rcSelectRtlDropdownClassName,
+    showArrow: hasFeedback || showArrow,
+    disabled: mergedDisabled
+  }));
+};
+
+var Select = /*#__PURE__*/React.forwardRef(InternalSelect);
+Select.SECRET_COMBOBOX_MODE_DO_NOT_USE = SECRET_COMBOBOX_MODE_DO_NOT_USE;
+Select.Option = Option;
+Select.OptGroup = OptGroup;
 export default Select;

package/es/Select/rc-select/BaseSelect.d.ts

@@ -0,0 +1,116 @@
+import * as React from 'react';
+import type { AlignType } from 'rc-trigger/lib/interface';
+import type { ScrollTo, ScrollConfig } from 'rc-virtual-list/lib/List';
+export declare type RenderNode = React.ReactNode | ((props: any) => React.ReactNode);
+export declare type RenderDOMFunc = (props: any) => HTMLElement;
+export declare type Mode = 'multiple' | 'tags' | 'combobox';
+export declare type Placement = 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topRight';
+export declare type RawValueType = string | number;
+export interface RefOptionListProps {
+    onKeyDown: React.KeyboardEventHandler;
+    onKeyUp: React.KeyboardEventHandler;
+    scrollTo?: (args: number | ScrollConfig) => void;
+}
+export declare type CustomTagProps = {
+    label: React.ReactNode;
+    value: any;
+    disabled: boolean;
+    onClose: (event?: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+    closable: boolean;
+};
+export interface DisplayValueType {
+    key?: React.Key;
+    value?: RawValueType;
+    label?: React.ReactNode;
+    disabled?: boolean;
+}
+export interface BaseSelectRef {
+    focus: () => void;
+    blur: () => void;
+    scrollTo: ScrollTo;
+}
+export interface BaseSelectPrivateProps {
+    id: string;
+    prefixCls: string;
+    omitDomProps?: string[];
+    displayValues: DisplayValueType[];
+    onDisplayValuesChange: (values: DisplayValueType[], info: {
+        type: 'add' | 'remove' | 'clear';
+        values: DisplayValueType[];
+    }) => void;
+    /** Current dropdown list active item string value */
+    activeValue?: string;
+    /** Link search input with target element */
+    activeDescendantId?: string;
+    onActiveValueChange?: (value: string | null) => void;
+    searchValue: string;
+    /** Trigger onSearch, return false to prevent trigger open event */
+    onSearch: (searchValue: string, info: {
+        source: 'typing' | 'effect' | 'submit' | 'blur';
+    }) => void;
+    /** Trigger when search text match the `tokenSeparators`. Will provide split content */
+    onSearchSplit?: (words: string[]) => void;
+    OptionList: React.ForwardRefExoticComponent<React.PropsWithoutRef<any> & React.RefAttributes<RefOptionListProps>>;
+    /** Tell if provided `options` is empty */
+    emptyOptions: boolean;
+}
+export declare type BaseSelectPropsWithoutPrivate = Omit<BaseSelectProps, keyof BaseSelectPrivateProps>;
+export interface BaseSelectProps extends BaseSelectPrivateProps, React.AriaAttributes {
+    className?: string;
+    style?: React.CSSProperties;
+    showSearch?: boolean;
+    tagRender?: (props: CustomTagProps) => React.ReactElement;
+    direction?: 'ltr' | 'rtl';
+    maxLength?: number;
+    prefix?: RenderNode;
+    tabIndex?: number;
+    autoFocus?: boolean;
+    notFoundContent?: React.ReactNode;
+    placeholder?: React.ReactNode;
+    onClear?: () => void;
+    choiceTransitionName?: string;
+    mode?: Mode;
+    disabled?: boolean;
+    loading?: boolean;
+    open?: boolean;
+    defaultOpen?: boolean;
+    onDropdownVisibleChange?: (open: boolean) => void;
+    /** @private Internal usage. Do not use in your production. */
+    getInputElement?: () => JSX.Element;
+    /** @private Internal usage. Do not use in your production. */
+    getRawInputElement?: () => JSX.Element;
+    maxTagTextLength?: number;
+    maxTagCount?: number | 'responsive';
+    maxTagPlaceholder?: React.ReactNode | ((omittedValues: DisplayValueType[]) => React.ReactNode);
+    tokenSeparators?: string[];
+    allowClear?: boolean;
+    showArrow?: boolean;
+    inputIcon?: RenderNode;
+    /** Clear all icon */
+    clearIcon?: RenderNode;
+    /** Selector remove icon */
+    removeIcon?: RenderNode;
+    animation?: string;
+    transitionName?: string;
+    dropdownStyle?: React.CSSProperties;
+    dropdownClassName?: string;
+    dropdownMatchSelectWidth?: boolean | number;
+    dropdownRender?: (menu: React.ReactElement) => React.ReactElement;
+    dropdownAlign?: AlignType;
+    placement?: Placement;
+    getPopupContainer?: RenderDOMFunc;
+    showAction?: ('focus' | 'click')[];
+    onBlur?: React.FocusEventHandler<HTMLElement>;
+    onFocus?: React.FocusEventHandler<HTMLElement>;
+    onKeyUp?: React.KeyboardEventHandler<HTMLDivElement>;
+    onKeyDown?: React.KeyboardEventHandler<HTMLDivElement>;
+    onMouseDown?: React.MouseEventHandler<HTMLDivElement>;
+    onPopupScroll?: React.UIEventHandler<HTMLDivElement>;
+    onInputKeyDown?: React.KeyboardEventHandler<HTMLInputElement | HTMLTextAreaElement>;
+    onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
+    onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
+    onClick?: React.MouseEventHandler<HTMLDivElement>;
+}
+export declare function isMultiple(mode: Mode): boolean;
+declare const BaseSelect: React.ForwardRefExoticComponent<BaseSelectProps & React.RefAttributes<BaseSelectRef>>;
+export default BaseSelect;