@qn-pandora/pandora-component 3.0.1 → 3.1.1

package/CHANGELOG.json

@@ -2,21 +2,21 @@
   "name": "@qn-pandora/pandora-component",
   "entries": [
     {
-      "version": "3.0.1",
-      "tag": "@qn-pandora/pandora-component_v3.0.1",
-      "date": "Fri, 28 Jan 2022 15:30:56 GMT",
+      "version": "3.1.0",
+      "tag": "@qn-pandora/pandora-component_v3.1.0",
+      "date": "Tue, 15 Mar 2022 12:05:29 GMT",
       "comments": {
-        "patch": [
+        "minor": [
           {
-            "comment": "1.28publish"
+            "comment": "统一发布中版本"
           }
         ],
         "dependency": [
           {
-            "comment": "Updating dependency \"@qn-pandora/pandora-component-icons\" from `^2.0.0` to `^2.0.1`"
+            "comment": "Updating dependency \"@qn-pandora/pandora-component-icons\" from `^2.0.0` to `^2.1.0`"
           },
           {
-            "comment": "Updating dependency \"@qn-pandora/pandora-tools\" from `^1.0.0` to `^1.0.1`"
+            "comment": "Updating dependency \"@qn-pandora/pandora-tools\" from `^1.0.0` to `^1.1.0`"
           }
         ]
       }

package/CHANGELOG.md

@@ -1,19 +1,18 @@
 # Change Log - @qn-pandora/pandora-component
 
-This log was last generated on Fri, 28 Jan 2022 15:30:56 GMT and should not be manually modified.
+This log was last generated on Tue, 15 Mar 2022 12:05:29 GMT and should not be manually modified.
 
-## 3.0.1
+## 3.1.0
+Tue, 15 Mar 2022 12:05:29 GMT
 
-Fri, 28 Jan 2022 15:30:56 GMT
+### Minor changes
 
-### Patches
-
-- 1.28publish
+- 统一发布中版本
 
 ## 3.0.0
-
 Mon, 20 Dec 2021 11:46:43 GMT
 
 ### Breaking changes
 
-- 仓库迁移至 rush 后统一发个大版本
+- 仓库迁移至rush后统一发个大版本
+

package/es/components/AutoComplete/style.css

@@ -479,7 +479,7 @@
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
   position: absolute;
-  top: 53%;
+  top: 50%;
   right: 11px;
   width: 12px;
   height: 12px;
@@ -660,6 +660,9 @@
   color: rgba(0, 0, 0, 0.25);
   cursor: not-allowed;
 }
+.ant-select-item-option-disabled.ant-select-item-option-selected {
+  background-color: #f5f5f5;
+}
 .ant-select-item-option-grouped {
   padding-left: 24px;
 }

package/es/components/Button/index.js

@@ -42,7 +42,7 @@ export default function Button(props) {
         return classnames(className, SDK_PREFIX + "-button", SDK_PREFIX + "-size-" + size, (_a = {},
             _a[SDK_PREFIX + "-button-disabled"] = disabled,
             _a));
-    }, [size, disabled]);
+    }, [size, disabled, className]);
     var btn = (React.createElement(BaseButton, __assign({}, otherProps, { icon: typeof icon === 'string' ? React.createElement(Icon, { type: icon }) : icon, className: rootCls, onClick: handleClick })));
     if (title) {
         return (React.createElement(Tooltip, { title: title, getPopupContainer: getPopupContainer }, btn));

package/es/components/Card/style.css

@@ -384,8 +384,15 @@
 .ant-tabs-rtl.ant-tabs-card.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
 .ant-tabs-rtl.ant-tabs-card.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab,
 .ant-tabs-rtl.ant-tabs-card.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-tab + .ant-tabs-tab {
-  margin-right: 0;
-  margin-left: 2px;
+  margin-right: 2px;
+  margin-left: 0;
+}
+.ant-tabs-rtl.ant-tabs-card.ant-tabs-top > .ant-tabs-nav .ant-tabs-nav-add,
+.ant-tabs-rtl.ant-tabs-card.ant-tabs-bottom > .ant-tabs-nav .ant-tabs-nav-add,
+.ant-tabs-rtl.ant-tabs-card.ant-tabs-top > div > .ant-tabs-nav .ant-tabs-nav-add,
+.ant-tabs-rtl.ant-tabs-card.ant-tabs-bottom > div > .ant-tabs-nav .ant-tabs-nav-add {
+  margin-right: 2px;
+  margin-left: 0;
 }
 .ant-tabs-dropdown-rtl {
   direction: rtl;
@@ -862,6 +869,7 @@
 .ant-tabs > .ant-tabs-nav .ant-tabs-nav-add,
 .ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-add {
   min-width: 40px;
+  margin-left: 2px;
   padding: 0 8px;
   background: #fafafa;
   border: 1px solid #e5e5e5;

package/es/components/CheckTransformList/Item/index.js

@@ -1,10 +1,14 @@
 import * as React from 'react';
 import { Checkbox, Input } from 'antd';
+import { ConfigContext } from 'antd/es/config-provider';
+import { formatString } from '../../../utils/language';
+import { CheckTransformListLocale } from '../../../constants/language/check_transform_list/type';
 import { SDK_PREFIX } from '../../../constants/style';
 import NameLimiter from '../../../components/NameLimiter';
 var Search = Input.Search;
 export default function Item(props) {
     var label = props.label, type = props.type, isCheckedAll = props.isCheckedAll, indeterminate = props.indeterminate, onCheckAllChange = props.onCheckAllChange, options = props.options, onCheckboxChange = props.onCheckboxChange, prefix = props.prefix, setPrefix = props.setPrefix;
+    var locale = React.useContext(ConfigContext).locale;
     var handOnchange = React.useCallback(function (e) {
         var value = e.target.value;
         setPrefix(value);
@@ -12,11 +16,11 @@ export default function Item(props) {
     return (React.createElement("div", { className: SDK_PREFIX + "-check-transform" },
         label && (React.createElement("div", { className: SDK_PREFIX + "-check-transform-header" }, label)),
         React.createElement("div", { className: SDK_PREFIX + "-check-transform-search" },
-            React.createElement(Search, { placeholder: "\u641C\u7D22", value: prefix, onChange: handOnchange })),
+            React.createElement(Search, { placeholder: formatString(CheckTransformListLocale.placeholder, locale), value: prefix, onChange: handOnchange })),
         React.createElement("div", { className: SDK_PREFIX + "-check-transform-checkBox" },
             type === 'left' && (React.createElement(React.Fragment, null,
-                React.createElement(Checkbox, { onChange: onCheckAllChange, checked: isCheckedAll, indeterminate: indeterminate }, "\u5168\u9009"))),
-            type === 'right' && (React.createElement("div", { className: SDK_PREFIX + "--check-transform-header" }, "\u5DF2\u9009")),
+                React.createElement(Checkbox, { onChange: onCheckAllChange, checked: isCheckedAll, indeterminate: indeterminate }, formatString(CheckTransformListLocale.select_all, locale)))),
+            type === 'right' && (React.createElement("div", { className: SDK_PREFIX + "--check-transform-header" }, formatString(CheckTransformListLocale.selected))),
             React.createElement("div", { className: SDK_PREFIX + "-check-transform-checkbox-group" }, options.map(function (item) {
                 return (React.createElement("div", { key: item.value },
                     React.createElement(Checkbox, { value: item.value, checked: item.checked, onChange: onCheckboxChange },

package/es/components/CheckTransformList/index.js

@@ -78,7 +78,7 @@ export default function CheckTransformList(props) {
                 return !includes(filterLeftOptions.map(function (option) { return option.value; }), item);
             }));
         }
-    }, [filterLeftOptions, setCheckList]);
+    }, [filterLeftOptions, setCheckList, checkedList]);
     var handOnchange = useCallback(function (e) {
         var value = e.target.value;
         if (e.target.checked) {

package/es/components/CheckTransformList/style.css

@@ -496,8 +496,8 @@ textarea.ant-input-affix-wrapper {
   outline: none;
 }
 .ant-input-affix-wrapper > input.ant-input:focus {
-  -webkit-box-shadow: none;
-          box-shadow: none;
+  -webkit-box-shadow: none !important;
+          box-shadow: none !important;
 }
 .ant-input-affix-wrapper::before {
   width: 0;
@@ -522,7 +522,7 @@ textarea.ant-input-affix-wrapper {
 .ant-input-suffix {
   margin-left: 4px;
 }
-.ant-input-clear-icon {
+.anticon.ant-input-clear-icon {
   margin: 0 4px;
   color: rgba(0, 0, 0, 0.25);
   font-size: 12px;
@@ -531,16 +531,16 @@ textarea.ant-input-affix-wrapper {
   -webkit-transition: color 0.3s;
   transition: color 0.3s;
 }
-.ant-input-clear-icon:hover {
+.anticon.ant-input-clear-icon:hover {
   color: rgba(0, 0, 0, 0.45);
 }
-.ant-input-clear-icon:active {
+.anticon.ant-input-clear-icon:active {
   color: rgba(0, 0, 0, 0.65);
 }
-.ant-input-clear-icon-hidden {
+.anticon.ant-input-clear-icon-hidden {
   visibility: hidden;
 }
-.ant-input-clear-icon:last-child {
+.anticon.ant-input-clear-icon:last-child {
   margin-right: 0;
 }
 .ant-input-affix-wrapper-textarea-with-clear-btn {
@@ -755,6 +755,16 @@ textarea.ant-input {
 .ant-input-group-addon .ant-select-focused .ant-select-selector {
   color: #7a869a;
 }
+.ant-input-group-addon .ant-cascader-picker {
+  margin: -9px -12px;
+  background-color: transparent;
+}
+.ant-input-group-addon .ant-cascader-picker .ant-cascader-input {
+  text-align: left;
+  border: 0;
+  -webkit-box-shadow: none;
+          box-shadow: none;
+}
 .ant-input-group > .ant-input:first-child,
 .ant-input-group-addon:first-child {
   border-top-right-radius: 0;

package/es/components/Collapse/Panel/index.d.ts

@@ -1,41 +1,9 @@
-import * as React from 'react';
-interface IPanelProps {
-    /**
-     * 当前panel的key
-     */
-    panelKey?: string;
-    /**
-     * tab的标题
-     */
-    title: string;
-    /**
-     * 当前panel是都激活
-     * @default true
-     */
-    isActive?: boolean;
-    /**
-     * title的样式
-     */
-    titleClassName?: string;
-    /**
-     * content的样式
-     */
-    contentClassName?: string;
-    /**
-     * 容器样式
-     */
-    className?: string;
-    /**
-     * panel折叠状态发生变化
-     */
-    onToggle?: (isActive: boolean, key?: string) => void;
-    /**
-     * 是否禁止toggle
-     */
-    disableToggle?: boolean;
+/// <reference types="react" />
+import { CollapsePanelProps } from 'antd/es/collapse';
+import { ECollapseType } from '../index';
+export interface ICollapsePanelProps extends CollapsePanelProps {
+    children?: any;
+    type?: ECollapseType;
 }
-/**
- * 折叠面板组件封装
- */
-export default function Panel(props: React.PropsWithChildren<IPanelProps>): JSX.Element;
-export {};
+export declare function CollapsePanel(props: ICollapsePanelProps): JSX.Element;
+export default CollapsePanel;

package/es/components/Collapse/Panel/index.js

@@ -1,50 +1,40 @@
-var __read = (this && this.__read) || function (o, n) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator];
-    if (!m) return o;
-    var i = m.call(o), r, ar = [], e;
-    try {
-        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
-    }
-    catch (error) { e = { error: error }; }
-    finally {
-        try {
-            if (r && !r.done && (m = i["return"])) m.call(i);
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
         }
-        finally { if (e) throw e.error; }
-    }
-    return ar;
+        return t;
+    };
+    return __assign.apply(this, arguments);
 };
-import * as React from 'react';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React, { useMemo } from 'react';
+import { Collapse as BaseCollapse } from 'antd';
 import classnames from 'classnames';
-import { Icon as LegacyIcon } from '@ant-design/compatible';
 import { SDK_PREFIX } from '../../../constants/style';
-var useEffect = React.useEffect, useCallback = React.useCallback, useState = React.useState;
-/**
- * 折叠面板组件封装
- */
-export default function Panel(props) {
-    var _a, _b;
-    var _c = props.isActive, baseIsActive = _c === void 0 ? true : _c, disableToggle = props.disableToggle, onToggle = props.onToggle, panelKey = props.panelKey, title = props.title, titleClassName = props.titleClassName, className = props.className, contentClassName = props.contentClassName;
-    var _d = __read(useState(baseIsActive || false), 2), isActive = _d[0], setIsActive = _d[1];
-    useEffect(function () {
-        if (baseIsActive !== isActive) {
-            setIsActive(baseIsActive || false);
-        }
-    }, [baseIsActive]);
-    var onTogglePanel = useCallback(function () {
-        if (disableToggle) {
-            return;
-        }
-        setIsActive(!isActive);
-        if (onToggle) {
-            onToggle(!isActive, panelKey);
+import { ECollapseType } from '../index';
+export function CollapsePanel(props) {
+    var type = props.type, header = props.header, key = props.key, children = props.children, className = props.className, others = __rest(props, ["type", "header", "key", "children", "className"]);
+    var newHeader = useMemo(function () {
+        if (type === ECollapseType.Primary) {
+            return (React.createElement("span", null,
+                React.createElement("div", { className: SDK_PREFIX + "-header-line" }),
+                React.createElement("span", null, header)));
         }
-    }, [disableToggle, panelKey, isActive]);
-    return (React.createElement("div", { className: classnames(SDK_PREFIX + "-panel", className), key: panelKey },
-        React.createElement("div", { className: classnames(titleClassName, (_a = {}, _a[SDK_PREFIX + "-panel-disable"] = disableToggle, _a), SDK_PREFIX + "-panel-title"), onClick: onTogglePanel },
-            React.createElement("span", null, title),
-            disableToggle ? null : (React.createElement(LegacyIcon, { type: isActive ? 'down' : 'up', className: SDK_PREFIX + "-panel-icon" }))),
-        React.createElement("div", { className: classnames(SDK_PREFIX + "-panel-content", contentClassName, (_b = {},
-                _b[SDK_PREFIX + "-panel-hidden"] = !isActive,
-                _b)) }, props.children)));
+        return header;
+    }, [header, type]);
+    return (React.createElement(BaseCollapse.Panel, __assign({ className: classnames(className), header: newHeader, key: key }, others), children));
 }
+export default CollapsePanel;

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

@@ -1,24 +1,19 @@
-import * as React from 'react';
-interface ICollapseProps {
-    /**
-     * 根节点 class name
-     */
+/// <reference types="react" />
+import { CollapseProps } from 'antd/es/collapse';
+export declare enum ECollapseType {
+    Normal = "normal",
+    Simple = "simple",
+    Primary = "primary",
+    Dashed = "dashed"
+}
+export interface ICollapse extends CollapseProps {
     className?: string;
-    /**
-     * 默认展开的panel的keys
-     */
-    defaultActiveKey?: string[] | 'all' | 'none';
-    /**
-     * 手风琴模式，最多智能打开一个折叠板
-     * @default false
-     */
-    accordion?: boolean;
+    children?: any;
+    type?: ECollapseType;
+    onDelete?: (index: number) => void;
 }
-/**
- * 折叠面板组件封装
- */
-declare function Collapse(props: React.PropsWithChildren<ICollapseProps>): JSX.Element;
-declare namespace Collapse {
-    var Panel: typeof import("./Panel").default;
+export declare function Collapse(props: ICollapse): JSX.Element;
+export declare namespace Collapse {
+    var Panel: typeof import("./Panel").CollapsePanel;
 }
 export default Collapse;

package/es/components/Collapse/index.js

@@ -9,34 +9,60 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-import * as React from 'react';
-import { get } from 'lodash';
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React, { useMemo, useCallback } from 'react';
+import { Collapse as BaseCollapse } from 'antd';
+import { DeleteOutlined } from '@ant-design/icons';
+import classnames from 'classnames';
+import { SDK_PREFIX } from '../../constants/style';
 import Panel from './Panel';
-/**
- * 折叠面板组件封装
- */
-function Collapse(props) {
-    var children = props.children, defaultActiveKey = props.defaultActiveKey, className = props.className;
+export var ECollapseType;
+(function (ECollapseType) {
+    ECollapseType["Normal"] = "normal";
+    ECollapseType["Simple"] = "simple";
+    ECollapseType["Primary"] = "primary";
+    ECollapseType["Dashed"] = "dashed";
+})(ECollapseType || (ECollapseType = {}));
+export function Collapse(props) {
+    var children = props.children, className = props.className, _a = props.type, type = _a === void 0 ? ECollapseType.Simple : _a, _b = props.expandIconPosition, expandIconPosition = _b === void 0 ? 'left' : _b, onDelete = props.onDelete, others = __rest(props, ["children", "className", "type", "expandIconPosition", "onDelete"]);
+    var position = useMemo(function () {
+        return type === ECollapseType.Primary ? 'right' : expandIconPosition;
+    }, [expandIconPosition, type]);
+    var showArrow = useMemo(function () {
+        return type !== ECollapseType.Dashed;
+    }, [type]);
+    var getExtra = useCallback(function (index) {
+        if (type === ECollapseType.Dashed) {
+            return (React.createElement(DeleteOutlined, { onClick: function () {
+                    if (onDelete) {
+                        onDelete(index);
+                    }
+                } }));
+        }
+        return undefined;
+    }, [type, onDelete]);
     var getPanels = React.useCallback(function () {
         var newChildren = [];
         React.Children.forEach(children, function (child, index) {
             if (!child) {
                 return;
             }
-            var key = get(child, 'key') || "" + index;
-            var isActive = false;
-            if (defaultActiveKey && typeof defaultActiveKey === 'string') {
-                isActive = defaultActiveKey === 'none' ? false : true;
-            }
-            else {
-                isActive = (defaultActiveKey || []).indexOf(key) > -1;
-            }
-            var props = __assign(__assign({}, child.props), { panelKey: key, isActive: isActive });
+            var props = __assign(__assign({}, child.props), { showArrow: showArrow, extra: getExtra(index), type: type });
             newChildren.push(React.cloneElement(child, props));
         });
         return newChildren;
-    }, [children, defaultActiveKey]);
-    return React.createElement("div", { className: className }, getPanels());
+    }, [children, showArrow, type, getExtra]);
+    return (React.createElement(BaseCollapse, __assign({ className: classnames(SDK_PREFIX + "-collapse", [SDK_PREFIX + "-collapse-" + type], className), expandIconPosition: position }, others), getPanels()));
 }
 Collapse.Panel = Panel;
 export default Collapse;