@pointcloud/pcloud-components 0.1.21 → 0.1.24

package/README.md

@@ -1,6 +1,6 @@
 # pcloud-components
 
-![node version](<https://img.shields.io/badge/node-v16.20.0-brightgreen?logo=nodedotjs&color=rgb(0%2C126%2C298)>) ![react version](https://img.shields.io/badge/react-v17.0.2-brightgreen?style=flat&logo=react) ![antd version](<https://img.shields.io/badge/ant%20design-v4.24.16-rgb(144%2C190%2C8)?style=flat&logo=antdesign>) ![docs](https://img.shields.io/badge/docs%20by-dumi-brightgreen?style=flat&color=%230081ff) ![counts](<https://img.shields.io/badge/components%20count-22-rgb(202%2C17%2C5)?style=flat&logo=webcomponentsdotorg>) ![license](<https://img.shields.io/badge/license-MIT-rgb(144%2C190%2C8)?style=flat>)
+![node version](<https://img.shields.io/badge/node-v16.20.0-brightgreen?logo=nodedotjs&color=rgb(0%2C126%2C298)>) ![react version](https://img.shields.io/badge/react-v17.0.2-brightgreen?style=flat&logo=react) ![antd version](<https://img.shields.io/badge/ant%20design-v4.24.16-rgb(144%2C190%2C8)?style=flat&logo=antdesign>) ![docs](https://img.shields.io/badge/docs%20by-dumi-brightgreen?style=flat&color=%230081ff) ![counts](<https://img.shields.io/badge/components%20count-25-rgb(202%2C17%2C5)?style=flat&logo=webcomponentsdotorg>) ![license](<https://img.shields.io/badge/license-MIT-rgb(144%2C190%2C8)?style=flat>)
 
 pcloud-components 是一套基于 Antd v4.24.16+ React v17 开发的业务组件库。
 该项目已经发布到 Npm 仓库，可以直接使用, 点击[pcloud-components 地址](https://www.npmjs.com/package/@pointcloud/pcloud-components)访问。

package/dist/esm/AdvancedFilter/FormFilter.js

@@ -70,15 +70,15 @@ export default (function (props) {
         values = _objectSpread(_objectSpread({}, values), formatTime(_defineProperty({}, item, values[item])));
       }
     });
-    onSearch && onSearch(values);
+    onSearch === null || onSearch === void 0 || onSearch(values);
   };
   var valuesChange = function valuesChange(v) {
     var value = formatTime(v);
-    onValuesChange && onValuesChange(value);
+    onValuesChange === null || onValuesChange === void 0 || onValuesChange(value);
   };
   var reset = function reset() {
     form.resetFields();
-    onReset && onReset();
+    onReset === null || onReset === void 0 || onReset();
   };
   var renderComponent = function renderComponent(type, item) {
     switch (type) {

package/dist/esm/AdvancedFilter/interface.d.ts

@@ -34,11 +34,11 @@ export interface FormProps {
     /**
      * @description 筛选项值变更时触发
      */
-    onValuesChange?: (v: any) => void;
+    onValuesChange?: (_values: any) => void;
     /**
      * @description 点击查询按钮时触发
      */
-    onSearch?: (v: any) => void;
+    onSearch?: (_v: any) => void;
     /**
      * @description 点击重置按钮时触发
      */
@@ -67,7 +67,7 @@ export interface InputProps {
     /**
      * @description input检索框回车时或点击检索图标时触发
      */
-    inputSearch?: (v: any) => void;
+    inputSearch?: (_v: any) => void;
 }
 export interface FilterProps extends FormProps {
     /**

package/dist/esm/AdvancedFilter/styles/index.less

@@ -1,146 +1,146 @@
-@import '../../commonStyle/index.less';
-
-.@{prefix}-search-filter {
-  align-items: center;
-  width: 100%;
-  margin-top: 10px;
-  background-color: #fff;
-
-  span.ant-collapse-header-text {
-    display: inline-block;
-    width: 100%;
-    cursor: auto !important;
-  }
-
-  .ant-collapse-content-box {
-    padding: 0;
-  }
-
-  .search-header {
-    display: flex;
-    width: 100%;
-
-    .left {
-      max-width: 100%;
-      overflow: hidden;
-      white-space: no-wrap;
-      text-overflow: ellipsis;
-
-      :global {
-        .ant-radio-wrapper:first-child {
-          border-left: 1px solid #d9d9d9;
-          border-radius: 5px 0 0 5px;
-        }
-
-        .ant-radio-wrapper:last-child {
-          border-radius: 0 5px 5px 0;
-        }
-
-        .ant-radio-wrapper {
-          margin-right: 0;
-          padding: 4px 6px;
-          border: 1px solid #d9d9d9;
-          border-top-width: 1px;
-          border-left: 1px solid #fff;
-          border-left-width: 1px;
-
-          .ant-radio {
-            display: none;
-          }
-        }
-
-        .ant-radio-wrapper:hover {
-          color: #1890ff;
-        }
-
-        .ant-radio-wrapper-checked {
-          z-index: 1;
-          color: #1890ff;
-          background: #fff;
-          border: 1px solid #1890ff;
-          border-left: 1px solid #1890ff !important;
-        }
-      }
-    }
-
-    .right {
-      display: flex;
-      justify-content: center;
-
-      .input {
-        width: 200px;
-        border-radius: 4px;
-      }
-
-      .button {
-        margin-left: 10px;
-        color: #fff;
-        background-color: #ff7e00;
-        border-radius: 4px;
-
-        &:active,
-        &:focus,
-        &:hover {
-          border-color: transparent;
-        }
-
-        .icon {
-          margin-left: 8px;
-          transition: transform 0.4s;
-
-          &.down {
-            transform: rotateZ(180deg);
-          }
-
-          &.up {
-            transform: rotateZ(0deg);
-          }
-        }
-      }
-    }
-  }
-
-  .title {
-    display: flex;
-    align-items: center;
-    margin: 0 10px;
-    padding-bottom: 10px;
-    font-weight: bold;
-    border-bottom: 1px solid #f0f0f0;
-
-    span.icon {
-      width: 4px;
-      height: 16px;
-      margin-right: 6px;
-      background-color: #ff7e00;
-      border-radius: 2px;
-    }
-  }
-
-  .search-content {
-    .filter-row {
-      display: flex;
-      flex-wrap: wrap;
-      width: 100%;
-      padding: 10px;
-    }
-
-    .filter-col {
-      height: 30px;
-      margin-bottom: 10px;
-      line-height: 30px;
-    }
-
-    .filter-col .ant-picker {
-      width: 100%;
-    }
-
-    .search-btn {
-      justify-content: center;
-
-      > button {
-        margin: 0 5px;
-      }
-    }
-  }
-}
+@import '../../commonStyle/index.less';
+
+.@{prefix}-search-filter {
+  align-items: center;
+  width: 100%;
+  margin-top: 10px;
+  background-color: #fff;
+
+  span.ant-collapse-header-text {
+    display: inline-block;
+    width: 100%;
+    cursor: auto !important;
+  }
+
+  .ant-collapse-content-box {
+    padding: 0;
+  }
+
+  .search-header {
+    display: flex;
+    width: 100%;
+
+    .left {
+      max-width: 100%;
+      overflow: hidden;
+      white-space: no-wrap;
+      text-overflow: ellipsis;
+
+      :global {
+        .ant-radio-wrapper:first-child {
+          border-left: 1px solid #d9d9d9;
+          border-radius: 5px 0 0 5px;
+        }
+
+        .ant-radio-wrapper:last-child {
+          border-radius: 0 5px 5px 0;
+        }
+
+        .ant-radio-wrapper {
+          margin-right: 0;
+          padding: 4px 6px;
+          border: 1px solid #d9d9d9;
+          border-top-width: 1px;
+          border-left: 1px solid #fff;
+          border-left-width: 1px;
+
+          .ant-radio {
+            display: none;
+          }
+        }
+
+        .ant-radio-wrapper:hover {
+          color: #1890ff;
+        }
+
+        .ant-radio-wrapper-checked {
+          z-index: 1;
+          color: #1890ff;
+          background: #fff;
+          border: 1px solid #1890ff;
+          border-left: 1px solid #1890ff !important;
+        }
+      }
+    }
+
+    .right {
+      display: flex;
+      justify-content: center;
+
+      .input {
+        width: 200px;
+        border-radius: 4px;
+      }
+
+      .button {
+        margin-left: 10px;
+        color: #fff;
+        background-color: #ff7e00;
+        border-radius: 4px;
+
+        &:active,
+        &:focus,
+        &:hover {
+          border-color: transparent;
+        }
+
+        .icon {
+          margin-left: 8px;
+          transition: transform 0.4s;
+
+          &.down {
+            transform: rotateZ(180deg);
+          }
+
+          &.up {
+            transform: rotateZ(0deg);
+          }
+        }
+      }
+    }
+  }
+
+  .title {
+    display: flex;
+    align-items: center;
+    margin: 0 10px;
+    padding-bottom: 10px;
+    font-weight: bold;
+    border-bottom: 1px solid #f0f0f0;
+
+    span.icon {
+      width: 4px;
+      height: 16px;
+      margin-right: 6px;
+      background-color: #ff7e00;
+      border-radius: 2px;
+    }
+  }
+
+  .search-content {
+    .filter-row {
+      display: flex;
+      flex-wrap: wrap;
+      width: 100%;
+      padding: 10px;
+    }
+
+    .filter-col {
+      height: 30px;
+      margin-bottom: 10px;
+      line-height: 30px;
+    }
+
+    .filter-col .ant-picker {
+      width: 100%;
+    }
+
+    .search-btn {
+      justify-content: center;
+
+      > button {
+        margin: 0 5px;
+      }
+    }
+  }
+}

package/dist/esm/AspectRatio/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+export interface AspectRatioProps {
+    ratio?: number;
+    className?: string;
+    children: React.ReactNode;
+    style?: React.CSSProperties;
+}
+declare function AspectRatio({ ratio, className, children, style }: AspectRatioProps): import("react/jsx-runtime").JSX.Element;
+export default AspectRatio;

package/dist/esm/AspectRatio/index.js

@@ -0,0 +1,46 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import React, { useRef, useEffect } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+function AspectRatio(_ref) {
+  var _ref$ratio = _ref.ratio,
+    ratio = _ref$ratio === void 0 ? 16 / 9 : _ref$ratio,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    children = _ref.children,
+    style = _ref.style;
+  var ref = useRef(null);
+  useEffect(function () {
+    // 兼容旧浏览器：如果不支持 aspect-ratio，则用 padding-top
+    var el = ref.current;
+    if (!el) return;
+    var test = document.createElement('div');
+    if (!('aspectRatio' in test.style)) {
+      // 不支持 aspect-ratio
+      el.style.position = 'relative';
+      el.style.width = '100%';
+      el.style.height = '';
+      el.style.paddingTop = "".concat(100 / ratio, "%");
+      // 包裹 children 的 div 绝对定位
+      if (el.firstElementChild) {
+        el.firstElementChild.style.position = 'absolute';
+        el.firstElementChild.style.inset = '0';
+        el.firstElementChild.style.width = '100%';
+        el.firstElementChild.style.height = '100%';
+      }
+    }
+  }, [ratio]);
+  return /*#__PURE__*/_jsx("div", {
+    ref: ref,
+    className: className,
+    style: _objectSpread({
+      aspectRatio: "".concat(ratio),
+      width: '100%',
+      height: '100%',
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center'
+    }, style),
+    children: children
+  });
+}
+export default AspectRatio;

package/dist/esm/ColorPicker/index.js

@@ -48,7 +48,7 @@ var ColorPicker = function ColorPicker(props) {
     // eslint-disable-next-line no-unused-expressions, @typescript-eslint/no-unused-expressions
     onChange && onChange(e);
   };
-  var handleChangeComplete = function handleChangeComplete(v) {
+  var handleChangeComplete = function handleChangeComplete() {
     var _color = color !== null && color !== void 0 && color.a ? "rgba(".concat(color === null || color === void 0 ? void 0 : color.r, ",").concat(color === null || color === void 0 ? void 0 : color.g, ",").concat(color === null || color === void 0 ? void 0 : color.b, ",").concat(color === null || color === void 0 ? void 0 : color.a, ")") : initColor;
     // eslint-disable-next-line no-unused-expressions, @typescript-eslint/no-unused-expressions
     onChangeComplete && onChangeComplete(_color);

package/dist/esm/ColorPicker/index.less

@@ -1,18 +1,18 @@
-@import '../commonStyle/index.less';
-
-.@{prefix}-color-picker {
-  .sketch-picker {
-    padding: 0 !important;
-    box-shadow: none !important;
-  }
-}
-
-.trigger {
-  display: inline-block;
-  width: 60px;
-  height: 26px;
-  border: 5px solid #fff;
-  border-radius: 2px;
-  box-shadow: 0 0 2px #000;
-  cursor: pointer;
-}
+@import '../commonStyle/index.less';
+
+.@{prefix}-color-picker {
+  .sketch-picker {
+    padding: 0 !important;
+    box-shadow: none !important;
+  }
+}
+
+.trigger {
+  display: inline-block;
+  width: 60px;
+  height: 26px;
+  border: 5px solid #fff;
+  border-radius: 2px;
+  box-shadow: 0 0 2px #000;
+  cursor: pointer;
+}

package/dist/esm/ColorPicker/interface.d.ts

@@ -20,12 +20,12 @@ interface ComponentProps {
      * 颜色值变化时触发
      * @param v 色值对象
      */
-    onChange?: (v: any) => void;
+    onChange?: (_v?: string) => void;
     /**
      * 颜色变化完成时触发
      * @param v 颜色值 rgba
      */
-    onChangeComplete?: (v: any) => void;
+    onChangeComplete?: (_v?: string) => void;
 }
 export interface ColorPickerProps extends ComponentProps {
     /**
@@ -43,7 +43,7 @@ export interface ColorPickerProps extends ComponentProps {
     /**
      * 点击确定时的回调函数
      */
-    onConfirm: (v: any) => void;
+    onConfirm: (_v: string) => void;
 }
 export interface TwitterPickerProps extends ComponentProps {
     /**

package/dist/esm/ConfigProvider/interface.d.ts

@@ -5,7 +5,7 @@ export interface ConfigProviderProps {
      * @default pui
      */
     prefixCls?: string;
-    getPrefixCls?: (componentName: string, customPrefix?: string) => string;
+    getPrefixCls?: (_componentName: string, _customPrefix?: string) => string;
     children?: React.ReactNode;
 }
 export declare type OtherProps = Omit<ConfigProviderProps, 'children'>;

package/dist/esm/DCascader/index.js

@@ -3,12 +3,12 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["className", "popupClassName", "fieldNames", "options", "onChange", "loadData", "onLoadData", "loading"];
-/*
- * @Author       : wangfeihu
- * @Date         : 2023-05-18 13:35:38
- * @LastEditors  : wangfeihu
- * @LastEditTime : 2023-07-12 09:44:01
- * @Description  : 基于antd的Cascader组件
+/*
+ * @Author       : wangfeihu
+ * @Date         : 2023-05-18 13:35:38
+ * @LastEditors  : wangfeihu
+ * @LastEditTime : 2023-07-12 09:44:01
+ * @Description  : 基于antd的Cascader组件
  */
 import React, { useRef, forwardRef, useState, useEffect, useMemo, useContext } from 'react';
 import { Cascader } from 'antd';

package/dist/esm/DCascader/index.less

@@ -1,24 +1,24 @@
-@import '../commonStyle/index.less';
-
-.@{prefix}-cascader-dropdown .ant-cascader-menu {
-  &::-webkit-scrollbar {
-    width: 8px;
-    height: 8px;
-  }
-
-  // 轨道拖动部分的背景颜色
-  &::-webkit-scrollbar-thumb {
-    background-color: rgba(0, 0, 0, 50%);
-    border-radius: 8px;
-  }
-
-  // 轨道背景颜色
-  &::-webkit-scrollbar-track {
-    border-radius: 2px;
-  }
-
-  // x、y两条轨道的交叉处
-  &::-webkit-scrollbar-corner {
-    background-color: #f1f1f1;
-  }
-}
+@import '../commonStyle/index.less';
+
+.@{prefix}-cascader-dropdown .ant-cascader-menu {
+  &::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
+
+  // 轨道拖动部分的背景颜色
+  &::-webkit-scrollbar-thumb {
+    background-color: rgba(0, 0, 0, 50%);
+    border-radius: 8px;
+  }
+
+  // 轨道背景颜色
+  &::-webkit-scrollbar-track {
+    border-radius: 2px;
+  }
+
+  // x、y两条轨道的交叉处
+  &::-webkit-scrollbar-corner {
+    background-color: #f1f1f1;
+  }
+}

package/dist/esm/DForm/DItem/itemType.d.ts

@@ -8,6 +8,7 @@ import { DSelectProps } from '../../DSelect';
 import { DCascaderProps } from '../../DCascader';
 import { DTreeSelectProps } from '../../DTreeSelect';
 import { DUploadProps } from '../../DUpload';
+import { IPAddressProps } from '../../IPAddress';
 export declare type DItemBaseProps = {
     /** label标签文本,同antd Form.Item的label,只能是string */
     label?: string;
@@ -30,6 +31,9 @@ declare type CustomItemProps = DItemBaseProps & HTMLAttributes<HTMLElement> & {
 declare type DInputItemProps = {
     renderType?: 'dInput';
 } & DItemBaseProps & DInputProps;
+declare type DIpAddressProps = {
+    renderType?: 'ipAddress';
+} & DItemBaseProps & IPAddressProps;
 declare type InputItemProps = {
     renderType?: 'input';
 } & DItemBaseProps & InputProps;
@@ -111,5 +115,5 @@ declare type ButtonItemProps = {
 declare type DividerItemProps = {
     renderType?: 'divider';
 } & DItemBaseProps & DividerProps;
-export declare type DItemProps = CustomItemProps | DInputItemProps | InputItemProps | TextAreaItemProps | PasswordItemProps | InputNumberItemProps | AutoCompleteItemProps | DSelectItemProps | SelectItemProps | DCascaderItemProps | CascaderItemProps | DTreeSelectItemProps | TreeSelectItemProps | DatePickerItemProps | TimePickerItemProps | RangePickerItemProps | MentionItemProps | CheckboxItemProps | CheckboxGroupProps | DCheckboxGroupProps | RadioItemProps | RadioGroupProps | DRadioGorupProps | RateItemProps | SliderItemProps | SwitchItemProps | TransferItemProps | UploadItemProps | DUploadItemProps | ButtonItemProps | DividerItemProps;
+export declare type DItemProps = CustomItemProps | DInputItemProps | DIpAddressProps | InputItemProps | TextAreaItemProps | PasswordItemProps | InputNumberItemProps | AutoCompleteItemProps | DSelectItemProps | SelectItemProps | DCascaderItemProps | CascaderItemProps | DTreeSelectItemProps | TreeSelectItemProps | DatePickerItemProps | TimePickerItemProps | RangePickerItemProps | MentionItemProps | CheckboxItemProps | CheckboxGroupProps | DCheckboxGroupProps | RadioItemProps | RadioGroupProps | DRadioGorupProps | RateItemProps | SliderItemProps | SwitchItemProps | TransferItemProps | UploadItemProps | DUploadItemProps | ButtonItemProps | DividerItemProps;
 export {};

package/dist/esm/DForm/DItem/itemsRender.d.ts

@@ -8,6 +8,7 @@ import { DInputProps } from '../../DInput';
 import { DSelectProps } from '../../DSelect';
 import { DTreeSelectProps } from '../../DTreeSelect';
 import { DUploadProps } from '../../DUpload';
+import { IPAddressProps } from '../../IPAddress';
 import { DItemBaseProps } from './itemType';
 declare const renderMap: {
     dInput: (props: DInputProps, formItemProps: FormItemProps, label: DItemBaseProps['label']) => import("react/jsx-runtime").JSX.Element;
@@ -15,6 +16,7 @@ declare const renderMap: {
     textArea: (props: TextAreaProps, formItemProps: FormItemProps, label: DItemBaseProps['label']) => import("react/jsx-runtime").JSX.Element;
     password: (props: PasswordProps, formItemProps: FormItemProps, label: DItemBaseProps['label']) => import("react/jsx-runtime").JSX.Element;
     inputNumber: (props: InputNumberProps, formItemProps: FormItemProps, label: DItemBaseProps['label']) => import("react/jsx-runtime").JSX.Element;
+    ipAddress: (props: IPAddressProps, formItemProps: FormItemProps) => import("react/jsx-runtime").JSX.Element;
     autoComplete: (props: AutoCompleteProps, formItemProps: FormItemProps, label: DItemBaseProps['label']) => import("react/jsx-runtime").JSX.Element;
     dSelect: (props: DSelectProps, formItemProps: FormItemProps, label: DItemBaseProps['label']) => import("react/jsx-runtime").JSX.Element;
     select: (props: SelectProps, formItemProps: FormItemProps, label: DItemBaseProps['label']) => import("react/jsx-runtime").JSX.Element;

package/dist/esm/DForm/DItem/itemsRender.js

@@ -13,6 +13,7 @@ import DInput from "../../DInput";
 import DSelect from "../../DSelect";
 import DTreeSelect from "../../DTreeSelect";
 import DUpload from "../../DUpload";
+import IPAddress from "../../IPAddress";
 import { jsx as _jsx } from "react/jsx-runtime";
 var renderMap = {
   dInput: function dInput(props, formItemProps, label) {
@@ -50,6 +51,11 @@ var renderMap = {
       }, props))
     }));
   },
+  ipAddress: function ipAddress(props, formItemProps) {
+    return /*#__PURE__*/_jsx(Form.Item, _objectSpread(_objectSpread({}, formItemProps), {}, {
+      children: /*#__PURE__*/_jsx(IPAddress, _objectSpread({}, props))
+    }));
+  },
   autoComplete: function autoComplete(props, formItemProps, label) {
     var _props = props;
     return /*#__PURE__*/_jsx(Form.Item, _objectSpread(_objectSpread({}, formItemProps), {}, {
@@ -128,6 +134,7 @@ var renderMap = {
   },
   checkbox: function checkbox(props, formItemProps, label) {
     return /*#__PURE__*/_jsx(Form.Item, _objectSpread(_objectSpread({}, formItemProps), {}, {
+      valuePropName: "checked",
       children: /*#__PURE__*/_jsx(Checkbox, _objectSpread(_objectSpread({}, props), {}, {
         children: label
       }))
@@ -140,6 +147,7 @@ var renderMap = {
   },
   radio: function radio(props, formItemProps, label) {
     return /*#__PURE__*/_jsx(Form.Item, _objectSpread(_objectSpread({}, formItemProps), {}, {
+      valuePropName: "checked",
       children: /*#__PURE__*/_jsx(Radio, _objectSpread(_objectSpread({}, props), {}, {
         children: label
       }))

package/dist/esm/DForm/helper.d.ts

@@ -1,3 +1,5 @@
+export declare function cloneDeep<T>(value: T): T;
+export declare function mergeWith<T, S>(object: T, source: S, customizer?: (_objValue: any, _srcValue: any, _key: string | number) => any): T & S;
 /** 合并对象 */
 declare function merge(object: any, sources: any, customizer?: (objValue: any, srcValue: any) => any): any;
 declare const _default: {