@qn-pandora/pandora-component 2.1.2 → 3.0.0

package/es/components/NameLimiter/style.less

@@ -1,7 +1,16 @@
 @import 'antd/lib/tooltip/style/index.less';
 @import '../../style/theme.less';
 
-.@{sdk-prefix}-name-tooltip {
+.@{sdk-prefix}-name-limit {
+  max-width: 100%;
+  display: inline-block;
+  vertical-align: top;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+
+.@{sdk-prefix}-name-limit-tooltip {
   .@{ant-prefix}-tooltip-inner {
     max-width: 400px !important;
     max-height: 200px !important;

package/es/components/OptionList/index.js

@@ -28,7 +28,7 @@ export * from './constants';
 /**
  * 资源列表页面表格中操作列表
  */
-export default function OptionList(props) {
+function OptionList(props) {
     var mode = props.mode, _a = props.options, options = _a === void 0 ? [] : _a, placement = props.placement, className = props.className, popupClassName = props.popupClassName, other = __rest(props, ["mode", "options", "placement", "className", "popupClassName"]);
     var globalShowMode = mode === 'popover' ? EShowMode.POPOVER : EShowMode.INLINE;
     var showingOptions = options.filter(function (op) { return !op.hidden; });
@@ -51,3 +51,4 @@ export default function OptionList(props) {
 OptionList.EShowMode = EShowMode;
 OptionList.InlineOptionList = InlineOptionList;
 OptionList.PopoverOptionList = PopoverOptionList;
+export default OptionList;

package/es/components/RangeInput/style.css

@@ -13,7 +13,7 @@
   line-height: 1.5715;
   background-color: transparent;
   background-image: none;
-  border: 1px solid #d9d9d9;
+  border: 1px solid #bfbfbf;
   border-radius: 2px;
   -webkit-transition: all 0.3s;
   transition: all 0.3s;
@@ -64,7 +64,7 @@
   opacity: 1;
 }
 .ant-input-affix-wrapper-disabled:hover {
-  border-color: #d9d9d9;
+  border-color: #bfbfbf;
   border-right-width: 1px !important;
 }
 .ant-input-affix-wrapper[disabled] {
@@ -74,7 +74,7 @@
   opacity: 1;
 }
 .ant-input-affix-wrapper[disabled]:hover {
-  border-color: #d9d9d9;
+  border-color: #bfbfbf;
   border-right-width: 1px !important;
 }
 .ant-input-affix-wrapper-borderless,
@@ -98,7 +98,7 @@ textarea.ant-input-affix-wrapper {
   transition: all 0.3s, height 0s;
 }
 .ant-input-affix-wrapper-lg {
-  padding: 2.5px 11px;
+  padding: 6.5px 11px;
   font-size: 16px;
 }
 .ant-input-affix-wrapper-sm {
@@ -209,7 +209,7 @@ textarea.ant-input-affix-wrapper {
   line-height: 1.5715;
   background-color: transparent;
   background-image: none;
-  border: 1px solid #d9d9d9;
+  border: 1px solid #bfbfbf;
   border-radius: 2px;
   -webkit-transition: all 0.3s;
   transition: all 0.3s;
@@ -257,7 +257,7 @@ textarea.ant-input-affix-wrapper {
   opacity: 1;
 }
 .ant-input-disabled:hover {
-  border-color: #d9d9d9;
+  border-color: #bfbfbf;
   border-right-width: 1px !important;
 }
 .ant-input[disabled] {
@@ -267,7 +267,7 @@ textarea.ant-input-affix-wrapper {
   opacity: 1;
 }
 .ant-input[disabled]:hover {
-  border-color: #d9d9d9;
+  border-color: #bfbfbf;
   border-right-width: 1px !important;
 }
 .ant-input-borderless,
@@ -291,7 +291,7 @@ textarea.ant-input {
   transition: all 0.3s, height 0s;
 }
 .ant-input-lg {
-  padding: 2.5px 11px;
+  padding: 6.5px 11px;
   font-size: 16px;
 }
 .ant-input-sm {
@@ -373,7 +373,7 @@ textarea.ant-input {
   font-size: 14px;
   text-align: center;
   background-color: #fafafa;
-  border: 1px solid #d9d9d9;
+  border: 1px solid #bfbfbf;
   border-radius: 2px;
   -webkit-transition: all 0.3s;
   transition: all 0.3s;
@@ -427,7 +427,7 @@ textarea.ant-input {
 }
 .ant-input-group-lg .ant-input,
 .ant-input-group-lg > .ant-input-group-addon {
-  padding: 2.5px 11px;
+  padding: 6.5px 11px;
   font-size: 16px;
 }
 .ant-input-group-sm .ant-input,
@@ -435,7 +435,7 @@ textarea.ant-input {
   padding: 1px 7px;
 }
 .ant-input-group-lg .ant-select-single .ant-select-selector {
-  height: 32px;
+  height: 40px;
 }
 .ant-input-group-sm .ant-select-single .ant-select-selector {
   height: 26px;
@@ -562,12 +562,12 @@ textarea.ant-input {
   border-radius: 0 2px 2px 0;
 }
 .ant-input-group-rtl .ant-input-group-addon:first-child {
-  border-right: 1px solid #d9d9d9;
+  border-right: 1px solid #bfbfbf;
   border-left: 0;
 }
 .ant-input-group-rtl .ant-input-group-addon:last-child {
   border-right: 0;
-  border-left: 1px solid #d9d9d9;
+  border-left: 1px solid #bfbfbf;
 }
 .ant-input-group-rtl.ant-input-group > .ant-input:last-child,
 .ant-input-group-rtl.ant-input-group-addon:last-child {
@@ -624,7 +624,7 @@ textarea.ant-input {
   height: 32px;
 }
 .ant-input[type='color'].ant-input-lg {
-  height: 32px;
+  height: 40px;
 }
 .ant-input[type='color'].ant-input-sm {
   height: 26px;
@@ -679,7 +679,7 @@ textarea.ant-input {
   z-index: 1;
 }
 .ant-input-search-large .ant-input-search-button {
-  height: 32px;
+  height: 40px;
 }
 .ant-input-search-small .ant-input-search-button {
   height: 26px;
@@ -738,7 +738,7 @@ textarea.ant-input {
     height: 32px;
   }
   .ant-input-lg {
-    height: 32px;
+    height: 40px;
   }
   .ant-input-sm {
     height: 26px;
@@ -764,7 +764,7 @@ textarea.ant-input {
   line-height: 1.5715;
   background-color: transparent;
   background-image: none;
-  border: 1px solid #d9d9d9;
+  border: 1px solid #bfbfbf;
   -webkit-transition: all 0.3s;
   transition: all 0.3s;
   display: inline-block;
@@ -817,7 +817,7 @@ textarea.ant-input {
   opacity: 1;
 }
 .ant-input-number-disabled:hover {
-  border-color: #d9d9d9;
+  border-color: #bfbfbf;
   border-right-width: 1px !important;
 }
 .ant-input-number[disabled] {
@@ -827,7 +827,7 @@ textarea.ant-input {
   opacity: 1;
 }
 .ant-input-number[disabled]:hover {
-  border-color: #d9d9d9;
+  border-color: #bfbfbf;
   border-right-width: 1px !important;
 }
 .ant-input-number-borderless,
@@ -851,7 +851,7 @@ textarea.ant-input-number {
   transition: all 0.3s, height 0s;
 }
 .ant-input-number-lg {
-  padding: 2.5px 11px;
+  padding: 6.5px 11px;
   font-size: 16px;
 }
 .ant-input-number-sm {
@@ -950,7 +950,7 @@ textarea.ant-input-number {
   opacity: 1;
 }
 .ant-input-number-disabled:hover {
-  border-color: #d9d9d9;
+  border-color: #bfbfbf;
   border-right-width: 1px !important;
 }
 .ant-input-number-disabled .ant-input-number-input {
@@ -1000,7 +1000,7 @@ textarea.ant-input-number {
   font-size: 16px;
 }
 .ant-input-number-lg input {
-  height: 30px;
+  height: 38px;
 }
 .ant-input-number-sm {
   padding: 0;

package/es/components/RemarkName/index.d.ts

@@ -4,8 +4,6 @@ export interface IRemarkName {
     name: string;
     /** 备注 */
     remark?: string;
-    /** 名称展示最大长度 */
-    length: number;
 }
 export declare const IgnoreDesString = "\u7531logkit";
 /**

package/es/components/RemarkName/index.js

@@ -1,17 +1,15 @@
 import * as React from 'react';
-import { SDK_PREFIX } from '../../constants/style';
 import NameLimiter from '../../components/NameLimiter';
 export var IgnoreDesString = '由logkit';
 /**
  * 资源名称展示位'名称(备注)'
  */
 export default function RemarkName(props) {
-    var name = props.name, remark = props.remark, length = props.length;
+    var name = props.name, remark = props.remark;
     var getTooltip = function () {
         return remark && remark !== name && !remark.startsWith(IgnoreDesString)
             ? name + "(" + (remark && remark.trim()) + ")"
             : '';
     };
-    return (React.createElement("span", { className: SDK_PREFIX + "-remark-name" },
-        React.createElement(NameLimiter, { name: name, title: getTooltip(), length: length })));
+    return React.createElement(NameLimiter, { name: name, title: getTooltip() });
 }

package/es/components/RemarkName/style.css

@@ -262,7 +262,15 @@
 .ant-tooltip-rtl .ant-tooltip-inner {
   text-align: right;
 }
-.pandora-sdk-name-tooltip .ant-tooltip-inner {
+.pandora-sdk-name-limit {
+  max-width: 100%;
+  display: inline-block;
+  vertical-align: top;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
+.pandora-sdk-name-limit-tooltip .ant-tooltip-inner {
   max-width: 400px !important;
   max-height: 200px !important;
   overflow: auto;
@@ -275,7 +283,3 @@
 .ant-btn-sm {
   padding: 0 7px;
 }
-.pandora-sdk-remark-name {
-  word-break: break-all;
-  white-space: nowrap;
-}

package/es/components/RemarkName/style.less

@@ -1,7 +1,2 @@
 @import '../NameLimiter/style.less';
 @import '../../style/theme.less';
-
-.@{sdk-prefix}-remark-name {
-  word-break: break-all;
-  white-space: nowrap;
-}

package/es/components/Selector/style.css

@@ -211,7 +211,7 @@
 }
 .ant-select-disabled.ant-select-multiple .ant-select-selection-item {
   color: #bfbfbf;
-  border-color: #d9d9d9;
+  border-color: #bfbfbf;
   cursor: not-allowed;
 }
 .ant-select-multiple .ant-select-selection-item-content {
@@ -299,20 +299,20 @@
   transition: all 0.3s;
 }
 .ant-select-multiple.ant-select-lg .ant-select-selector::after {
-  line-height: 24px;
+  line-height: 32px;
 }
 .ant-select-multiple.ant-select-lg .ant-select-selection-item {
-  height: 24px;
-  line-height: 22px;
+  height: 32px;
+  line-height: 30px;
 }
 .ant-select-multiple.ant-select-lg .ant-select-selection-search {
-  height: 24px;
-  line-height: 24px;
+  height: 32px;
+  line-height: 32px;
 }
 .ant-select-multiple.ant-select-lg .ant-select-selection-search-input,
 .ant-select-multiple.ant-select-lg .ant-select-selection-search-mirror {
-  height: 24px;
-  line-height: 22px;
+  height: 32px;
+  line-height: 30px;
 }
 .ant-select-multiple.ant-select-sm .ant-select-selector::after {
   line-height: 18px;
@@ -364,7 +364,7 @@
 .ant-select:not(.ant-select-customize-input) .ant-select-selector {
   position: relative;
   background-color: #ffffff;
-  border: 1px solid #d9d9d9;
+  border: 1px solid #bfbfbf;
   border-radius: 2px;
   -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
   transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
@@ -1042,16 +1042,20 @@
 .pandora-sdk-selector-dropdown .ant-select-dropdown-menu::-webkit-scrollbar-corner {
   background: transparent;
 }
-.pandora-sdk-selector-dropdown .ant-select-dropdown-menu-item-disabled {
+.pandora-sdk-selector-dropdown .ant-select-item-option-disabled {
   color: #d9d9d9 !important;
 }
-.pandora-sdk-selector-dropdown .ant-select-dropdown-menu-item-selected {
+.pandora-sdk-selector-dropdown .ant-select-item-option-selected {
   color: #2c6dd2;
+  font-weight: 400;
 }
-.pandora-sdk-selector-dropdown .ant-select-dropdown-menu-item-selected::after {
+.pandora-sdk-selector-dropdown .ant-select-item-option-selected::after {
   color: #2c6dd2 !important;
 }
-.pandora-sdk-selector-dropdown .ant-select-dropdown-menu-item-group-title {
+.pandora-sdk-selector-dropdown .ant-select-item-option:hover {
+  color: #2c6dd2;
+}
+.pandora-sdk-selector-dropdown .ant-select-item-group {
   color: #d9d9d9;
 }
 .pandora-sdk-selector-dropdown.pandora-sdk-selector-no-ellipsis .ant-select-dropdown-menu {

package/es/components/Selector/style.less

@@ -56,17 +56,21 @@
     margin: 0;
     .scrollbar();
   }
-  .@{ant-prefix}-select-dropdown-menu-item-disabled {
+  .@{ant-prefix}-select-item-option-disabled {
     color: @font-disable-color!important;
   }
-  .@{ant-prefix}-select-dropdown-menu-item-selected {
+  .@{ant-prefix}-select-item-option-selected {
     color: @theme-color;
+    font-weight: 400;
     &::after {
       color: @theme-color!important;
     }
   }
+  .@{ant-prefix}-select-item-option:hover {
+    color: @theme-color;
+  }
 
-  .@{ant-prefix}-select-dropdown-menu-item-group-title {
+  .@{ant-prefix}-select-item-group {
     color: @font-disable-color;
   }
   &.@{sdk-prefix}-selector-no-ellipsis {

package/es/components/SolidRadioGroup/index.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
-export interface IOption<T = string> {
+declare type BasicType = string | number | boolean;
+export interface IOption<T = BasicType> {
     /**
      * 选项的值
      */
@@ -13,7 +14,7 @@ export interface IOption<T = string> {
      */
     disabled?: boolean;
 }
-export interface ISolidRadioGroupProps<T = string> {
+export interface ISolidRadioGroupProps<T = BasicType> {
     /**
      * 当前值
      */

package/es/components/SolidRadioGroup/index.js

@@ -1,11 +1,11 @@
 import * as React from 'react';
-import { isArray } from 'lodash';
+import { isArray, isUndefined } from 'lodash';
 import Radio from 'antd/es/radio';
 import classnames from 'classnames';
 import { SDK_PREFIX } from '../../constants/style';
 var useCallback = React.useCallback, useMemo = React.useMemo;
 export default function SolidRadioGroup(props) {
-    var className = props.className, buttonClassName = props.buttonClassName, value = props.value, size = props.size, onChange = props.onChange, children = props.children, _a = props.options, options = _a === void 0 ? {} : _a;
+    var className = props.className, buttonClassName = props.buttonClassName, value = props.value, size = props.size, onChange = props.onChange, children = props.children, disabled = props.disabled, _a = props.options, options = _a === void 0 ? {} : _a;
     var handleChange = useCallback(function (e) {
         if (onChange) {
             onChange(e.target.value);
@@ -19,8 +19,11 @@ export default function SolidRadioGroup(props) {
     return (React.createElement(Radio.Group, { className: classnames(SDK_PREFIX + "-solid-radio-group", className), value: value, onChange: handleChange, size: size },
         radioOptions.map(function (option) {
             var _a;
-            var value = option.value, item = option.item, disabled = option.disabled;
-            return (React.createElement(Radio.Button, { key: value, value: value, disabled: disabled, className: classnames((_a = {}, _a[SDK_PREFIX + "-solid-radio-item"] = !disabled, _a), buttonClassName) }, item));
+            var value = option.value, item = option.item;
+            var disableRealVal = isUndefined(option.disabled)
+                ? disabled
+                : option.disabled;
+            return (React.createElement(Radio.Button, { key: value.toString(), value: value, disabled: disableRealVal, className: classnames((_a = {}, _a[SDK_PREFIX + "-solid-radio-item"] = !disableRealVal, _a), buttonClassName) }, item));
         }),
         children));
 }

package/es/components/SolidRadioGroup/style.css

@@ -204,9 +204,9 @@ span.ant-radio + * {
   height: 100%;
 }
 .ant-radio-group-large .ant-radio-button-wrapper {
-  height: 32px;
+  height: 40px;
   font-size: 16px;
-  line-height: 30px;
+  line-height: 38px;
 }
 .ant-radio-group-small .ant-radio-button-wrapper {
   height: 26px;
@@ -386,19 +386,26 @@ span.ant-radio + * {
 }
 .pandora-sdk-solid-radio-group .pandora-sdk-solid-radio-item {
   padding: 0 12px;
-  border-color: #d9d9d9 !important;
+  border-color: #bfbfbf !important;
   color: #333;
   text-align: center;
 }
 .pandora-sdk-solid-radio-group .pandora-sdk-solid-radio-item:hover {
   background: #fafafa;
-  border-color: #d9d9d9;
+  border-color: #bfbfbf;
 }
 .pandora-sdk-solid-radio-group .ant-radio-button-wrapper-checked,
 .pandora-sdk-solid-radio-group .ant-radio-button-wrapper-checked:hover {
   border-color: #2c6dd2 !important;
   color: #2c6dd2 !important;
 }
-.pandora-sdk-solid-radio-group .ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)::before {
-  background-color: #2c6dd2;
+.pandora-sdk-solid-radio-group .ant-radio-button-wrapper-checked.ant-radio-button-wrapper-disabled {
+  border-color: #bfbfbf !important;
+  color: #333 !important;
+}
+.pandora-sdk-solid-radio-group .ant-radio-button-wrapper:not(:first-child)::before {
+  background-color: #bfbfbf;
+}
+.ant-radio-button-wrapper-checked:not(.ant-radio-button-wrapper-disabled)::before {
+  background-color: #2c6dd2 !important;
 }

package/es/components/SolidRadioGroup/style.less

@@ -18,9 +18,22 @@
     color: @theme-color !important;
   }
 
-  .@{ant-prefix}-radio-button-wrapper-checked {
-    &:not(.@{ant-prefix}-radio-button-wrapper-disabled)::before {
-      background-color: @theme-color;
+  .@{ant-prefix}-radio-button-wrapper-checked.@{ant-prefix}-radio-button-wrapper-disabled {
+    border-color: @input-border-color !important;
+    color: @heading-color!important;
+  }
+
+  .@{ant-prefix}-radio-button-wrapper {
+    &:not(:first-child) {
+      &::before {
+        background-color: @input-border-color;
+      }
     }
   }
 }
+
+.@{ant-prefix}-radio-button-wrapper-checked {
+  &:not(.@{ant-prefix}-radio-button-wrapper-disabled)::before {
+    background-color: @theme-color !important;
+  }
+}

package/es/components/Steps/index.js

@@ -44,7 +44,7 @@ import Step from './Step';
 import ControlButton from './ControlButton';
 import { Provider } from './context';
 var useMemo = React.useMemo, useState = React.useState, useCallback = React.useCallback;
-export default function Steps(props) {
+function Steps(props) {
     var _a = __read(useState(0), 2), stepLength = _a[0], setStepLength = _a[1];
     var current = props.current, _b = props.steps, steps = _b === void 0 ? [] : _b, className = props.className, children = props.children, otherProps = __rest(props, ["current", "steps", "className", "children"]);
     var handleAddSteps = useCallback(function () {
@@ -70,3 +70,4 @@ export default function Steps(props) {
 }
 Steps.Step = Step;
 Steps.ControlButton = ControlButton;
+export default Steps;

package/es/components/Table/index.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { TableProps } from 'antd/es/table';
+import { TableRowSelection } from 'antd/es/table/interface';
 /**
  * 表格提供自定义多选, 通过 rowSelection对象的selectedRowKeys和onChange来控制多选的状态
  * 需要注意的是, 当在外部进行增删改或者外部需要控制选择状态时, 例如删除之后清空全选状态, 需要受控
@@ -17,7 +18,7 @@ export interface IOptionItem {
     /**
      * 禁用当前操作
      */
-    disabled?: boolean;
+    disabled?: boolean | ((selectItems: any[]) => boolean);
 }
 export interface ITableProps<T> extends TableProps<T> {
     /**
@@ -32,7 +33,7 @@ export interface ITableProps<T> extends TableProps<T> {
 /**
  * pandora2.0风格的表格
  */
-export default class Table<T = any> extends React.Component<ITableProps<T>, any> {
+declare class Table<T = any> extends React.Component<ITableProps<T>, any> {
     static Column: typeof import("antd/lib/table/Column").default;
     static ColumnTag: (props: {
         tags: any[];
@@ -43,35 +44,19 @@ export default class Table<T = any> extends React.Component<ITableProps<T>, any>
     checkAll: boolean;
     UNSAFE_componentWillReceiveProps(nextProps: ITableProps<T>): void;
     get selectedRowKeys(): React.ReactText[];
-    get rowSelection(): {
-        selectedRowKeys: React.ReactText[];
-        onChange: (selectedRowKeys: string[] | number[], selectedRowsOfCurrentPage: any[]) => void;
-        preserveSelectedRowKeys?: boolean | undefined;
-        type?: "checkbox" | "radio" | undefined;
-        defaultSelectedRowKeys?: React.ReactText[] | undefined;
-        getCheckboxProps?: ((record: T) => Partial<Pick<import("antd/es/checkbox").CheckboxProps, "type" | "onClick" | "className" | "id" | "style" | "tabIndex" | "children" | "onChange" | "onKeyDown" | "onKeyPress" | "onMouseEnter" | "onMouseLeave" | "autoFocus" | "disabled" | "name" | "value" | "prefixCls" | "indeterminate" | "skipGroup">>) | undefined;
-        onSelect?: import("antd/es/table/interface").SelectionSelectFn<T> | undefined;
-        onSelectMultiple?: ((selected: boolean, selectedRows: T[], changeRows: T[]) => void) | undefined;
-        onSelectAll?: ((selected: boolean, selectedRows: T[], changeRows: T[]) => void) | undefined;
-        onSelectInvert?: ((selectedRowKeys: React.ReactText[]) => void) | undefined;
-        onSelectNone?: (() => void) | undefined;
-        selections?: boolean | import("antd/es/table/hooks/useSelection").INTERNAL_SELECTION_ITEM[] | undefined;
-        hideSelectAll?: boolean | undefined;
-        fixed?: boolean | undefined;
-        columnWidth?: string | number | undefined;
-        columnTitle?: React.ReactNode;
-        checkStrictly?: boolean | undefined;
-        renderCell?: ((value: boolean, record: T, index: number, originNode: React.ReactNode) => string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | import("rc-table/lib/interface").RenderedCell<T> | null | undefined) | undefined;
-    } | undefined;
+    get rowSelection(): TableRowSelection<T> | undefined;
+    get undisabledData(): readonly T[];
     get keysOfCurrentPage(): any[];
     getRowKey(row: any, index: number): any;
     setIndeterminate(indeterminate: boolean): void;
     setCheckAll(checkAll: boolean): void;
     setCheckboxStatus(selectedRowsOfCurrentPage?: T[], dataSource?: T[]): void;
-    handleSelectionChange(selectedRowKeys: string[] | number[], selectedRowsOfCurrentPage: any[]): void;
-    onRowSelectionChange(selectedRowKeys: string[] | number[], selectedRowsOfCurrentPage: any[]): void;
+    handleSelectionChange(selectedRowKeys: React.Key[], selectedRowsOfCurrentPage: any[]): void;
+    onRowSelectionChange(selectedRowKeys: React.Key[], selectedRowsOfCurrentPage: any[]): void;
     handleCheckAllChange(e: any): void;
     handleBatchOptionClick(option: IOptionItem): void;
     getRowClassName(record: any, index: number, indent: number): string;
+    getDisabledStatus(option: IOptionItem): boolean | undefined;
     render(): JSX.Element;
 }
+export default Table;