@aloudata/aloudata-design 0.4.8-beta.2 → 0.4.8-beta.4

package/dist/Select/components/MultipleOption.d.ts

@@ -5,6 +5,7 @@ interface IMultipleOptionProps {
     disabled?: boolean;
     option: DefaultOptionType;
     onChange?: (selected: boolean) => void;
+    className?: string;
 }
 export default function MultipleList(params: IMultipleOptionProps): JSX.Element;
 export {};

package/dist/Select/components/MultipleOption.js

@@ -1,10 +1,12 @@
 import { Checkbox } from 'antd';
+import classnames from 'classnames';
 import React from 'react';
 export default function MultipleList(params) {
   var disabled = params.disabled,
       option = params.option,
       selected = params.selected,
-      onChange = params.onChange;
+      onChange = params.onChange,
+      className = params.className;
 
   var onClick = function onClick() {
     //TODO: 这里有bug 等待antd升级 https://github.com/ant-design/ant-design/pull/39078
@@ -12,7 +14,7 @@ export default function MultipleList(params) {
   };
 
   return /*#__PURE__*/React.createElement("div", {
-    className: "ald-multiple-option",
+    className: classnames('ald-multiple-option', className),
     onClick: onClick
   }, /*#__PURE__*/React.createElement(Checkbox, {
     checked: selected,

package/dist/Select/components/SingleOption.d.ts

@@ -5,6 +5,7 @@ interface ISelectProps {
     option: DefaultOptionType;
     onChange: (selected: boolean) => void;
     disabled?: boolean;
+    className?: string;
 }
 export default function SingleOption(params: ISelectProps): JSX.Element;
 export {};

package/dist/Select/components/SingleOption.js

@@ -1,4 +1,5 @@
 import { CheckLine } from '@aloudata/icons-react';
+import classnames from 'classnames';
 import React from 'react';
 import colors from "../../style/themes/default/themeColor.module.less";
 export default function SingleOption(params) {
@@ -6,7 +7,8 @@ export default function SingleOption(params) {
       selected = params.selected,
       option = params.option,
       _params$onChange = params.onChange,
-      onChange = _params$onChange === void 0 ? function () {} : _params$onChange;
+      onChange = _params$onChange === void 0 ? function () {} : _params$onChange,
+      className = params.className;
 
   var onClick = function onClick() {
     if (disabled) return;
@@ -14,7 +16,7 @@ export default function SingleOption(params) {
   };
 
   return /*#__PURE__*/React.createElement("div", {
-    className: "ald-single-option",
+    className: classnames('ald-single-option', className),
     onClick: onClick
   }, /*#__PURE__*/React.createElement("div", {
     className: "ald-icons-check-line"

package/dist/Select/index.js

@@ -1,4 +1,4 @@
-var _excluded = ["mode", "options", "dropdownRender", "onDropdownVisibleChange", "defaultValue", "onChange", "open", "defaultOpen", "prefix", "className", "popupClassName", "notFoundContent", "value", "style"];
+var _excluded = ["mode", "options", "dropdownRender", "onDropdownVisibleChange", "defaultValue", "onChange", "open", "defaultOpen", "prefix", "className", "popupClassName", "listHeight", "listItemHeight", "notFoundContent", "value", "style"];
 
 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); }
 
@@ -30,9 +30,10 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 import { Select as AntdSelect } from 'antd';
 import classNames from 'classnames';
+import List from 'rc-virtual-list';
 import React, { forwardRef, useEffect, useLayoutEffect, useMemo } from 'react';
 import Empty from "../Empty";
-import MultipleList from "./components/MultipleOption";
+import MultipleOption from "./components/MultipleOption";
 import SingleOption from "./components/SingleOption";
 
 var getSelectedOptionsFromValue = function getSelectedOptionsFromValue(isMultiple, options, value, defaultValue) {
@@ -90,6 +91,8 @@ var Select = /*#__PURE__*/forwardRef(function (props, ref) {
       prefix = props.prefix,
       className = props.className,
       popupClassName = props.popupClassName,
+      listHeight = props.listHeight,
+      listItemHeight = props.listItemHeight,
       _props$notFoundConten = props.notFoundContent,
       notFoundContent = _props$notFoundConten === void 0 ? /*#__PURE__*/React.createElement(Empty, null) : _props$notFoundConten,
       value = props.value,
@@ -147,13 +150,20 @@ var Select = /*#__PURE__*/forwardRef(function (props, ref) {
   var multipleRender = function multipleRender() {
     return /*#__PURE__*/React.createElement("div", {
       className: "ald-multiple-option-list"
-    }, options === null || options === void 0 ? void 0 : options.map(function (option) {
+    }, /*#__PURE__*/React.createElement(List, {
+      data: options || [],
+      "data-id": "list",
+      height: listHeight,
+      itemHeight: listItemHeight || 36,
+      itemKey: "value"
+    }, function (option) {
       var isSelected = selectedOptions.some(function (selectedOption) {
         return selectedOption.value === option.value;
       });
-      return /*#__PURE__*/React.createElement(MultipleList, {
+      return /*#__PURE__*/React.createElement(MultipleOption, {
         key: option.value,
         selected: isSelected,
+        className: option.className,
         option: option,
         disabled: option.disabled,
         onChange: function onChange(selected) {
@@ -178,13 +188,20 @@ var Select = /*#__PURE__*/forwardRef(function (props, ref) {
   var singleRender = function singleRender() {
     return /*#__PURE__*/React.createElement("div", {
       className: "ald-single-option-list"
-    }, options === null || options === void 0 ? void 0 : options.map(function (option) {
+    }, /*#__PURE__*/React.createElement(List, {
+      data: options || [],
+      "data-id": "list",
+      height: listHeight,
+      itemHeight: listItemHeight || 36,
+      itemKey: "value"
+    }, function (option) {
       var isSelected = selectedOptions.some(function (selectedOption) {
         return selectedOption.value === option.value;
       });
       return /*#__PURE__*/React.createElement(SingleOption, {
         key: option.value,
         selected: isSelected,
+        className: option.className,
         option: option,
         disabled: option.disabled,
         onChange: function onChange() {

package/dist/Select/style/index.less

@@ -11,7 +11,7 @@
   padding-right: 0;
 
   &.ald-select-popup {
-    max-height: 264px;
+    // max-height: 264px;
     overflow-y: auto;
     overflow-y: overlay;
   }

package/dist/Select/style/multiple.less

@@ -5,14 +5,14 @@
   justify-content: space-between;
   flex-direction: column;
   color: @NL0;
-  font-size: 14px;
+  font-size: 13px;
   line-height: 20px;
 
 }
 
 .ald-multiple-option{
   padding: 8px 14px;
-  height: 20px;
+  // height: 20px;
   margin-left: 0;
   display: flex;
 

package/dist/Select/style/single.less

@@ -1,6 +1,6 @@
 .ald-single-option-list{
   color: @NL0;
-  font-size: 14px;
+  font-size: 13px;
   line-height: 20px;
 
   .ald-single-option{

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aloudata/aloudata-design",
-  "version": "0.4.8-beta.2",
+  "version": "0.4.8-beta.4",
   "description": "",
   "license": "MIT",
   "module": "dist/index.js",